瀏覽器快取

2021-10-10 01:42:04 字數 3139 閱讀 4714

瀏覽器快取就是把已經請求過的web資源拷貝乙份放在瀏覽器中。當下乙個請求到來的時候,如果是相同的url,瀏覽器會根據快取機制決定是直接使用副本響應訪問請求還是向源伺服器再次發起請求。

使用快取可以極大地提高使用者體驗,縮短網頁請求資源的距離,減少延遲,並且由於快取檔案可以重複利用,還可以減少頻寬,降低網路負荷。

從輸入url到頁面呈現出來都發生了什麼

1.在瀏覽器位址列中輸入url瀏覽器先檢視瀏覽器快取-系統快取-路由器快取,如果快取中有,會直接在螢幕中顯示頁面內容。若沒有,則需要網域名稱解析(dns解析),解析獲取相應的ip位址。

3.瀏覽器訪問伺服器:

伺服器接收到瀏覽器端的請求後,會根據請求的位址,找對應的檔案,如果是動態的資源(如:php,jsp,py等等),則伺服器端會執行該檔案的**,把執行的結果,發給瀏覽器端,如果是靜態資源(html,css,js,,聲音等等),則直接發給瀏覽器端

5. 瀏覽器接收伺服器端的響應:

瀏覽器端接收到伺服器響應的結果,開始進行解析渲染頁面

6.瀏覽器最終顯示出了頁面

http報文http報文就是瀏覽器和伺服器間通訊時傳送及響應的資料塊。當客戶端請求乙個網頁時,會先通過http協議將請求的內容封裝在http請求報文(request)之中,伺服器收到該請求報文後根據協議規範進行報文解析,然後向客戶端返回響應報文(response)。

報文資訊主要分為兩部分

1.包含屬性的首部(header)--------------------------附加資訊(cookie,快取資訊等),與快取相關的規則資訊,均包含在header中

2.包含資料的主體部分(body)-----------------------http請求真正想要傳輸的部分

瀏覽器第一次向伺服器發起該請求,此時瀏覽器是沒有對於快取的,在拿到請求結果後,將請求結果和快取標識存入瀏覽器快取,瀏覽器對於快取的處理是根據第一次請求資源時返回的響應頭來確定的。具體過程如下圖:

我們可以看到,瀏覽器每次發起請求時,都會先在瀏覽器快取中查詢該請求的結果以及快取標識,而瀏覽器每次拿到返回的請求結果也都會將該結果和快取標識存入瀏覽器快取中。這就是瀏覽器快取機制的關鍵,根據是否需要向伺服器重新發起http請求將快取過程分為強快取和協商快取。

使用者傳送的請求,直接從客戶端快取中獲取,不傳送請求到伺服器,不與伺服器發生互動行為。該請求返回200的狀態碼,可以通過設定兩種 http header 實現:expires 和 cache-control。

expires

expires 字段規定了快取的資源的過期時間,該字段時間格式使用gmt時間標準時間格式, js通過 new date().toutcstring() 得到,由於時間期限是由伺服器生成,存在著服務端和客戶端的時間誤差,相比cache-control優先順序較低,所以http 1.1 的版本,使用cache-control替代。

cache-control

cache-control 常見的取值有private、public、no-cache、max-age,no-store,預設為private。

private:

表示快取只能被單個使用者快取,不能作為共享快取(即**伺服器不可快取它)

public:

表示響應可以被任何物件快取,即使是通常不可快取的內容

max-age=***:

快取的內容將在 ***秒後失效,設定快取儲存的最大週期,超過這個時間快取將會被認為過期,與expires相反,時間是相對於請求的時間

no-cache:

告訴瀏覽器、快取伺服器,不管本地副本是否過期,使用副本前一定要到源伺服器進行副本有效校驗

no-store:

所有內容都不會快取,強制快取,對比快取都不會觸發

使用者傳送請求,傳送到伺服器之後,由伺服器判定是否從快取中獲取資源。協商快取可以通過設定兩種 http header 實現:last-modified 和 etag

last-modified:

表示資源最後的修改時間,在瀏覽器第一次傳送http請求時,伺服器會返回該響應頭,那麼瀏覽器在下次發起http請求時,會帶上if-modified-since請求頭,其值就是第一次傳送http請求時,伺服器設定在last-modified響應頭中的值。

兩種情況:如果資源最後修改時間大於if-modified-since,說明資源有被改動過,則響應完整的資源內容,返回狀態碼200;如果小於或者等於,說明資源未被修改,則響應狀態碼304,告知瀏覽器可以繼續使用所儲存的快取

etag:

伺服器響應請求時,返回當前資源檔案的乙個唯一標識(由伺服器生成),只要資源有變化,etag就會重新生成。瀏覽器在下一次載入資源向伺服器傳送請求時,會將上一次返回的etag值放到request header裡的if-none-match裡,伺服器只需要比較客戶端傳來的if-none-match跟自己伺服器上該資源的etag是否一致,就能很好地判斷資源相對客戶端而言是否被修改過了。如果伺服器發現etag匹配不上,那麼直接以常規get 200回包形式將新的資源(當然也包括了新的etag)發給客戶端;如果etag是一致的,則直接返回304知會客戶端直接使用本地快取即可。

etag (唯一標識)優先順序更高,last-modified/if-modified-since 返回給客戶端最後這個資源的修改時間,優先順序沒有etag高

強制快取優先於協商快取進行,若強制快取(expires和cache-control)生效則直接使用快取,若不生效則進行協商快取(last-modified / if-modified-since和etag / if-none-match),協商快取由伺服器決定是否使用快取,若協商快取失效,那麼代表該請求的快取失效,返回200,重新返回資源和快取標識,再存入瀏覽器快取中;生效則返回304,繼續使用快取。

快取 瀏覽器快取

瀏覽器快取 brower caching 是瀏覽器在本地磁碟對使用者最近請求過的文件進行儲存,當訪問者再次訪問同一頁面時,瀏覽器就可以直接從本地磁碟載入文件 1 瀏覽器第一次請求時,會發出一組 http 頭,用來指導瀏覽器如何進行快取。伺服器規定乙個資源是否要進行快取,主要由響應頭中的expires...

瀏覽器快取

1.為什麼使用瀏覽器快取 以前了解的動態指令碼加速,或者動態內容快取之類,他們的原理都是避免伺服器重複計算,結果仍保留在伺服器端,這樣獲取資料還得從伺服器檢索然後傳送到使用者瀏覽器,如果我們把這些結果放在瀏覽器中,就省去了伺服器的查詢和網路傳輸,瀏覽器快取很好的實現了這個功能 2.瀏覽器快取存放在哪...

瀏覽器快取

瀏覽器快取知識歸納 瀏覽器快取是提公升網頁效能的一大利器,但是,也是一把雙刃劍。利用的好網頁的效能會有大幅度提公升,伺服器的壓力也會減小。利用的不好,也會遇到很多的問題。本文結合瀏覽器快取的知識,結合真實案例進行分析,希望對讀者有所幫助。瀏覽器快取分類 瀏覽器快取分為強快取和協商快取,瀏覽器載入乙個...