前端http協議快取初解

2021-09-11 09:54:19 字數 2501 閱讀 7419

[toc]

使用者獲取網路資源,需要通過非常長的網路去伺服器上請求資源,另外服務端為了應對大量的使用者請求而不斷的提公升硬體效能與頻寬。這對使用者與服務端都非常的不友好。而快取就是為了解決使用者請求速度與釋放伺服器壓力而生的。

為什麼我會寫http快取,因為下面介紹的快取都是通過http定義的。瀏覽器快取則是另外的如:sessionstorage,localstorage(個人見解)。

過期機制就是瀏覽器根據快取的有效期進行判斷,如果在有效期內就使用快取,否則就拋棄這個快取。

乙個快取副本必須滿足以下條件,瀏覽器會認為它是有效的,足夠新的:

1. 含有完整的過期時間控制頭資訊(http協議報頭),並且仍在有效期內;

2. 瀏覽器已經使用過這個快取副本,並且在乙個會話中已經檢查過新鮮度;

瀏覽器帶上本地快取副本的驗證資訊提交給伺服器(last-modified,etag),由伺服器決定是否採用這個快取。

客戶端請求的時候帶上last-modified,伺服器進行驗證返回if-modified-since來確定資源是否是有效快取。 另外在控制頭資訊帶上這個資源的實體標籤etag(entity tag),它可以用來作為瀏覽器再次請求過程的校驗標識。如過發現校驗標識不匹配,說明資源已經被修改或過期,瀏覽器需求重新獲取資源內容。

1. from disk cache

此資源是從磁碟當中取出的,也是在已經在之前的某個時間載入過該資源,不會請求伺服器但是此資源不會隨著該頁面的關閉而釋放掉,因為是存在硬碟當中的,下次開啟仍會from disk cache。

2. from memory cache

字面理解是從記憶體中,其實也是字面的含義,這個資源是直接從記憶體中拿到的,不會請求伺服器一般已經載入過該資源且快取在了記憶體當中,當關閉該頁面時,此資源就被記憶體釋放掉了,再次重新開啟相同頁面時不會出現from memory cache的情況。

3. 請求**

當http狀態為200是實實在在從瀏覽器獲取的資源,當http狀態為304時該數字是與服務端通訊報文的大小,並不是該資源本身的大小,該資源是從本地獲取的。

1. expires

伺服器傳送給客戶端乙個utc時間(如 expires: thu, 19 nov 2019 08:52:00 gmt),瀏覽器接收到了這個頭,就會為這個資源標記乙個過期時間,在下次的請求時候判斷未過期會直接使用這個資源快取。**會標記為from disk cache

瀏覽器在取到這個快取資源的時候,會用客戶機的時間與之對比,如果還在有效期內,則直接使用這個快取,不進行網路請求。否則會進入其他快取依據判斷。

而這個機制會有乙個問題,就是,快取資源是否過期依賴客戶機時間。客戶機可以通過修改當前時間來使這個快取資源失效

2. cache-control

http/1.1定義的 cache-control 頭用來區分對快取機制的支援情況, 請求頭和響應頭都支援這個屬性。通過它提供的不同的值來定義快取策略。

2.1 max-age

示例:

cache-control: max-age=100

複製**

這個示例表示,這個快取資源在本次請求後的100秒之後都有效。瀏覽器會直接返回from disk cache,不進行網路資源請求。

2.2 no-cache

示例:

cache-control: no-cache

複製**

這個示例表示,這個快取資源不進行強快取校驗,需要通過服務端的協商快取判斷是否啟用。

1. last-modified,if-modified-since

當客戶端訪問資源時,伺服器會將資源最後修改時間通過last-modified標識由伺服器發往客戶端,客戶端記錄修改時間,再次請求本地存在的快取資源時,客戶端會通過if-modified-since頭將先前伺服器端發過來的最後修改時間戳傳送回去,伺服器端通過這個時間戳判斷客戶端的頁面是否是最新的,如果不是最新的,則返回新的內容,如果是最新的,則返回304告訴客戶端其本地快取資源是最新的。

2. etag

伺服器為乙個資源生成乙個唯一的id值,一旦資源在服務端發生了改變則會重新生成乙個tag,客戶端請求資源時,帶上了這個etag,如果不一致,服務端將會傳送最新的資源給使用者,否則重定向304直接使用快取資源。

HTTP 報文頭 初解

在 http報文 一章中,我們介紹了http協議由 行 頭 體組成。而本章,介紹 頭 如果你寫了乙個小爬蟲,但抓出來的結果和想象的不同 例如介面樣式,返回內容和人工看有差異,或者是需要登入 你可以更改你傳送的http請求的header部分,將合法的user agent cookie等添上,能解決大多...

前端http快取

協商快取 禁用快取 指的是瀏覽器第一次請求資源時,瀏覽器快取在本地,並設定時間,如果在這個時間內再次請求,便會讀取快取的資源。對應策略為expires 和 cache control,cache control的優先順序高於expires。強制快取不會請求伺服器。expires 我們用pragma來...

前端快取之HTTP快取

說真的,當自己還很小白的時候,明明修改了js的內容了,但是就是沒有載入成功,那時候感覺好神奇,好沒道理。後來知道了這是因為快取的原因。說實話,現在基於各種框架的開發,基本上沒有在業務 過程中關注快取的事情了,當然,不包括使用localstorage和cookie。今天自己學習了一些關於前端快取的東西...