資訊專欄INFORMATION COLUMN
摘要：當值設為時，則代表在這個請求正確返回時間瀏覽器也會記錄下來的分鐘內再次加載資源，就會命中強緩存。
網絡篇—瀏覽器緩存（一） 一、緩存類型
有兩種，強緩存和協商緩存
強緩存
不會向服務器發送請求，直接從緩存中讀取資源；
協商緩存
向服務器發送請求，服務器會根據這個請求的request header的一些參數來判斷是否命中協商緩存，如果命中，則返回304狀態碼并帶上新的response header通知瀏覽器從緩存中讀取資源；
異同
共同點：都是從客戶端緩存中讀取資源；
區別：強緩存不會發請求，協商緩存會發請求；
二、和緩存有關的header強緩存
Expires：response header里的過期時間（絕對時間），瀏覽器再次加載資源時，如果在這個過期時間內，則命中強緩存。expires: Wed, 16 May 2018 13:23:04 GMT;
Cache-Control：當值設為max-age=300時，則代表在這個請求正確返回時間（瀏覽器也會記錄下來）的5分鐘內再次加載資源，就會命中強緩存。
Expires和Cache-Control的異同：
Expires 是http1.0的產物，設置的是絕對日期時間；
Cache-Control是http1.1的產物，設置max-age設置的是相對時間；
兩者同時存在的話，Cache-Control優先級高于Expires
協商緩存
ETag和If-None-Match
Etag是上一次加載資源時，服務器返回的response header，是對該資源的一種唯一標識，只要資源有變化，Etag就會重新生成；
瀏覽器在下一次加載資源向服務器發送請求時，會將上一次返回的Etag值放到request header里的If-None-Match里，服務器接受到If-None-Match的值后，會拿來跟該資源文件的Etag值做比較，如果相同，則表示資源文件沒有發生改變，命中協商緩存。
Last-Modified和If-Modified-Since
Last-Modified是該資源文件最后一次更改時間，服務器會在response header里返回，同時瀏覽器會將這個值保存起來，在下一次發送請求時，放到request header里的If-Modified-Since里，服務器在接收到后也會做比對，如果相同則命中協商緩存。
兩種協商緩存的區別：
精確度上，Etag要優于Last-Modified。Last-Modified的時間單位是秒，如果某個文件在1秒內改變了多次，那么他們的Last-Modified其實并沒有體現出來修改，但是Etag每次都會改變確保了精度；
在性能上，Etag要遜于Last-Modified，畢竟Last-Modified只需要記錄時間，而Etag需要服務器通過算法來計算出一個hash值；
在優先級上，服務器校驗優先考慮Etag。
三、瀏覽器緩存過程瀏覽器第一次加載資源，服務器返回200，瀏覽器將資源文件從服務器上請求下載下來，并把response header及該請求的返回時間一并緩存；
下一次加載資源時，先比較當前時間和上一次返回200時的時間差，如果沒有超過cache-control設置的max-age，則沒有過期，命中強緩存，不發請求直接從本地緩存讀取該文件（如果瀏覽器不支持HTTP1.1，則用expires判斷是否過期）；
如果時間過期，則向服務器發送header帶有If-None-Match和If-Modified-Since 的請求；
服務器收到請求后，優先根據Etag的值判斷被請求的文件有沒有做修改，Etag值一致則沒有修改，命中協商緩存，返回304；如果不一致則有改動，直接返回新的資源文件帶上新的Etag值并返回 200；
如果服務器收到的請求沒有Etag值，則將If-Modified-Since和被請求文件的最后修改時間做比對，一致則命中協商緩存，返回304；不一致則返回新的last-modified和文件并返回 200；
四、設置瀏覽器緩存通過HTML的META設置expires和cache-control
此方法僅對該網頁有效，對網頁中的圖片或其他請求無效。
圖片，css，js，flash的緩存
這些主要通過服務器的配置來實現這個技術；
五、用戶行為對瀏覽器緩存的控制地址欄訪問，鏈接跳轉是正常用戶行為，將會觸發瀏覽器緩存機制；
F5刷新，瀏覽器會設置max-age=0，跳過強緩存判斷，會進行協商緩存判斷；
ctrl+F5刷新，跳過強緩存和協商緩存，直接從服務器拉取資源
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/113301.html
摘要：當值設為時，則代表在這個請求正確返回時間瀏覽器也會記錄下來的分鐘內再次加載資源，就會命中強緩存。 網絡篇—瀏覽器緩存（一） 一、緩存類型 有兩種，強緩存和協商緩存 強緩存 不會向服務器發送請求，直接從緩存中讀取資源； 協商緩存 向服務器發送請求，服務器會根據這個請求的request header的一些參數來判斷是否命中協商緩存，如果命中，則返回304狀態碼并帶上新的respon...
摘要：當值設為時，則代表在這個請求正確返回時間瀏覽器也會記錄下來的分鐘內再次加載資源，就會命中強緩存。 網絡篇—瀏覽器緩存（一） 一、緩存類型 有兩種，強緩存和協商緩存 強緩存 不會向服務器發送請求，直接從緩存中讀取資源； 協商緩存 向服務器發送請求，服務器會根據這個請求的request header的一些參數來判斷是否命中協商緩存，如果命中，則返回304狀態碼并帶上新的respon...
摘要：當值設為時，則代表在這個請求正確返回時間瀏覽器也會記錄下來的分鐘內再次加載資源，就會命中強緩存。 網絡篇—瀏覽器緩存（一） 一、緩存類型 有兩種，強緩存和協商緩存 強緩存 不會向服務器發送請求，直接從緩存中讀取資源； 協商緩存 向服務器發送請求，服務器會根據這個請求的request header的一些參數來判斷是否命中協商緩存，如果命中，則返回304狀態碼并帶上新的respon...
摘要：在文檔中，可以指定清單文件的相對路徑和絕對。具體做法是在中嵌入一個，中的頁面的標簽包含屬性引用文件，里面定義了需要緩存的文件。這比較適合一些頁面上的應用以及靜態的不經常變更的頁面。其會緩存載體頁面也是由于其機制。 正巧看到在送書，于是乎找了找自己博客上記錄過的一些東西來及其無恥的蹭書了~~~ 小廣告：更多內容可以看我的博客 之前在segmentfault上刷問題看到一個關于mani...
閱讀 1436·2021-09-22 16:04
閱讀 2800·2019-08-30 15:44
閱讀 888·2019-08-30 15:43
閱讀 766·2019-08-29 15:24
閱讀 1845·2019-08-29 14:07
閱讀 1134·2019-08-29 12:30
閱讀 1729·2019-08-29 11:15
閱讀 2740·2019-08-28 18:08
