建站
咨詢
售后
建站咨詢
新聞中心
分類
前端緩存分為強(qiáng)緩存和協(xié)商緩存兩種。
創(chuàng)新互聯(lián)建站是一家朝氣蓬勃的網(wǎng)站建設(shè)公司。公司專注于為企業(yè)提供信息化建設(shè)解決方案。從事網(wǎng)站開(kāi)發(fā)，網(wǎng)站制作，網(wǎng)站設(shè)計(jì)，網(wǎng)站模板，微信公眾號(hào)開(kāi)發(fā)，軟件開(kāi)發(fā)，小程序開(kāi)發(fā)，10多年建站對(duì)水處理設(shè)備等多個(gè)行業(yè)，擁有豐富的網(wǎng)站維護(hù)經(jīng)驗(yàn)。
強(qiáng)緩存
強(qiáng)緩存主要使用Expires、Cache-Control 兩個(gè)頭字段，兩者同時(shí)存在Cache-Control 優(yōu)先級(jí)更高。當(dāng)命中強(qiáng)緩存的時(shí)候，客戶端不會(huì)再求，直接從緩存中讀取內(nèi)容，并返回HTTP狀態(tài)碼200。
- Expires
響應(yīng)頭，代表該資源的過(guò)期時(shí)間。是一個(gè)GMT 格式的標(biāo)準(zhǔn)時(shí)間。
當(dāng)客戶端請(qǐng)求服務(wù)器的時(shí)候，服務(wù)器會(huì)返回資源的同時(shí)還會(huì)帶上響應(yīng)頭Expires，表示資源的過(guò)期具體時(shí)間，如果客戶端在過(guò)期時(shí)間之前再次獲取該資源，就不需要再請(qǐng)求我服務(wù)器了，可以直接在緩存里面拿。
使用Expires強(qiáng)緩存優(yōu)點(diǎn)：
- 在過(guò)期時(shí)間以內(nèi)，為用戶省了很多流量。
- 減少了服務(wù)器重復(fù)讀取磁盤(pán)文件的壓力。
使用Expires強(qiáng)緩存缺點(diǎn)
- 緩存過(guò)期以后，服務(wù)器不管文件有沒(méi)有變化會(huì)再次請(qǐng)求服務(wù)器。
- 緩存過(guò)期時(shí)間是一個(gè)具體的時(shí)間，這個(gè)時(shí)間依賴于客戶端的時(shí)間，如果時(shí)間不準(zhǔn)確或者被改動(dòng)緩存也會(huì)隨之受到影響。
- Cache-Control
請(qǐng)求/響應(yīng)頭，緩存控制字段，精確控制緩存策略。
為了讓強(qiáng)緩存更精確，HTTP1.1增加了Cache-Control字段。Cache-Control既能出現(xiàn)在請(qǐng)求頭又能出現(xiàn)在響應(yīng)頭，其不同的值代表不同的意思，下面我們具體分析一下。
Cache-Control 服務(wù)端參數(shù)：
- max-age: 在多少秒內(nèi)有效，是一個(gè)相對(duì)時(shí)間，這樣比Expires具體的時(shí)間就更精確了。
- s-maxage: 就是用于表示 cache 服務(wù)器上（比如 cache CDN，緩存代理服務(wù)器）的緩存的有效時(shí)間的，并只對(duì) public 緩存有效。
- no-cache：不使用本地強(qiáng)緩存。需要使用緩存協(xié)商。
- no-store：直接禁止瀏覽器緩存數(shù)據(jù)，每次用戶請(qǐng)求該資源，都會(huì)向服務(wù)器發(fā)送一個(gè)請(qǐng)求，每次都會(huì)下載完整的資源。
- public：可以被所有的用戶緩存，包括終端用戶和中間代理服務(wù)器。
- private：只能被終端用戶的瀏覽器緩存，不允許中間緩存代理進(jìn)行緩存，默認(rèn)的。
Cache-Control 客戶端參數(shù)：
- max-stale: 5 表示客戶端到代理服務(wù)器上拿緩存的時(shí)候，即使代理緩存過(guò)期了也不要緊，只要過(guò)期時(shí)間在 5 秒之內(nèi)，還是可以從代理中獲取的。
- min-fresh: 5 表示代理緩存需要一定的新鮮度，不要等到緩存剛好到期再拿，一定要在到期前 5 秒之前的時(shí)間拿，否則拿不到。
- only-if-cached 這個(gè)字段加上后表示客戶端只會(huì)接受代理緩存，而不會(huì)接受源服務(wù)器的響應(yīng)。如果代理緩存無(wú)效，則直接返回 504（Gateway Timeout）。
協(xié)商緩存
協(xié)商緩存主要有四個(gè)頭字段，它們兩兩組合配合使用，If-Modified-Since 和 Last-Modified一組，Etag 和 If-None-Match一組，當(dāng)同時(shí)存在的時(shí)候會(huì)以Etag 和 If-None-Match為主。當(dāng)命中協(xié)商緩存的時(shí)候，服務(wù)器會(huì)返回HTTP狀態(tài)碼304，讓客戶端直接從本地緩存里面讀取文件。
- If-Modified-Since
請(qǐng)求頭，資源最近修改時(shí)間，由瀏覽器告訴服務(wù)器。其實(shí)就是第一次訪問(wèn)服務(wù)端返回的Last-Modified的值。
- Last-Modified
響應(yīng)頭，資源最近修改時(shí)間，由服務(wù)器告訴瀏覽器。
- Etag
響應(yīng)頭，資源標(biāo)識(shí)，由服務(wù)器告訴瀏覽器。
- If-None-Match
請(qǐng)求頭，緩存資源標(biāo)識(shí)，由瀏覽器告訴服務(wù)器。其實(shí)就是第一次訪問(wèn)服務(wù)端返回的Etag的值。
If-Modified-Since 和 Last-Modified
當(dāng)客戶端第一次請(qǐng)求服務(wù)器的時(shí)候，服務(wù)端會(huì)返回一個(gè)Last-Modified響應(yīng)頭，該字段是一個(gè)標(biāo)準(zhǔn)時(shí)間。客戶端請(qǐng)求服務(wù)器的時(shí)候會(huì)帶上If-Modified-Since請(qǐng)求頭字段，該字段的值就是服務(wù)器返回的Last-Modified的值。服務(wù)器接收到請(qǐng)求后會(huì)比較這兩個(gè)值是否一樣，一樣就返回304，讓客戶端從緩存中讀取，不一樣就會(huì)返回新文件給客戶端并更新Last-Modified響應(yīng)頭字段的值。
使用If-Modified-Since 和 Last-Modified的優(yōu)點(diǎn)：
- 當(dāng)緩存有效時(shí)服務(wù)器不會(huì)返回文件給客戶端，而是直接返回304狀態(tài)碼，讓客戶端從緩存中獲取文件。大大節(jié)省了流量和帶寬以及服務(wù)器的壓力。
使用If-Modified-Since 和 Last-Modified的缺點(diǎn)：
- Last-Modified 過(guò)期時(shí)間只能精確到秒。如果在同一秒既修改了文件又獲取文件，客戶端是獲取不到最新文件的。
Etag 和 If-None-Match
為了解決文件修改時(shí)間只能精確到秒帶來(lái)的問(wèn)題，我們引入 Etag 響應(yīng)頭。Etag 是由文件修改時(shí)間與文件大小計(jì)算而成，只有當(dāng)文件文件內(nèi)容或修改時(shí)間變了Etag的值才會(huì)發(fā)生變化。
當(dāng)客戶端第一次請(qǐng)求服務(wù)器的時(shí)候，服務(wù)端會(huì)返回一個(gè)Etag響應(yīng)頭?？蛻舳苏?qǐng)求服務(wù)器的時(shí)候會(huì)帶上If-None-Match請(qǐng)求頭字段，該字段的值就是服務(wù)器返回的Etag的值。服務(wù)器接收到請(qǐng)求后會(huì)比較這兩個(gè)值是否一樣，一樣就返回304，讓客戶端從緩存中讀取，不一樣就會(huì)返回新文件給客戶端并更新Etag響應(yīng)頭字段的值。
使用Etag 和 If-None-Match的優(yōu)點(diǎn)：
- 當(dāng)緩存有效時(shí)服務(wù)器不會(huì)返回文件給客戶端，而是直接返回304狀態(tài)碼，讓客戶端從緩存中獲取文件。大大節(jié)省了流量和帶寬以及服務(wù)器的壓力。
- 并且解決了一秒內(nèi)修改并讀取的問(wèn)題。
擴(kuò)展
緩存失效問(wèn)題
引入了緩存固然是好事，能大大提升響應(yīng)速度以及減輕服務(wù)端的壓力，但是也會(huì)出現(xiàn)一些問(wèn)題，比如我們明明更新了系統(tǒng)版本，為什么客戶端看到的還是老文件。在不同的時(shí)代有不同的解決方案。
老方案
老方案通過(guò)人工自己修改文件名或者在文件名后帶上版本號(hào)、時(shí)間戳，這樣客戶端就會(huì)當(dāng)新文件請(qǐng)求并使用，之前的強(qiáng)緩存就算在有效期內(nèi)也會(huì)失效。