瀏覽器緩存辨图，可以使得頁(yè)面加載速度提高膘婶，也減輕服務(wù)端壓力。瀏覽器緩存的過(guò)程（圖示）：
有幾個(gè)比較重要點(diǎn)如下：
1. 瀏覽器是如何判斷緩存是否過(guò)期会放？
應(yīng)該是根據(jù)Response Header(響應(yīng)頭)里面的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è)用戶(hù)的整個(gè)或部分響應(yīng)消息挤渔，不能被共享緩存處理肮街。這允許服務(wù)器僅僅描述當(dāng)用戶(hù)的部分響應(yīng)消息，此響應(yīng)消息對(duì)于其他用戶(hù)的請(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)消息。
PS：其實(shí)主要關(guān)注max-age這個(gè)值就行了昵骤。
Expires
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蹦玫，所以它的作用基本忽略（暫不明了）赎婚。
2. 服務(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)容（寫(xiě)在響應(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）长搀，大小（Size）和最后修改時(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。
3. 為什么有了Last-Modified還要Etag纽甘？
Etag的出現(xiàn)主要是為了解決幾個(gè)Last-Modified比較難解決的問(wèn)題：
- Last-Modified標(biāo)注的最后修改只能精確到秒級(jí)良蛮，如果某些文件在1秒鐘以?xún)?nèi)，被修改多次的話(huà)悍赢，它將不能準(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í)間不一致等情形胸囱。
4. 200 OK( from cache )和 304 Not Modified的區(qū)別？
200 OK( from cache )不向服務(wù)器發(fā)送請(qǐng)求瀑梗，直接使用本地緩存文件烹笔。304 Not Modified則向服務(wù)器詢(xún)問(wèn)，若服務(wù)器認(rèn)為瀏覽器的緩存版本還可用抛丽，那么便會(huì)返回304谤职。
200 OK( from cache ) 出現(xiàn)操作：
1.地址欄回車(chē)
2.頁(yè)面鏈接跳轉(zhuǎn)
3.前進(jìn)、后退
304 Not Modified 出現(xiàn)操作：
1.F5刷新
2.新開(kāi)窗口
PS：但是這樣不是絕對(duì)亿鲜，還是會(huì)有奇怪的情況允蜈，例如百度首頁(yè)無(wú)論是怎么刷冤吨，都是200 from cache。
