摘要：協商緩存未設置上面兩個字段時為此模式，則為通用的默認緩存模式，通過對比服務器文件更新時間，和源服務器文件每次更新時，自動生成的版本號，來判斷是發送新文件，還是返回狀態碼，來告知瀏覽器使用瀏覽器緩存。

請求一個頁面或文件時，觀察開發者工具中的Network頁簽中，此文件的請求狀態，會發現常見的會出現200或304狀態，作為前端開發，200狀態最為熟悉，而304，也是成功的請求，只不過是使用了本地緩存而已。

使用本地緩存，至少有兩個好處：

加快頁面的展示速度，因為不用再從服務器把文件下載一遍。

能極大的節約服務器寬帶。

可能縮短用戶的展示速度，只是提高用戶體驗，對開發人員沒太多益處（當然作為有責任感的開發，這點也不能忽略），但節約服務器寬帶，則能給技術開發人員減少極大的壓力了。

所以得學。

要說緩存，首先需要了解請求頭。
每一個請求，發出的時候，會自帶一個請求頭：Request Headers；
響應返回的時候，自帶一個響應頭：Response Headers；

緩存主要由服務器響應時，在響應頭中設置緩存方案，主要是設置兩個字段：

expires：不支持HTTP1.1及更高級的HTTP版本，設置一個資源到期時間點。

cache-control：只支持HTTP1.1和更高級的HTTP版本，優先級高于expires，能控制本地緩存（私有緩存，或者成為瀏覽器緩存）和共享緩存（代理服務器緩存）

瀏覽器的HTTP緩存分為兩種：

強緩存：手動設置了expires或cache-control。

協商緩存：未設置上面兩個字段時為此模式，則為通用的默認緩存模式，通過對比服務器文件更新時間Last-Modified，和源服務器文件每次更新時，自動生成的版本號ETag，來判斷是發送新文件，還是返回狀態碼304，來告知瀏覽器使用瀏覽器緩存。

注：強緩存只是設置時間間隔，減少了刷新時請求服務器的次數，當請求發出后，同樣也是使用協商緩存模式處理。

本文以下出現的服務器，如無特殊說明，指的是直接能訪問到的服務器，比如若有代理服務器，則指的是代理服務器；若無代理服務器，則為源服務器。

第一次請求資源，沒有任何緩存的余地，請求頭中的相關字段如下：

cache-control 當前瀏覽器的緩存情況：


no-cache：一般為第一次請求、或強制刷新、或明確設置no-store的不緩存時，告知后臺我這兒完全沒有緩存，返回值正常為200

不會發出請求：非頁面html文件，設置了緩存時間，且此文件尚未過期，狀態碼200

max-age=0：當前的頁面htlm文件，每次打開頁面都會請求一次，狀態值200或304

沒有此字段：非第一次，設置了過期時間，但是過期了



if-modified-since 非第一次請求，才會有：
用于協商緩存，判斷文件有沒有更新的依據，內容是上次響應時返回的Last-Modified字段，意思是服務器此文件的最后更新時間


If-None-Match：非第一次請求，才會有：
用于協商緩存，判斷文件有沒有更新的依據，內容是上次響應時返回的ETag字段，意思是服務器此文件的最后一個更新時，服務器隨機生成的版本號

Pragma 只第一次請求出現，值為no-cache，效果和cache-control: "no-cache" 等同，用于兼容http1.0

設置位置：

web服務器設置，比如 nginx Apache等（推薦）
若為前后臺未分離項目，可由后臺代碼中設置
可由前端，在html頁面中，使用標簽設置

相關字段說明:

expires 到期時間
已被cache-control取代，其值類似于："Wed, 08 Jan 2020 08:25:55 GMT"

cache-control 緩存執行方案設置的常用值：

max-age=秒數：單位為秒的時間間隔，向服務器請求一次之后，再次想要請求時的間隔未超過此時間，則不會發出請求，直接使用本地緩存，狀態碼200；直到時間超過，才能發出請求，但如果服務器對比后，發現此文件未變化，則返回304，仍是使用緩存，若變化了，才會發送新文件，并返回200

s-maxage=秒數：功能同max-age=秒數，只對代理服務器生效，優先級高于max-age=秒數


private：只允許瀏覽器緩存

public：可以被代理服務器緩存

must-revalidate：表示瀏覽器中的文件被命中，必須要檢查源服務器是否有更新，即使已經有緩存

proxy-revalidata：表示代理服務器每次被請求，必須要檢查源服務器是否有更新，即使已經有緩存

no-cache：看似是不緩存，其實仍然有緩存，只不過每次都會向源服務器對比一下文件，仍會出現304

no-store：瀏覽器和代理服務器真實不緩存，每次都直接請求并獲取文件

Date: 此文件在頁面中被使用的時間
最近一次向服務器請求時，服務器返回的時間，若最近幾次刷新，都直接使用了瀏覽器緩存，沒有發出請求，則值不變，其值類似"Tue, 08 Jan 2019 08:14:59 GMT其值類似



Last-Modified 服務器中，此文件的最后更新時間
當瀏覽器再次發出請求此文件時，會把此值放在請求頭If-Modified-Since字段中（見上面請求頭說明），其值類似"Tue, 08 Jan 2019 06:45:12 GMT"



ETag 每次源服務器的文件更新，自動生成的文件的版本號，HTTP1.1才支持
當瀏覽器再次發出請求此文件時，會把此值放在請求頭If-None-Match字段中（見上面請求頭說明），優先級高于Last-Modified，其值類似"5c3446f8-57b"



