瀏覽器的快取機制

1:快取型別

1：強快取

2：協商快取

2: 協商快取：會向伺服器傳送請求，伺服器會根據request header裡面的引數判斷是否命中快取，如果命中就會返回304，並且帶上新的response header返回通知瀏覽器從快取檔案裡面讀取資料。

2: 與強快取相關的request header

1: expires

2: cache-control

1: expires: wed, 21 oct 2015 07:28:00 gmt

2: cache-control: 'max-age=60'

跟協商快取相關的header主要有四個，其中request header 2個，response header 2個。

1: request header

1: if-none-match

2: if-modified-since

1: etag

2: last-modified

etag

etag是資源的唯一標識，只要資源發生變化，etag就是重新生成。etag會在上一次資源載入時，通過reponse header返回，瀏覽器會把這個etag儲存起來。

last-modified

last-modified是資源最後一次被修改的時間，也是通過response header返回，瀏覽器也會把這個時間儲存起來。

2: 再來看看這2個response header怎麼用

瀏覽器在請求的時候，會把etag的值賦給if-none-match；把last-modified的值給if-modified-since,也就是：

if-none-match: $

if-modified-since: $

這兩隊的作用是一樣的，但是都有各自的優缺點：

1: 精確度

etag > last-modified

因為last-modified的精讀是秒，如果乙個檔案在一秒之內改變了很多次，那last-modified不會變。但是etag是只要資源發生變化，etag就會更新，那快取的命中率就會高一些，也可以說是更精確。

2: 效能

last-modified > etag

因為last-modified只需要儲存乙個時間值就好，而etag需要伺服器用演算法算乙個hash值。

3: 優先順序

etag> last-modified

瀏覽器快取機制

最近在準備優化日誌請求時遇到了一些令人疑惑的問題，比如為什麼響應頭里出現了兩個 cache control 為什麼明明設定了 no cache 卻還是發請求，為什麼多次訪問時有時請求裡帶了 etag，有時又沒有帶？等等。後來查了一些資料以及同事親自驗證，總算對這些問題有了個清晰的理解，現在整理出來以...

瀏覽器快取機制

當我們瀏覽乙個頁面發現有異常時，通常考慮的就是書不是瀏覽器做了快取呢，按ctrl f5重新請求一次就能請求到沒有快取的頁面，這個是為什麼呢。首先，ctrl f5組合鍵重新整理頁面，那麼瀏覽器會直接向目標url傳送請求，而不再使用瀏覽器快取的資料。其次，當請求到達伺服器端依然有可能出現使用伺服器端的資...

瀏覽器快取機制

瀏覽器快取機制 瀏覽器快取機制，其實主要就是 協議定義的快取機制 如 expires cache control 等 但是也有非 協議定義的快取機制，如使用 html meta 標籤，web 開發者可以在 html 頁面的節點中加入 標籤，如下 上述 的作用是告訴瀏覽器當前頁面不被快取，每次訪問都需...