10分鐘徹底搞懂Http的強(qiáng)制緩存和協(xié)商緩存(小結(jié))

瀏覽器緩存

瀏覽器緩存是瀏覽器在本地磁盤對(duì)用戶最近請(qǐng)求過(guò)的文檔進(jìn)行存儲(chǔ)，當(dāng)訪問(wèn)者再次訪問(wèn)同一頁(yè)面時(shí)，瀏覽器就可以直接從本地磁盤加載文檔。

所以根據(jù)上面的特點(diǎn)，瀏覽器緩存有下面的優(yōu)點(diǎn)：

• 減少冗余的數(shù)據(jù)傳輸
• 減少服務(wù)器負(fù)擔(dān)
• 加快客戶端加載網(wǎng)頁(yè)的速度

瀏覽器緩存是Web性能優(yōu)化的重要方式。那么瀏覽器緩存的過(guò)程究竟是怎么樣的呢？

在瀏覽器第一次發(fā)起請(qǐng)求時(shí)，本地?zé)o緩存，向web服務(wù)器發(fā)送請(qǐng)求，服務(wù)器起端響應(yīng)請(qǐng)求，瀏覽器端緩存。過(guò)程如下：

在第一次請(qǐng)求時(shí)，服務(wù)器會(huì)將頁(yè)面最后修改時(shí)間通過(guò)Last-Modified標(biāo)識(shí)由服務(wù)器發(fā)送給客戶端，客戶端記錄修改時(shí)間；服務(wù)器還會(huì)生成一個(gè)Etag，并發(fā)送給客戶端。

瀏覽器后續(xù)再次進(jìn)行請(qǐng)求時(shí)：

瀏覽器緩存主要分為強(qiáng)強(qiáng)緩存（也稱本地緩存）和協(xié)商緩存（也稱弱緩存）。根據(jù)上圖，瀏覽器在第一次請(qǐng)求發(fā)生后，再次發(fā)送請(qǐng)求時(shí)：

• 瀏覽器請(qǐng)求某一資源時(shí)，會(huì)先獲取該資源緩存的header信息，然后根據(jù)header中的Cache-Control和Expires來(lái)判斷是否過(guò)期。若沒(méi)過(guò)期則直接從緩存中獲取資源信息，包括緩存的header的信息，所以此次請(qǐng)求不會(huì)與服務(wù)器進(jìn)行通信。這里判斷是否過(guò)期，則是強(qiáng)緩存相關(guān)。后面會(huì)講Cache-Control和Expires相關(guān)。
• 如果顯示已過(guò)期，瀏覽器會(huì)向服務(wù)器端發(fā)送請(qǐng)求，這個(gè)請(qǐng)求會(huì)攜帶第一次請(qǐng)求返回的有關(guān)緩存的header字段信息，比如客戶端會(huì)通過(guò)If-None-Match頭將先前服務(wù)器端發(fā)送過(guò)來(lái)的Etag發(fā)送給服務(wù)器，服務(wù)會(huì)對(duì)比這個(gè)客戶端發(fā)過(guò)來(lái)的Etag是否與服務(wù)器的相同，若相同，就將If-None-Match的值設(shè)為false，返回狀態(tài)304，客戶端繼續(xù)使用本地緩存，不解析服務(wù)器端發(fā)回來(lái)的數(shù)據(jù)，若不相同就將If-None-Match的值設(shè)為true，返回狀態(tài)為200，客戶端重新機(jī)械服務(wù)器端返回的數(shù)據(jù)；客戶端還會(huì)通過(guò)If-Modified-Since頭將先前服務(wù)器端發(fā)過(guò)來(lái)的最后修改時(shí)間戳發(fā)送給服務(wù)器，服務(wù)器端通過(guò)這個(gè)時(shí)間戳判斷客戶端的頁(yè)面是否是最新的，如果不是最新的，則返回最新的內(nèi)容，如果是最新的，則返回304，客戶端繼續(xù)使用本地緩存。

一 強(qiáng)制緩存

強(qiáng)制緩存整體流程比較簡(jiǎn)單，就是在第一次訪問(wèn)服務(wù)器取到數(shù)據(jù)之后，在過(guò)期時(shí)間之內(nèi)不會(huì)再去重復(fù)請(qǐng)求。實(shí)現(xiàn)這個(gè)流程的核心就是如何知道當(dāng)前時(shí)間是否超過(guò)了過(guò)期時(shí)間。

強(qiáng)制緩存的過(guò)期時(shí)間通過(guò)第一次訪問(wèn)服務(wù)器時(shí)返回的響應(yīng)頭獲取。在 http 1.0 和 http 1.1 版本中通過(guò)不同的響應(yīng)頭字段實(shí)現(xiàn)。

http 1.0

在 http 1.0 版本中，強(qiáng)制緩存通過(guò) Expires 響應(yīng)頭來(lái)實(shí)現(xiàn)。 expires 表示未來(lái)資源會(huì)過(guò)期的時(shí)間。也就是說(shuō)，當(dāng)發(fā)起請(qǐng)求的時(shí)間超過(guò)了 expires 設(shè)定的時(shí)間，即表示資源緩存時(shí)間到期，會(huì)發(fā)送請(qǐng)求到服務(wù)器重新獲取資源。而如果發(fā)起請(qǐng)求的時(shí)間在 expires 限定的時(shí)間之內(nèi)，瀏覽器會(huì)直接讀取本地緩存數(shù)據(jù)庫(kù)中的信息（from memory or from disk），兩種方式根據(jù)瀏覽器的策略隨機(jī)獲取。

http 1.1

在 http 1.1 版本中，強(qiáng)制緩存通過(guò) Cache-Control 響應(yīng)頭來(lái)實(shí)現(xiàn)。Cache-Control 擁有多個(gè)值：

