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