利用瀏覽器緩存,能夠使得頁面加載速度提升,也減輕服務端壓力。有幾個比較重要點以下:html
1. 瀏覽器是如何判斷緩存是否過時?瀏覽器
2. 服務端如何判斷緩存已失效?緩存
3. 爲何有了Last-Modified還要Etag?服務器
4. 200 OK( from cache )和 304 Not Modified的區別?spa
下面是我總結的頁面利用瀏覽器緩存的過程(圖示):代理
瀏覽器是如何判斷緩存是否過時?htm
應該是根據Response Header裏面的Cache-Control和Expires這兩個屬性,當兩個都存在時,Cache-Control優先級較高。blog
Cache-Control索引
該字段用於控制瀏覽器在什麼狀況下直接使用本地緩存而不向服務器發送請求。通常具備如下值:資源
Public:指示響應可被任何緩存區緩存。
Private:指示對於單個用戶的整個或部分響應消息,不能被共享緩存處理。這容許服務器僅僅描述當用戶的部分響應消息,此響應消息對於其餘用戶的請求無效。
no-cache:指示請求或響應消息不能緩存。
no-store:用於防止重要的信息被無心的發佈。在請求消息中發送將使得請求和響應消息都不使用緩存。
max-age:指示瀏覽器能夠接收生存期不大於指定時間(以秒爲單位)的響應。
min-fresh:指示瀏覽器能夠接收響應時間小於當前時間加上指定時間的響應。
max-stale:指示瀏覽器能夠接收超出超時期間的響應消息。若是指定max-stale消息的值,那麼瀏覽器能夠接收超出超時期指定值以內的響應消息。
PS:其實主要關注max-age這個值就好了。
Expires
Expires 頭部字段提供一個日期和時間,在該日期前的全部對該資源的請求都會直接使用瀏覽器緩存而不用向服務器請求。
例如:
Expires: Sun, 08 Nov 2009 03:37:26 GMT
注意:
1. cache-control max-age 和 max-stale將覆蓋Expires header。
2. 使用Expires存在服務器端時間和瀏覽器時間不一致的問題。
3. 另外有人說Expires 是HTTP 1.0的東西,如今默認瀏覽器均默認使用HTTP 1.1,因此它的做用基本忽略(暫不明瞭)。
服務端如何判斷緩存已失效?
服務端經過If-Modified-Since(Last-Modified)和If-None-Match(Etag)這兩個屬性的值來判斷緩存是否失效的。
Last-Modified/If-Modified-Since
Last-Modified/If-Modified-Since要配合Cache-Control使用。
Last-Modified:響應資源的最後修改時間。
If-Modified-Since:當緩存過時時,發現資源具備Last-Modified聲明,則在請求頭帶上If-Modified-Since(值就是Last-Modified)。服務器收到請求後發現有頭If-Modified-Since則與被請求資源的最後修改時間進行比對。若最後修改時間較新,說明資源又被改動過,則響應HTTP 200整片資源內容(寫在響應消息包體內);若最後修改時間較舊,說明資源無新修改,則響應HTTP 304,告知瀏覽器繼續使用所保存的cache。
Etag/If-None-Match
Etag/If-None-Match也要配合Cache-Control使用。
Etag:資源在服務器的惟一標識(生成規則由服務器決定)。Apache中,ETag的值,默認是對文件的索引節(INode),大小(Size)和最後修改時間(MTime)進行Hash後獲得的。
If-None-Match:當緩存過時時,發現資源具備Etage聲明,則在請求頭帶上If-None-Match(值就是Etag)。服務器收到請求後發現有頭If-None-Match 則與被請求資源的相應校驗串進行比對,決定返回200或304。
爲何有了Last-Modified還要Etag?
Etag的出現主要是爲了解決幾個Last-Modified比較難解決的問題:
1. Last-Modified標註的最後修改只能精確到秒級,若是某些文件在1秒鐘之內,被修改屢次的話,它將不能準確標註文件的修改時間。
2. 若是某些文件會被按期生成,當有時內容並無任何變化,但Last-Modified卻改變了,致使文件無法使用緩存。
3. 有可能存在服務器沒有準確獲取文件修改時間,或者與代理服務器時間不一致等情形。
200 OK( from cache )和 304 Not Modified的區別?
200 OK( from cache )不向服務器發送請求,直接使用本地緩存文件。304 Not Modified則向服務器詢問,若服務器認爲瀏覽器的緩存版本還可用,那麼便會返回304。
200 OK( from cache ) 出現操做:
1.地址欄回車
2.頁面連接跳轉
3.前進、後退
304 Not Modified 出現操做:
1.F5刷新
2.新開窗口
PS:可是這樣不是絕對,仍是會有奇怪的狀況,例如百度首頁不管是怎麼刷,都是200 from cache。
總結
在寫完這篇文章時候,有些地方我仍是不大清楚的,就好比爲何百度首頁不管是怎麼刷,都是200 from cache。200 from cache和304 Not Modified出現條件並無什麼定論。
參考文獻
1. 《再記:瀏覽器緩存200(from cache)和304小結》
本文爲原創文章,轉載請保留原出處,方便溯源,若有錯誤地方,謝謝指正。