什么是瀏覽器緩存

Web緩存是指一個(gè)Web資源（如html頁(yè)面，圖片，js，數(shù)據(jù)等）存在于Web服務(wù)器和客戶端（瀏覽器）之間的副本。緩存會(huì)根據(jù)進(jìn)來(lái)的請(qǐng)求保存輸出內(nèi)容的副本；當(dāng)下一個(gè)請(qǐng)求來(lái)到的時(shí)候，如果是相同的URL，緩存會(huì)根據(jù)緩存機(jī)制決定是直接使用副本響應(yīng)訪問(wèn)請(qǐng)求，還是向源服務(wù)器再次發(fā)送請(qǐng)求。

比較常見(jiàn)的就是瀏覽器會(huì)緩存訪問(wèn)過(guò)網(wǎng)站的網(wǎng)頁(yè)，當(dāng)再次訪問(wèn)這個(gè)URL地址的時(shí)候，如果網(wǎng)頁(yè)沒(méi)有更新，就不會(huì)再次下載網(wǎng)頁(yè)，而是直接使用本地緩存的網(wǎng)頁(yè)。

只有當(dāng)網(wǎng)站明確標(biāo)識(shí)資源已經(jīng)更新，瀏覽器才會(huì)再次下載網(wǎng)頁(yè)。瀏覽器和網(wǎng)站服務(wù)器是根據(jù)緩存機(jī)制進(jìn)行緩存的

非HTTP協(xié)議定義的緩存機(jī)制

瀏覽器緩存機(jī)制，其實(shí)主要就是HTTP協(xié)議定義的緩存機(jī)制（如： Expires； Cache-control等）。但是也有非HTTP協(xié)議定義的緩存機(jī)制，如使用HTML Meta 標(biāo)簽，Web開發(fā)者可以在HTML頁(yè)面的節(jié)點(diǎn)中加入標(biāo)簽

<meta http-equiv="Pragma" content="no-cache">

上述代碼的作用是告訴瀏覽器當(dāng)前頁(yè)面不被緩存，每次訪問(wèn)都需要去服務(wù)器拉取。使用上很簡(jiǎn)單，但只有部分瀏覽器可以支持，而且所有緩存代理服務(wù)器都不支持，因?yàn)榇聿唤馕鯤TML內(nèi)容本身。

緩存流程圖

利用瀏覽器緩存的過(guò)程：

HTTP緩存機(jī)制

根據(jù)Response Header里面的Cache-Control和Expires這兩個(gè)屬性，當(dāng)兩個(gè)都存在時(shí)，Cache-Control優(yōu)先級(jí)較高。

Cache-Control

該字段用于控制瀏覽器在什么情況下直接使用本地緩存而不向服務(wù)器發(fā)送請(qǐng)求。一般具有以下值：

• Public：指示響應(yīng)可被任何緩存區(qū)緩存。
• Private：指示對(duì)于單個(gè)用戶的整個(gè)或部分響應(yīng)消息，不能被共享緩存處理。這允許服務(wù)器僅僅描述當(dāng)用戶的部分響應(yīng)消息，此響應(yīng)消息對(duì)于其他用戶的請(qǐng)求無(wú)效。
• no-cache：指示請(qǐng)求或響應(yīng)消息不能緩存。
• no-store：用于防止重要的信息被無(wú)意的發(fā)布。在請(qǐng)求消息中發(fā)送將使得請(qǐng)求和響應(yīng)消息都不使用緩存。
• max-age：指示瀏覽器可以接收生存期不大于指定時(shí)間（以秒為單位）的響應(yīng)。
• min-fresh：指示瀏覽器可以接收響應(yīng)時(shí)間小于當(dāng)前時(shí)間加上指定時(shí)間的響應(yīng)。
• max-stale：指示瀏覽器可以接收超出超時(shí)期間的響應(yīng)消息。如果指定max-stale消息的值，那么瀏覽器可以接收超出超時(shí)期指定值之內(nèi)的響應(yīng)消息。

Expires（石器時(shí)代的緩存機(jī)制）

Expires 頭部字段提供一個(gè)日期和時(shí)間，在該日期前的所有對(duì)該資源的請(qǐng)求都會(huì)直接使用瀏覽器緩存而不用向服務(wù)器請(qǐng)求。

例如：Expires: Sun, 08 Nov 2009 03:37:26 GMT

注意：

• cache-control max-age 和 max-stale將覆蓋Expires header。
• 使用Expires存在服務(wù)器端時(shí)間和瀏覽器時(shí)間不一致的問(wèn)題。
• 另外有人說(shuō)Expires 是HTTP 1.0的東西，現(xiàn)在默認(rèn)瀏覽器均默認(rèn)使用HTTP 1.1。

服務(wù)端如何判斷緩存已失效

服務(wù)端通過(guò)If-Modified-Since（Last-Modified）和If-None-Match（Etag）這兩個(gè)屬性的值來(lái)判斷緩存是否失效的。