注：HTTP1.0于1996年提出，HTTP1.1于1999年提出，HTTP2.0于2015年提出，當前應用最廣泛的為HTTP1.1。
注：當使用PUT方法，對服務器資源進行更新的時候，請求頭可能還會出現If-Match這個字段，這個字段與If-None-Match在使用方式類似，但功能不同；
這個字段會把舊文件的Etag帶給服務器，服務器在對比當前文件的Etag是否和If-None-Match（舊文件的Etag）相同，如果相同，說明此時服務器仍是舊文件，則可以覆蓋更新；若不同，說明此文件已被更新過，不再進行預期的覆蓋更新。

以下為響應頭設置不同的cache-control，在非html文件、不同的請求方式時，請求的情況和請求頭的cache-control的值，和網絡和資源正常時，狀態碼的值。

html文件再第一次請求，和以上的資源情況相同，且無論首次的響應頭中cache-control為何值，非第一次請求的請求頭中的cache-control字段均為max-age=0，使用協商緩存。

html文件是整個頁面的入口，只要html未發生變化，那說明引用的資源的名字，是沒有發生變化的，資源的請求動向會符合上面的表格；如果發生了變了，那新變化的資源，都會進行首次請求（如果很早之前，這個資源被使用過，則同樣走上面的表格）。

WebKit內核，將資源分為兩個大類，一個是主資源，比如html文件和下載項；二是派生資源，比如頁面中的圖片、js、css等資源。

如果主資源訪問失敗，那會立刻進行報錯，比如404（不存在該資源），403（資源拒絕此次訪問）等等；
只要主資源可以訪問完成，那么基礎的頁面就可以展示了，此時如果其他的派生資源，比如css樣式文件，js腳本文件，圖片文件等資源無法訪問，也只會在控制臺進行報錯。

當前前端緩存的文件，主要有兩個位置：

from memory cache：緩存在內存中，當瀏覽器關閉，資源清除，也就是緩存被清除。

from disk cache：緩存在磁盤中，可以長久緩存，即使電腦重啟也無妨，但只能緩存派生資源。

這個位置，是可以在前臺的控制臺的network頁簽中看到的，且也只有當用到該緩存的文件時，才會展示，如下圖所示：

在Size一欄中，270B表示發出了請求，表示了該文件的大小；
from memory cache就顯而易見了，表示未發出請求，直接從內存中拿的現有的已緩存的資源；
from disk cache同樣表示未發出請求，只不過是從磁盤中直接拿的資源；

HTTP1.0最早在網頁中使用是在1996年，那個時候只是使用一些較為簡單的網頁上和網絡請求上，而HTTP1.1則在1999年才開始廣泛應用于現在的各大瀏覽器網絡請求中，同時HTTP1.1也是當前使用最為廣泛的HTTP協議。 主要區別主要體現在：

緩存處理，在HTTP1.0中主要使用header里Last-Modified和Expires來，來實現協商緩存，而HTTP1.1則引入了更多的緩存控制策略例如Etag，If-Unmodified-Since（用于斷點續傳），cache-control, If-None-Match等更多可供選擇的緩存頭來控制緩存策略。
帶寬優化及網絡連接的使用，HTTP1.0中，存在一些浪費帶寬的現象，例如客戶端只是需要某個對象的一部分，而服務器卻將整個對象送過來了，并且不支持斷點續傳功能，HTTP1.1則在請求頭引入了range頭域，它允許只請求資源的某個部分，即返回碼是206（Partial Content），這樣就方便了開發者自由的選擇以便于充分利用帶寬和連接。
錯誤通知的管理，在HTTP1.1中新增了24個錯誤狀態響應碼，如409（Conflict）表示請求的資源與資源的當前狀態發生沖突；410（Gone）表示服務器上的某個資源被永久性的刪除。
Host頭處理，在HTTP1.0中認為每臺服務器都綁定一個唯一的IP地址，因此，請求消息中的URL并沒有傳遞主機名（hostname）。但隨著虛擬主機技術的發展，在一臺物理服務器上可以存在多個虛擬主機（Multi-homed Web Servers），并且它們共享一個IP地址。HTTP1.1的請求消息和響應消息都應支持Host頭域，且請求消息中如果沒有Host頭域會報告一個錯誤（400 Bad Request）。
長連接，HTTP 1.1支持長連接（PersistentConnection）和請求的流水線（Pipelining）處理，在一個TCP連接上可以傳送多個HTTP請求和響應，減少了建立和關閉連接的消耗和延遲，在HTTP1.1中默認開啟Connection： keep-alive，一定程度上彌補了HTTP1.0每次請求都要創建連接的缺點。

注：參考鏈接：HTTP1.0、HTTP1.1 和 HTTP2.0 的區別

HTTPS：是以安全為目標的HTTP通道，簡單講是HTTP的安全版，即HTTP下加入SSL層，HTTPS的安全基礎是SSL，因此加密的詳細內容就需要SSL。

HTTPS協議需要到CA申請證書，一般免費證書很少，需要交費。
HTTP協議運行在TCP之上，所有傳輸的內容都是明文，HTTPS運行在SSL/TLS之上，SSL/TLS運行在TCP之上，所有傳輸的內容都經過加密的。
HTTP和HTTPS使用的是完全不同的連接方式，用的端口也不一樣，前者是80，后者是443。
HTTPS可以有效的防止運營商劫持，解決了防劫持的一個大問題。

注：參考鏈接：HTTP與HTTPS的區別