• private：客戶端可以緩存
• public：客戶端和代理服務(wù)器均可緩存；
• max-age=xxx：緩存的資源將在 xxx 秒后過(guò)期；
• no-cache：需要使用協(xié)商緩存來(lái)驗(yàn)證是否過(guò)期；
• no-store：不可緩存

最常用的字段就是 max-age=xxx ，表示緩存的資源將在 xxx 秒后過(guò)期。一般來(lái)說(shuō)，為了兼容，兩個(gè)版本的強(qiáng)制緩存都會(huì)被實(shí)現(xiàn)。

總結(jié)

強(qiáng)制緩存只有首次請(qǐng)求才會(huì)跟服務(wù)器通信，讀取緩存資源時(shí)不會(huì)發(fā)出任何請(qǐng)求，資源的 Status 狀態(tài)碼為 200，資源的 Size 為 from memory 或者 from disk ，http 1.1 版本的實(shí)現(xiàn)優(yōu)先級(jí)會(huì)高于 http 1.0 版本的實(shí)現(xiàn)。

二 協(xié)商緩存

協(xié)商緩存與強(qiáng)制緩存的不同之處在于，協(xié)商緩存每次讀取數(shù)據(jù)時(shí)都需要跟服務(wù)器通信，并且會(huì)增加緩存標(biāo)識(shí)。在第一次請(qǐng)求服務(wù)器時(shí)，服務(wù)器會(huì)返回資源，并且返回一個(gè)資源的緩存標(biāo)識(shí)，一起存到瀏覽器的緩存數(shù)據(jù)庫(kù)。當(dāng)?shù)诙握?qǐng)求資源時(shí)，瀏覽器會(huì)首先將緩存標(biāo)識(shí)發(fā)送給服務(wù)器，服務(wù)器拿到標(biāo)識(shí)后判斷標(biāo)識(shí)是否匹配，如果不匹配，表示資源有更新，服務(wù)器會(huì)將新數(shù)據(jù)和新的緩存標(biāo)識(shí)一起返回到瀏覽器；如果緩存標(biāo)識(shí)匹配，表示資源沒(méi)有更新，并且返回 304 狀態(tài)碼，瀏覽器就讀取本地緩存服務(wù)器中的數(shù)據(jù)。

在 http 協(xié)議的 1.0 和 1.1 版本中也有不同的實(shí)現(xiàn)方式。

http 1.0

在 http 1.0 版本中，第一次請(qǐng)求資源時(shí)服務(wù)器通過(guò) Last-Modified 來(lái)設(shè)置響應(yīng)頭的緩存標(biāo)識(shí)，并且把資源最后修改的時(shí)間作為值填入，然后將資源返回給瀏覽器。在第二次請(qǐng)求時(shí)，瀏覽器會(huì)首先帶上 If-Modified-Since 請(qǐng)求頭去訪問(wèn)服務(wù)器，服務(wù)器會(huì)將 If-Modified-Since 中攜帶的時(shí)間與資源修改的時(shí)間匹配，如果時(shí)間不一致，服務(wù)器會(huì)返回新的資源，并且將 Last-Modified 值更新，作為響應(yīng)頭返回給瀏覽器。如果時(shí)間一致，表示資源沒(méi)有更新，服務(wù)器返回 304 狀態(tài)碼，瀏覽器拿到響應(yīng)狀態(tài)碼后從本地緩存數(shù)據(jù)庫(kù)中讀取緩存資源。

這種方式有一個(gè)弊端，就是當(dāng)服務(wù)器中的資源增加了一個(gè)字符，后來(lái)又把這個(gè)字符刪掉，本身資源文件并沒(méi)有發(fā)生變化，但修改時(shí)間發(fā)生了變化。當(dāng)下次請(qǐng)求過(guò)來(lái)時(shí)，服務(wù)器也會(huì)把這個(gè)本來(lái)沒(méi)有變化的資源重新返回給瀏覽器。

http 1.1

在 http 1.1 版本中，服務(wù)器通過(guò) Etag 來(lái)設(shè)置響應(yīng)頭緩存標(biāo)識(shí)。Etag 的值由服務(wù)端生成。在第一次請(qǐng)求時(shí)，服務(wù)器會(huì)將資源和 Etag 一并返回給瀏覽器，瀏覽器將兩者緩存到本地緩存數(shù)據(jù)庫(kù)。在第二次請(qǐng)求時(shí)，瀏覽器會(huì)將 Etag 信息放到 If-None-Match 請(qǐng)求頭去訪問(wèn)服務(wù)器，服務(wù)器收到請(qǐng)求后，會(huì)將服務(wù)器中的文件標(biāo)識(shí)與瀏覽器發(fā)來(lái)的標(biāo)識(shí)進(jìn)行對(duì)比，如果不相同，服務(wù)器返回更新的資源和新的 Etag ，如果相同，服務(wù)器返回 304 狀態(tài)碼，瀏覽器讀取緩存。

總結(jié)

協(xié)商緩存每次請(qǐng)求都會(huì)與服務(wù)器交互，第一次是拿數(shù)據(jù)和標(biāo)識(shí)的過(guò)程，第二次開(kāi)始，就是瀏覽器詢問(wèn)服務(wù)器資源是否有更新的過(guò)程。每次請(qǐng)求都會(huì)傳輸數(shù)據(jù)，如果命中緩存，則資源的 Status 狀態(tài)碼為 304 而不是 200 。同樣的，一般來(lái)講為了兼容，兩個(gè)版本的協(xié)商緩存都會(huì)被實(shí)現(xiàn)，http 1.1 版本的實(shí)現(xiàn)優(yōu)先級(jí)會(huì)高于 http 1.0 版本的實(shí)現(xiàn)。

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持億速云。