瀏覽器HTTP的快取機制

瀏覽器快取機制，其實主要就是http協議定義的快取機制(如：expires、cache-control等)。

可是也有非http協議定義的快取機制。如使用html標籤，web開發人員能夠在html頁面的節點中增加標籤。**例如以下：

上述**的作用是告訴瀏覽器當前頁面不被快取。每次訪問都須要去server拉取。使用上非常easy，但唯獨部分瀏覽器能夠支援，並且全部快取**server都不支援，由於**不解析html內容本身。

![這裡寫描寫敘述](

當我們隨便點開乙個靜態資源是這樣的：

接下來我們了解一下http報文中與快取相關的首部字段：

1、通用首部字段：(就是請求報文和響應報文都能用上的字段)

2、請求首部字段：

為了方便模擬各種快取效果，建乙個非常easy的場景。

1、頁面檔案

快取場景模擬title>

2、首部字段改動有時候一些瀏覽器會自行給請求首部加上一些字段(如：chrome使用f5會強制加上」cache-control:max-age=0」)，會覆蓋一些字段(比方pragma)的功能；另外有時候我們希望server能多/少返回一些響應字段。

1、pragma

當該字段值為」no-cache」的時候，會知會client不要對該資源讀取快取，即每次都向server傳送一次請求才行。

pragma屬於通用首部字段，在client上使用時。常規要求我們往html上加上這段meta元素標籤。

它告訴瀏覽器每次請求頁面時不要讀快取。都得往server發一次請求才行。

可是，其實這樣的禁用快取的形式用處非常有限：

1、僅有ie才幹識別這段meta標籤的含義。其它主流瀏覽器僅能識別」cache-control:no-store」的meta標籤。

2、在識別ie瀏覽器中識別到該標籤的含義，並不一定會在請求欄位上加上pragma，但的確會讓當前頁面每次都傳送新請求。

2、expires

有了pragma來禁用快取。自然也須要有個東西來啟用快取和定義快取時間。對http1.0而言，expires就是做這件事的首部字段。

expires的值相應乙個gmt，比方「mon, 22 jul 2002 11:12:01 gmt」來告訴你瀏覽器資源快取過期時間，假設還沒過該時間則不發請求。

語法：

http-equiv='expires'
content='mon, 18 apr 2016 14:30:00 gmt'>

假設希望在ie下頁面下不走快取，希望每次重新整理頁面都能發新請求，那麼能夠把「content」裡的值寫為」-1」或「0」。

值得注意的是該方式只作為知會ie快取時間的標記，你並不能在請求或響應報文中找到expires欄位。

我們通過pragma禁用快取，又給expires定義乙個還未到期的時間（紅框），重新整理頁面時發現均發起了新請求（藍框），這意味著pragma欄位的優先順序會更高。

可是。響應報文中expires所定義的快取時間是相對server上的時間而言的，假設client上的時間跟server上的時間不一致（特別是使用者改動了自己電腦的系統時間），那快取時間可能就沒啥意義了。

2、cache-control

針對上述的「expires時間是相對server而言，無法保證和client時間統一」的問題。http1.1新增了 cache-control 來定義快取過期時間。若報文中同一時候出現了 pragma、expires 和 cache-control，會以 cache-control 為準。

cache-control也是乙個通用的首部字段。這意味著它能分別在請求報文和響應報文中使用。

"cache-control":"cache-directive"

作為請求首部時，cache-directive的可選值有：

作為響應首部時，cache-directive的可選值有：

我們依然能夠在html頁面加上meta標籤來給請求報頭加上cache-control欄位：

另外。cache-control同意自由組合可選值，比如：

cache -control：max -age =3600，must-revalidate

它意味著該資源是從原server上取得的。且其快取（新奇度）的有效時間為一小時，在興許一小時內，使用者又一次訪問該資源則無須傳送請求。

當然這樣的組合的方式也會有些限制。比方 no-cache 就不能和 max-age、min-fresh、max-stale 一起搭配使用。

組合的形式還能做一些瀏覽器行為不一致的相容處理。比如在ie我們能夠使用 no-cache 來防止點選「後退」button時頁面資源從快取載入。但在 firefox 中。須要使用 no-store 才幹防止歷史回退時瀏覽器不從快取中去讀取資料，故我們在響應報頭加上例如以下組合值就可以做相容處理：

cache -control: no-cache, no-store

未完，待續。。