摘要:緩存類型強緩存協商緩存強緩存不會向服務器發請求,直接從瀏覽器的緩存里面讀取。協商緩存會向服務器發送請求,服務器會根據里面的參數判斷是否命中緩存,如果命中就會返回,并且帶上新的返回通知瀏覽器從緩存文件里面讀取數據。
1:緩存類型
1:強緩存 2:協商緩存
1: 強緩存:不會向服務器發請求,直接從瀏覽器的緩存里面讀取。狀態碼為200,size為from disk cache 或者 from memory cache。
2: 協商緩存:會向服務器發送請求,服務器會根據request header里面的參數判斷是否命中緩存,如果命中就會返回304,并且帶上新的response header返回通知瀏覽器從緩存文件里面讀取數據。
2: 與強緩存相關的request header
1: Expires 2: Cache-Control
先來看一下各自的用法:
1: Expires: Wed, 21 Oct 2015 07:28:00 GMT 2: Cache-Control: "max-age=60"
Expires設置的是一個在服務器端的絕對時間,意思是在這個絕對之間之前的請求,瀏覽器都直接從瀏覽器本地的緩存里面讀取資源,不發請求。
Cache-Control: "max-age=60" 里面的60,單位是秒,以上設置的意思是指之后的60秒以內的請求都從瀏覽器本地緩存里面讀取,不發請求。
Expires是http1.0的,而Cache-Control是http1.1的,當兩者都有的時候,是Cache-Control生效。只有在不支持http1.1的情況下,Expires才生效。
Expires屬于response header, 但是,Cache-Control即可以出現在request header里面,也可以出現在response header里面,它的值也還有很多,下一篇再細講。
3: 協商緩存
跟協商緩存相關的header主要有四個,其中request header 2個,response header 2個。
1: request header
1: If-None-Match 2: If-Modified-Since
2: response header
1: Etag 2: Last-Modified
1: 先解釋一下2個response header是什么:
Etag
Etag是資源的唯一標識,只要資源發生變化,Etag就是重新生成。Etag會在上一次資源加載時,通過reponse header返回,瀏覽器會把這個Etag保存起來。
Last-Modified
Last-Modified是資源最后一次被修改的時間,也是通過response header返回,瀏覽器也會把這個時間保存起來。
2: 再來看看這2個response header怎么用
瀏覽器在請求的時候,會把Etag的值賦給If-None-Match;把Last-Modified的值給If-Modified-Since,也就是:
If-None-Match: ${Etag} If-Modified-Since: ${Last-Modified}
服務器處理這條請求,拿到這次的Etag和Last-Modified的值與服務器上的資源的Etag和Last-Modified比較,如果相同,那就命中協商緩存。
這兩隊的作用是一樣的,但是都有各自的優缺點:
1: 精確度
Etag > Last-Modified
因為Last-Modified的精讀是秒,如果一個文件在一秒之內改變了很多次,那Last-Modified不會變。但是Etag是只要資源發生變化,Etag就會更新,那緩存的命中率就會高一些,也可以說是更精確。
2: 性能
Last-Modified > Etag
因為Last-Modified只需要保存一個時間值就好,而Etag需要服務器用算法算一個hash值。
3: 優先級
Etag> Last-Modified
PS: 雖然在上面的內容里面,在cache-control出現在強緩存那節,協商緩存也沒有提到cache-control,但是cache-control的某些情況下也會觸發協商緩存,這個內容在下一篇文章再講。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/92605.html
摘要:緩存緩存,也叫網關緩存反向代理緩存。瀏覽器先向網關發起請求,網關服務器后面對應著一臺或多臺負載均衡源服務器,會根據它們的負載請求,動態將請求轉發到合適的源服務器上。雖然這種架構負載均衡源服務器之間的緩存沒法共享,但卻擁有更好的處擴展性。 一、前言? 工作上遇到一個這樣的需求,一個H5頁面在APP端,如果勾選已讀狀態,則下次打開該鏈接,會跳過此頁面。用到了HTML5 的本地存儲 API ...
摘要:根據標準,到目前為止,一共有種緩存機制,有些是之前已有,有些是才新加入的。首次請求緩存有效期內請求緩存過期后請求一般瀏覽器會將緩存記錄及緩存文件存在本地文件夾中。 騰訊 Bugly 特約作者:賀輝超 1. H5 緩存機制介紹 H5,即 HTML5,是新一代的 HTML 標準,加入很多新的特性。離線存儲(也可稱為緩存機制)是其中一個非常重要的特性。H5 引入的離線存儲,這意味著 web ...
摘要:對于瀏覽器緩存,相信很多開發者對它真的是又愛又恨。那么瀏覽器緩存究竟是個什么樣的神奇玩意呢什么是瀏覽器緩存簡單來說,瀏覽器緩存就是把一個已經請求過的資源如頁面,圖片,,數據等拷貝一份副本儲存在瀏覽器中。 對于瀏覽器緩存,相信很多開發者對它真的是又愛又恨。一方面極大地提升了用戶體驗,而另一方面有時會因為讀取了緩存而展示了錯誤的東西,而在開發過程中千方百計地想把緩存禁掉。那么瀏覽器緩存究竟...
摘要:對于瀏覽器緩存,相信很多開發者對它真的是又愛又恨。那么瀏覽器緩存究竟是個什么樣的神奇玩意呢什么是瀏覽器緩存簡單來說,瀏覽器緩存就是把一個已經請求過的資源如頁面,圖片,,數據等拷貝一份副本儲存在瀏覽器中。 對于瀏覽器緩存,相信很多開發者對它真的是又愛又恨。一方面極大地提升了用戶體驗,而另一方面有時會因為讀取了緩存而展示了錯誤的東西,而在開發過程中千方百計地想把緩存禁掉。那么瀏覽器緩存究竟...
閱讀 2203·2021-10-18 13:28
閱讀 2512·2021-10-11 10:59
閱讀 2340·2019-08-29 15:06
閱讀 1132·2019-08-26 13:54
閱讀 808·2019-08-26 13:52
閱讀 3149·2019-08-26 12:02
閱讀 2999·2019-08-26 11:44
閱讀 2512·2019-08-26 10:56