瀏覽器緩存
1、瀏覽器第一次打開一個網頁獲取資源后,根據返回的header(響應頭)信息來告訴如何緩存資源。
2、瀏覽器后續請求
3、瀏覽器在請求某一資源時,會先獲取該資源緩存的header信息,判斷是否命中強緩存(cache-control和expires信息),若命中直接從緩存中獲取資源信息,包括緩存header信息,本次請求不會與服務器進行通信,此時返回的狀態碼為200
4、如果沒有命中強緩存,瀏覽器會發送請求到服務器,請求會攜帶第一次返回的有關緩存的header字段信息(Last-Modified/If-Modified-Since 和 etag/If-None-Match)
5、由服務器根據header信息來對比結果是否協商緩存命中。若命中,則服務返回新的響應頭header信息更新緩存中的對應header信息,和304狀態碼,但是不會返回資源內容,它會告知瀏覽器可以直接從緩存獲取;否則返回最新的資源內容。
// 協商緩存
// 第一次返回的響應頭
Last-Modified: Mon, 02 Jul 2018 08:21:56 GMT
etag: "20e340c70bd7c739e5e633b5c0ee705a"
// 如果強緩存失效,則請求的時候,瀏覽器會帶上第一次響應頭的Last-Modified 和 etag的值得
If-Modified-Since: Mon, 02 Jul 2018 08:21:56 GMT // 上次返回的Last-Modified的值
If-None-Match: "20e340c70bd7c739e5e633b5c0ee705a" // 上次返回的etag的值
流程圖如下:
強緩存與協商緩存的區別:
緩存 | 獲取資源形式 | 狀態碼 | 發送請求到服務器 |
---|---|---|---|
強緩存 | 從緩存取 | 200(from cache) | 否,直接從緩存取 |
協商緩存 | 從緩存取 | 304(not modified) | 是,通過服務器告知瀏覽器緩存是否可用 |
協商緩存header字段
響應頭信息:
1.etag:服務器響應時,告訴瀏覽器當前資源在服務器的唯一標識(生成規則由服務器決定)。
2.Last-Modified:表示這個響應資源的的最后修改時間。
請求頭信息:
1.If-None-Match: 當資源過期時候,瀏覽器法相響應頭里有Etag,則再次向服務器請求時帶上請求頭if-none-match(值是etag的值)。服務器收到請求進行對比,決定返回200 或者304
2、If-Modified-Since:當資源過期時(瀏覽器判斷cache-control標識的max-age過期),發現響應頭具有last-Modified聲明,則再次像服務器請求時帶上if-modified-since,表示請求時間。服務器收到請求后發現有if-modified-since則與被請求資源的最后修改時間進行對比(last-modified),若修改時間較新(大),說明資源又被改過,則返回最新資源,http 200 ok。若最后時間較小,說明資源無修改,響應http 304走緩存
為什么既有last-modified 還有etag,兩者並存的好處?
http1.1中etag的出現主要是為了解決幾個last-modified比較難解決的問題
一些文件也許會周期性的更改,但是他的內容並不改變(僅僅改變的修改時間),這個時候我們並不希望客戶端認為這個文件被修改了,而重新GET;
某些文件修改非常頻繁,比如在秒以下的時間內進行修改,(比方說1s內修改了N次),If-Modified-Since能檢查到的粒度是s級的,這種修改無法判斷(或者說UNIX記錄MTIME只能精確到秒)。
某些服務器不能精確的得到文件的最后修改時間。
這時,利用Etag能夠更加准確的控制緩存,因為Etag是服務器自動生成或者由開發者生成的對應資源在服務器端的唯一標識符。
Last-Modified與ETag是可以一起使用的,服務器會優先驗證ETag,一致的情況下,才會繼續比對Last-Modified,最后才決定是否返回304。
用戶行為對緩存的影響
用戶操作 | Expires/Cache-Control | Last-Modified/Etag |
---|---|---|
地址欄回車 | 有效 | 有效 |
頁面鏈接跳轉 | 有效 | 有效 |
新開窗口 | 有效 | 有效 |
前進后退 | 有效 | 有效 |
F5刷新 | 無效 | 有效 |
Ctrl+F5強制刷新 | 無效 | 無效 |
文章只是之前在網上學習的筆記,如有雷同,請聯系