作為面試題解析我們?cè)谶@里就著重點(diǎn)到 強(qiáng)制緩存 和協(xié)商緩存暖哨。
瀏覽器緩存分為強(qiáng)緩存和協(xié)商緩存
- 強(qiáng)緩存命中緩存的情況下會(huì)直接從瀏覽器里面拿數(shù)據(jù) 不經(jīng)過(guò)服務(wù)器服球。
- 協(xié)商緩存會(huì)先訪問(wèn)服務(wù)器看緩存是否過(guò)期伐庭，再?zèng)Q定是否從瀏覽器里面拿數(shù)據(jù)。
強(qiáng)制緩存
1.如果命中緩存，直接從緩存中拿數(shù)據(jù)尤溜，請(qǐng)求不會(huì)經(jīng)過(guò)服務(wù)器授霸，返回的http狀態(tài)碼為200(from disk cache)
2.下面給一張流程圖來(lái)說(shuō)明強(qiáng)緩存的請(qǐng)求過(guò)程
由此我們可以看出，強(qiáng)制緩存的最大特點(diǎn)就是在緩存命中的時(shí)候不會(huì)經(jīng)過(guò)服務(wù)器碘耳。而是直接返回藏畅。
3.設(shè)置強(qiáng)緩存
控制強(qiáng)緩存的字段有：Http頭Expires/Cache-Control設(shè)置強(qiáng)緩存
-
Cache-Control里面存在多個(gè)屬性來(lái)控制緩存愉阎，設(shè)置強(qiáng)緩存即設(shè)置資源的有效期溅呢，屬性為max-age.
image.png - Expires和max-age都是用于控制緩存的生命周期。不同的是Expires指定的是過(guò)期的具體時(shí)間伊约，例如Sun, 21 Mar 2027 08:52:14 GMT姚淆，而max-age指定的是生命時(shí)長(zhǎng)秒數(shù)315360000。
區(qū)別在于Expires是 HTTP/1.0 的中的標(biāo)準(zhǔn)超埋，而max-age是屬于Cache-Control的內(nèi)容搏讶，是 HTTP/1.1 中的定義的。但為了想向前兼容霍殴，這兩個(gè)屬性仍然要同時(shí)存在窍蓝。max-age是要優(yōu)先于Expires的。
協(xié)商/對(duì)比緩存
1.定義
協(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ù)胳施。
協(xié)商緩存的最大特點(diǎn)是要經(jīng)過(guò)服務(wù)器驗(yàn)證的溯祸，下面我們來(lái)講解協(xié)商緩存的驗(yàn)證流程。
2.流程圖
3.如何驗(yàn)證
第一次請(qǐng)求將response header的Last-Modified和Etag存起來(lái)舞肆，在第二次請(qǐng)求通過(guò)request header的If-Modified-Since和If-None-Match傳到服務(wù)端進(jìn)行驗(yàn)證焦辅，如果命中緩存，返回304椿胯，不帶返回的數(shù)據(jù)筷登，瀏覽器自動(dòng)從緩存中獲取數(shù)據(jù)資源，若未命中緩存返回200哩盲，帶上數(shù)據(jù)資源前方。
Last-Modified:
服務(wù)器在響應(yīng)請(qǐng)求時(shí)，告訴瀏覽器資源的最后修改時(shí)間种冬。
Etag：
服務(wù)器響應(yīng)請(qǐng)求時(shí)镣丑，告訴瀏覽器當(dāng)前資源在服務(wù)器的唯一標(biāo)識(shí)（生成規(guī)則由服務(wù)器決定）舔糖。
If-Modified-Since：
- 再次請(qǐng)求服務(wù)器時(shí)娱两，通過(guò)此字段通知服務(wù)器上次請(qǐng)求時(shí)，服務(wù)器返回的資源最后修改時(shí)間金吗。
- 服務(wù)器收到請(qǐng)求后發(fā)現(xiàn)有頭If-Modified-Since 則與被請(qǐng)求資源的最后修改時(shí)間進(jìn)行比對(duì)十兢。
- 若資源的最后修改時(shí)間大于If-Modified-Since，說(shuō)明資源又被改動(dòng)過(guò)摇庙，則響應(yīng)整片資源內(nèi)容旱物，返回狀態(tài)碼200；
- 若資源的最后修改時(shí)間小于或等于If-Modified-Since卫袒，說(shuō)明資源無(wú)新修改宵呛，則響應(yīng)HTTP 304，告知瀏覽器繼續(xù)使用所保存的cache夕凝。
image.png
If-None-Match： - 再次請(qǐng)求服務(wù)器時(shí)宝穗，通過(guò)此字段通知服務(wù)器客戶段緩存數(shù)據(jù)的唯一標(biāo)識(shí)户秤。
- 服務(wù)器收到請(qǐng)求后發(fā)現(xiàn)有頭If-None-Match 則與被請(qǐng)求資源的唯一標(biāo)識(shí)進(jìn)行比對(duì)，
- 不同逮矛，說(shuō)明資源又被改動(dòng)過(guò)鸡号，則響應(yīng)整片資源內(nèi)容，返回狀態(tài)碼200须鼎；
- 相同鲸伴，說(shuō)明資源無(wú)新修改，則響應(yīng)HTTP 304晋控，告知瀏覽器繼續(xù)使用所保存的cache汞窗。
再次請(qǐng)求服務(wù)器時(shí)，通過(guò)此字段通知服務(wù)器客戶段緩存數(shù)據(jù)的唯一標(biāo)識(shí)糖荒。
服務(wù)器收到請(qǐng)求后發(fā)現(xiàn)有頭If-None-Match 則與被請(qǐng)求資源的唯一標(biāo)識(shí)進(jìn)行比對(duì)杉辙，
不同，說(shuō)明資源又被改動(dòng)過(guò)捶朵，則響應(yīng)整片資源內(nèi)容蜘矢，返回狀態(tài)碼200；
相同综看，說(shuō)明資源無(wú)新修改品腹，則響應(yīng)HTTP 304，告知瀏覽器繼續(xù)使用所保存的cache红碑。
4.設(shè)置協(xié)商緩存
在強(qiáng)緩存那一節(jié)說(shuō)到使用Cache-Control的max-age來(lái)設(shè)置資源過(guò)期時(shí)間舞吭，那么當(dāng)max-age=0的時(shí)候呢，自然瀏覽器第一時(shí)間發(fā)現(xiàn)資源過(guò)期析珊，request header就會(huì)帶著If-Modified-Since和If-None-Match去服務(wù)端驗(yàn)證羡鸥。
所以設(shè)置response header為：
Cache-Control: max-age=0 就可以觸發(fā)協(xié)商緩存了must-revalidate的意義為必須進(jìn)行驗(yàn)證，但是它一般是和max-age一起使用的忠寻，不會(huì)單獨(dú)使用惧浴，
Cache-Control: must-revalidate, max-age=600如果要不緩存，每次都請(qǐng)求新的資源應(yīng)該使用
Cache-Control: no-store
更多緩存知識(shí)就不多說(shuō)了（作者我也是現(xiàn)學(xué)現(xiàn)賣(mài)哈哈哈）
加油奧里給???♀?
原文詳見(jiàn)：
https://www.linuxidc.com/linux/2019-08/160265.htm
