瀏覽器快取

我們知道通過http協議，在客戶端和瀏覽器建立連線時需要消耗時間，而大的響應需要在客戶端和伺服器之間進行多次往返通訊才能獲得完整的響應，這拖延了瀏覽器可以使用和處理內容的時間。這就增加了訪問伺服器的資料和資源的成本，因此利用瀏覽器的快取機制重用以前獲取的資料就變成了效能優化時需要考慮的事情。

為每個資源指定乙個明確的快取策略，用以定義資源是否可以快取，由誰來快取，可以快取多久，並且在快取時間到期時如何有效地重新驗證。當伺服器返回乙個響應時，它需要在響應頭中提供cache-control和etag。

說到瀏覽器中的快取機制，其實就相當於http協議定義的快取機制，因為瀏覽器為我們實現了它。一般情況下我們會想到到http響應頭中的expires，cache-control,last-modified.if-modified-since,etag這樣的與快取相關的響應頭資訊。

但是這裡我們說伺服器返回乙個響應時提供必要的cache-control和etag即可。這是為什麼呢？

因為cache-control與expires的作用一致，last-modified與etag的作用也相近。但它們有以下區別：

現在預設瀏覽器均預設使用http 1.1，所以expires和last-modified的作用基本可以忽略，具備cache-control和etag即可。

當然使用者的行為也會影響瀏覽器的快取，像這樣：

通常情況下，請求乙個資源的過程大概是這樣的

etag的主要作用

伺服器通過 etag http 頭傳遞驗證碼，大概是像『『x123cef』』這樣的字串。當瀏覽器在資源過期後再次請求時，瀏覽器缺省會通過if-none-match傳遞etag的驗證碼，通過驗證碼可以進行高效的資源更新檢查：如果資源未更改，則不會傳輸任何資料。

etag就主要用來在響應過期之後，驗證資源是否被修改。

etag的工作原理

伺服器響應瀏覽器請求時響應頭中的cache-control響應頭使得每個資源都可以通過 cache-control http 頭來定義自己的快取策略，cache-control 指令用來告訴我們，那個資源在什麼條件下可以快取，以及可以快取多久

1、cache-control頭引數的含義(響應頭中的cache-control)

2、如何使用cache-control

通過下圖的流程來設定合適的響應頭的cache-control頭

一般情況下，瀏覽器發出的所有 http 請求會首先被路由到瀏覽器的快取，以檢視是否快取了可以用於實現請求的有效響應。如果有匹配的響應，會直接從快取中讀取響應，這樣就避免了網路延遲以及傳輸產生的資料成本。然而，如果我們希望更新或廢棄已快取的響應，該怎麼辦？

假設我們已經告訴訪問者某個 css 樣式表快取長達 24 小時 (max-age=86400)，但是設計人員剛剛提交了乙個更新，我們希望所有使用者都能使用。我們該如何通知所有訪問者快取的 css 副本已過時，需要更新快取？

實際上以前沒有請求過該資源的新的使用者會得到更新的資源，但是請求過資源的使用者將在過期時間達到之前一直得到舊的被快取的資源，直到他手動的去清理了瀏覽器的快取。手動清理瀏覽器快取這種事可能只有程式設計師才會做，那麼我們要怎麼做才能讓使用者得到更新後的資源呢？