Last-Modified/If-Modified-Since

Last-Modified/If-Modified-Since要配合Cache-Control使用。

Last-Modified：響應(yīng)資源的最后修改時(shí)間。

If-Modified-Since：當(dāng)緩存過(guò)期時(shí)，發(fā)現(xiàn)資源具有Last-Modified聲明，則在請(qǐng)求頭帶上If-Modified-Since（值就是Last-Modified）。服務(wù)器收到請(qǐng)求后發(fā)現(xiàn)有頭If-Modified-Since則與被請(qǐng)求資源的最后修改時(shí)間進(jìn)行比對(duì)。若最后修改時(shí)間較新，說(shuō)明資源又被改動(dòng)過(guò)，則響應(yīng)HTTP 200整片資源內(nèi)容（寫在響應(yīng)消息包體內(nèi)）;若最后修改時(shí)間較舊，說(shuō)明資源無(wú)新修改，則響應(yīng)HTTP 304，告知瀏覽器繼續(xù)使用所保存的cache。

Etag/If-None-Match

Etag/If-None-Match也要配合Cache-Control使用。

Etag：資源在服務(wù)器的唯一標(biāo)識(shí)（生成規(guī)則由服務(wù)器決定）。Apache中，ETag的值，默認(rèn)是對(duì)文件的索引節(jié)（INode），大?。⊿ize）和最后修改時(shí)間（MTime）進(jìn)行Hash后得到的。

If-None-Match：當(dāng)緩存過(guò)期時(shí)，發(fā)現(xiàn)資源具有Etage聲明，則在請(qǐng)求頭帶上If-None-Match（值就是Etag）。服務(wù)器收到請(qǐng)求后發(fā)現(xiàn)有頭If-None-Match 則與被請(qǐng)求資源的相應(yīng)校驗(yàn)串進(jìn)行比對(duì)，決定返回200或304。

為什么有了Last-Modified還要Etag?

Etag的出現(xiàn)主要是為了解決幾個(gè)Last-Modified比較難解決的問(wèn)題：

• Last-Modified標(biāo)注的最后修改只能精確到秒級(jí)，如果某些文件在1秒鐘以內(nèi)，被修改多次的話，它將不能準(zhǔn)確標(biāo)注文件的修改時(shí)間。
• 如果某些文件會(huì)被定期生成，當(dāng)有時(shí)內(nèi)容并沒(méi)有任何變化，但Last-Modified卻改變了，導(dǎo)致文件沒(méi)法使用緩存。
• 有可能存在服務(wù)器沒(méi)有準(zhǔn)確獲取文件修改時(shí)間，或者與代理服務(wù)器時(shí)間不一致等情形。

200 OK（from cache）與304 Not Modified的區(qū)別

200 OK( from cache )不向服務(wù)器發(fā)送請(qǐng)求，直接使用本地緩存文件。304 Not Modified則向服務(wù)器詢問(wèn)，若服務(wù)器認(rèn)為瀏覽器的緩存版本還可用，那么便會(huì)返回304。

200 OK( from cache ) 出現(xiàn)操作：

1.地址欄回車

2.頁(yè)面鏈接跳轉(zhuǎn)

3.前進(jìn)、后退

304 Not Modified 出現(xiàn)操作：

1.F5刷新

2.新開窗口

緩存的不同來(lái)源

from disk cache：從磁盤中獲取緩存資源，等待下次訪問(wèn)時(shí)不需要重新下載資源，而直接從磁盤中獲取。它的直接操作對(duì)象為CurlCacheManager。

from memory cache：從內(nèi)存中獲取資源，等待下次訪問(wèn)時(shí)不需要重新下載資源，而直接從內(nèi)存中獲取。

兩者區(qū)別：當(dāng)退出進(jìn)程時(shí)，內(nèi)存中的數(shù)據(jù)會(huì)被清空，而磁盤的數(shù)據(jù)不會(huì)，所以，當(dāng)下次再進(jìn)入該進(jìn)程時(shí)，該進(jìn)程仍可以從diskCache中獲得數(shù)據(jù)，而memoryCache則不行。

不能被緩存的請(qǐng)求

當(dāng)然并不是所有請(qǐng)求都能被緩存。

無(wú)法被瀏覽器緩存的請(qǐng)求：

• HTTP信息頭中包含Cache-Control:no-cache，pragma:no-cache（HTTP1.0），或Cache-Control:max-age=0等告訴瀏覽器不用緩存的請(qǐng)求
• 需要根據(jù)Cookie，認(rèn)證信息等決定輸入內(nèi)容的動(dòng)態(tài)請(qǐng)求是不能被緩存的
• 經(jīng)過(guò)HTTPS安全加密的請(qǐng)求
• POST請(qǐng)求無(wú)法被緩存
• HTTP響應(yīng)頭中不包含Last-Modified/Etag，也不包含Cache-Control/Expires的請(qǐng)求無(wú)法被緩存

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

最新評(píng)論