程序員需要了解的瀏覽器緩存技術(shù)
做web開(kāi)發(fā)的同學(xué)(前端工程師和后端工程師),經(jīng)常遇到響應(yīng)304,304的意思就是瀏覽器已經(jīng)緩存,不需要走服務(wù)器,瀏覽器直接響應(yīng)數(shù)據(jù)給用戶(hù),最常用的解決瀏覽器緩存的問(wèn)題,就是在靜態(tài)文件后面添加版本號(hào),讓瀏覽器不響應(yīng)緩存。那么web瀏覽器是怎么緩存數(shù)據(jù)的:
Expires
早起的web就是通過(guò)這個(gè)字段來(lái)告訴瀏覽器該緩存多久,這種緩存的原理是根據(jù)當(dāng)前服務(wù)器的時(shí)間加上緩存有效的時(shí)間,最終生成未來(lái)某個(gè)失效時(shí)間值,返回給瀏覽器,比如失效時(shí)間點(diǎn)為2020 ,那么當(dāng)用戶(hù)刷新頁(yè)面的時(shí)候,就會(huì)先判斷當(dāng)前時(shí)間是否到2020年,如果沒(méi)到,瀏覽器把緩存的數(shù)據(jù)直接返回給用戶(hù),不走web服務(wù)器,這種緩存的一個(gè)缺點(diǎn)就是:如果用戶(hù)修改了自己的本地時(shí)間,那么緩存可能失效。

Cache-control
因?yàn)镋xpires的缺點(diǎn),后來(lái)的cache-control就做了改進(jìn),cache-control不再存絕對(duì)時(shí)間,存的是相對(duì)時(shí)間,比如緩存是60秒,需要注意的是如果你設(shè)置了max-age=60,那么在這60秒內(nèi),即使服務(wù)端修改了,你也得不到新的數(shù)據(jù),所以這個(gè)使用要慎重,對(duì)應(yīng)的另一個(gè)還有叫no-cache的,no-cahe并不是不緩存,而是每次都要和服務(wù)器做比較,如果服務(wù)器未更新那么就讀取緩存,反之讀取新的,與no-cache對(duì)應(yīng)的就是no-store。no-store才是真的告訴瀏覽器不要讀取緩存的意思。

Last-Modified和If-Modified-Since
Last-Modified是服務(wù)器返回給瀏覽器的
If-Modified-Since是瀏覽器告訴服務(wù)器的
舉個(gè)例子,如果你訪問(wèn)個(gè)url,肯定沒(méi)緩存走服務(wù)器,服務(wù)器返回個(gè)Last-Modified,即這個(gè)資源最近被修改的時(shí)間A,響應(yīng)的http狀態(tài)碼是200,同時(shí)瀏覽器把這個(gè)時(shí)間A存起來(lái),下次請(qǐng)求的時(shí)候,瀏覽器會(huì)帶著這個(gè)If-Modified-Since去和服務(wù)器做對(duì)比,如果說(shuō),兩次的時(shí)間一樣,那么就是資源沒(méi)更新,瀏覽器直接返回自己緩存的資源,響應(yīng)的http狀態(tài)碼是304,如果說(shuō)兩次時(shí)間不一樣,那么服務(wù)器再次返回Last-Modified時(shí)間和200的http狀態(tài)碼。但是這種策略也有缺點(diǎn),就是時(shí)間最小單位是1s,如果說(shuō)1秒內(nèi)發(fā)了好幾次更新,瀏覽器就不知道了。

Etag和If-no-match
由于Last-Modified不支持秒級(jí)的變化,后來(lái)出現(xiàn)了Etag,Etag是文件修改時(shí)間等hash的結(jié)果,不存具體時(shí)間值,這樣每次請(qǐng)求的時(shí)候,瀏覽器會(huì)帶上If-no-match和服務(wù)器的Etag做對(duì)比,如果一樣,走緩存,不一樣,走服務(wù)器,然后緩存起來(lái),可以精確到秒級(jí)
