瀏覽器HTTP緩存

緩存的分類

緩存分為服務(wù)器端緩存和客戶端緩存瓣窄。

服務(wù)器緩存又分為代理服務(wù)器和反向代理服務(wù)器緩存溢吻，其中廣泛應(yīng)用的CDN也是一種服務(wù)器端緩存乌庶，目的都是讓用戶的請(qǐng)求走“捷徑”，并且都是緩存圖片左痢，文件等靜態(tài)資源靡羡。

客戶端緩存一般指的是瀏覽器緩存，目的就是加速各種靜態(tài)資源的訪問(wèn)抖锥，想想現(xiàn)在的大型網(wǎng)站亿眠，隨便一個(gè)頁(yè)面都是一兩百個(gè)請(qǐng)求，每天pv（page view磅废， 頁(yè)面瀏覽量）都是億級(jí)別纳像，如果沒(méi)有緩存，用戶體驗(yàn)會(huì)急劇下降拯勉，同時(shí)服務(wù)器壓力和網(wǎng)絡(luò)帶寬都面臨嚴(yán)重的考驗(yàn)竟趾。

瀏覽器緩存機(jī)制詳解

瀏覽器請(qǐng)求流程

• 瀏覽器第一次請(qǐng)求流程圖

  image

• 瀏覽器再次請(qǐng)求流程圖

  image

重要概念

• Expires策略

  • 例： Expires:Wed, 10 Aug 2016 12:07:31 GMT
  • Expires是Web服務(wù)器響應(yīng)信息頭字段，在響應(yīng)http請(qǐng)求時(shí)告訴瀏覽器在過(guò)期時(shí)間前瀏覽器可以直接從瀏覽器緩存取數(shù)據(jù)宫峦，而無(wú)需再次請(qǐng)求岔帽。不過(guò)Expires是HTTP1.0 的東西，現(xiàn)在瀏覽器均默認(rèn)使用HTTP1.1导绷， 所以它的作用基本忽略犀勒。Expires的一個(gè)缺點(diǎn)就是，翻譯的到期時(shí)間是服務(wù)器端的時(shí)間妥曲，這樣存在一個(gè)問(wèn)題贾费，如果客戶端的時(shí)間和服務(wù)器的時(shí)間相差很大，那么誤差就很大檐盟，所以在HTTP1.1版開(kāi)始褂萧，使用Cache-Control：max-age=秒 代替。

• Cache-control策略

  • 例： Cache-Control: public, max-age=676193
  • Cache-Control與Expires的作用一致葵萎，都是指明當(dāng)前資源的有效期导犹，控制瀏覽器是否直接從瀏覽器緩存取數(shù)據(jù)還是重新發(fā)送請(qǐng)求到服務(wù)器取數(shù)據(jù)。只不過(guò)Cache-Control的選擇更多羡忘，設(shè)置更細(xì)致谎痢，如果同時(shí)設(shè)置的話，其優(yōu)先級(jí)高于Expires
  • 有以下設(shè)置
    • max-age（單位s）
      • 指定設(shè)置緩存的最大有效時(shí)間卷雕。當(dāng)瀏覽器向服務(wù)器發(fā)送請(qǐng)求后节猿，在max-age這段時(shí)間里瀏覽器就不會(huì)再向服務(wù)器發(fā)送請(qǐng)求了。即使服務(wù)器上的資源發(fā)生了變化爽蝴，瀏覽器也不會(huì)得到通知沐批。
    • public

      • 指定響應(yīng)會(huì)被緩存，并且在多用戶間共享蝎亚，也就是下圖的意思九孩。如果沒(méi)有指定為public還是private，則默認(rèn)為public

        
        
        image
    • private

      • 響應(yīng)只作為私有的緩存发框，不能再用戶間共享躺彬。如果要求HTTP認(rèn)證，響應(yīng)會(huì)自動(dòng)設(shè)置為private

        
        
        image
    • no-cache
      • 指定不緩存響應(yīng)梅惯，表明資源不進(jìn)行緩存
      • 但是設(shè)置了no-cache之后并不代表瀏覽器不緩存宪拥，而是在緩存前要向服務(wù)器確認(rèn)資源是否被更改。
    • no-store
      • 絕對(duì)禁止緩存铣减，如果用了這個(gè)命令當(dāng)然就是不會(huì)進(jìn)行緩存啦~每次請(qǐng)求資源都要從服務(wù)器重新獲取她君。

• Last-Modified/If-Modified-Since策略

  • 服務(wù)器端文件的最后修改時(shí)間，需要和Cache-Control共同使用葫哗，是檢查服務(wù)器端資源是否更新的一種方式缔刹。當(dāng)瀏覽器再次進(jìn)行請(qǐng)求時(shí)，會(huì)向服務(wù)器發(fā)送If-Modified-Since報(bào)頭劣针，詢問(wèn)Last-modified時(shí)間點(diǎn)之后資源是否被修改過(guò)校镐。如果沒(méi)有修改，則返回碼為304捺典，使用緩存鸟廓；如果修改過(guò)，則再次去服務(wù)器請(qǐng)求資源襟己，返回碼和首次請(qǐng)求相同為200引谜，資源為服務(wù)器最新資源。

• Etag/If-None-Match

  • 根據(jù)實(shí)體內(nèi)容生成一段hash字符串稀蟋，標(biāo)識(shí)資源的狀態(tài)煌张，由服務(wù)端產(chǎn)生。瀏覽器會(huì)將這串字符串傳回服務(wù)器退客，驗(yàn)證資源是夠修改過(guò)骏融，如果沒(méi)有修改，則返回碼為304萌狂，使用緩存档玻；如果修改過(guò)，則再次去服務(wù)器請(qǐng)求資源茫藏，返回碼和首次請(qǐng)求時(shí)間為200误趴，資源為服務(wù)器最新資源。

• 既生Last-Modified何生Etag务傲？

  • Last-Modified標(biāo)注的最后修改只能精確到秒級(jí)凉当，如果某些文件在1秒鐘之內(nèi)被修改了很多次的話枣申，它將不能準(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í)間不一致等情形