瀏覽器緩存機制和設置

對緩存講述很不錯的相關文章：

轉載出處，瀏覽器緩存機制剖析，徹底理解瀏覽器的緩存機制，深入理解瀏覽器的緩存機制

強制緩存和協商緩存

瀏覽器的緩存機制也就是我們說的HTTP緩存機制，其機制是根據HTTP報文的緩存標識進行的。瀏覽器的緩存機制和設置在前端的使用中很重要。我們今天就對此好好的分析一下。

瀏覽器緩存分爲兩種，一種是強緩存，一種是協商緩存。

強緩存

先了解一下強緩存。

首先，瀏覽器會先構造一個http請求，這個請求會發送給瀏覽器緩存。

如果瀏覽器緩存有當前資源且未過期，直接返回。如果沒有，重新發送到指定服務器獲取資源。

打開控制檯，刷新頁面，會發現有大量的http請求返回200的。其size是disk cache 或者是memory cache。這用的就是強緩存。

那麼緩存規則是什麼呢？

服務器的返回報文中，存在 Expires 和 Cache-Control  兩個字段控制。

Expires

這個字段是http 1.0 的字段。其值是該緩存的到期時間。

示例：Expires: Wed, 21 Oct 2015 07:28:00 GMT 

Cache-Control

這個字段是http 1.1 的字段， 如果同時和 Expires 存在，則按這個爲準。 

一般取以下幾個值：

• public：表明響應可以被任何對象（包括：發送請求的客戶端，代理服務器）緩存
• private：表明響應只能被單個用戶緩存，代理服務器不能緩存它。
• no-cache：在發佈緩存副本之前，強制要求緩存把請求提交給原始服務器進行驗證。
• no-store：不緩存。

可以設置 max-age=<seconds>：緩存存儲的最大週期，超過這個時間緩存被認爲過期(單位秒)。

協商緩存

在強緩存失效後，會執行協商緩存。

瀏覽器會攜帶標識符請求服務器。

服務器根據標識符決定是否使用緩存。

 

                               

 

其中 Etag/If-None-Match 和  Last-Modified/If-Modified-Since 成對存在。

Etag是返回資源的一個哈希值，請求的時候會掛到If-None-Match屬性上。服務器根據這個哈希值返回200還是304。

Last-Modified 和If-Modified-Since是http 1.0字段。

Last-Modified是返回的資源的最後修改時間。服務器根據此值和資源的修改時間比較，如果有修改，則返回200，否則返回304.

Etag/If-None-Match的優先級大於Last-Modified/if-Modified-Since

總結

瀏覽器緩存機制基本就這些了，應該可以很清晰了。