彩票开奖查询|今天3d开奖号码

服務端 http:深入了解一下HTTP緩存機制

HTTP 緩存機制作為 web 性能優化的重要手段,是Web 開發知識體系庫中的一個基礎環節,但是對于很多學習者來說,僅僅只是知道瀏覽器會對請求的,靜態文件進行緩存,但是為什么被緩存,緩存是怎樣生效的,卻并不是很清楚。在此,用簡單明了的文字介紹HTTP緩存機制,期望對各位學習者正確的理解前端,緩存有所幫助。

一、緩存規則解析

HTTP緩存有多種規則,根據是否需要重新向服務器發起請求來分類,分為兩大類(強制緩存,對比緩存),在詳細介紹這兩種規則之前,先通過時序圖的方式,讓大家對這兩種規則有個簡單了解。

已存在緩存數據時,僅基于強制緩存,請求數據的流程如下:

已存在緩存數據時,僅基于對比緩存,請求數據的流程如下:

可以看到兩類緩存規則的不同,強制緩存如果生效,不需要再和服務器發生交互,而對比緩存不管是否生效,都需要與服務端發生交互。兩類緩存規則可以同時存在,強制緩存優先級高于對比緩存,也就是說,當執行強制緩存的規則時,如果緩存生效,直接使用緩存,不再執行對比緩存規則。

二、強制緩存

從上文我們得知,強制緩存,在緩存數據未失效的情況下,可以直接使用緩存數據,那么瀏覽器是如何判斷緩存數據是否失效呢?在沒有緩存數據的時候,瀏覽器向服務器請求數據時,服務器會將數據和緩存規則一并返回,緩存規則信息包含在響應header中。

對于強制緩存來說,響應header中會有兩個字段來標明失效規則(Expires/Cache-Control)使用chrome的開發者工具,可以很明顯的看到對于強制緩存生效時,網絡請求的情況。

Expires:Expires的值為服務端返回的到期時間,即下一次請求時,請求時間小于服務端返回的到期時間,直接使用緩存數據。

不過Expires屬于 是HTTP系列,現在默認瀏覽器均默認使用HTTP ,所以它的作用基本忽略。另一個問題是,到期時間是由服務端生成的,但是客戶端時間可能跟服務端時間有誤差,這就會導致緩存命中的誤差。

Cache-Control:Cache-Control 是最重要的規則。常見的取值有private、public、no-cache、max-age,no-store,默認為private。

private: 客戶端可以緩存。

public: 客戶端和代理服務器都可緩存(前端的同學,可以認為public和private是一樣的)。

max-age=xxx: 緩存的內容將在 xxx 秒后失效。

no-cache: 需要使用對比緩存來驗證緩存數據(后面介紹)。

no-store: 所有內容都不會緩存,強制緩存,對比緩存都不會觸發。

舉個例子:

圖中Cache-Control僅指定了max-age,所以默認為private,緩存時間為31536000秒(365天)也就是說,在365天內再次請求這條數據,都會直接獲取緩存數據庫中的數據,直接使用。換通俗一點的話來說。當客戶端第一次訪問資源的時候,服務端在返回資源內容的同時也返回了Expires: Sun, 16 Oct05:43:02 GMT。

服務端告訴瀏覽器: 你Y的先把這個文件給我緩存起來,在這個過期時間之前,這個文件都不會變化了,你下次需要這個文件的時候,你就不要過來找我要了,你就去緩存中拿就好了,又快又好。

瀏覽器回答說:諾

于是在第二次html頁面中,又要訪問這個資源的時候,并且訪問的日期在Sun, 16 Oct 05:43:02 GMT之前,瀏覽器就不去服務器那邊獲取文件了,自己從緩存中自食其力了。

但是瀏覽器畢竟是在客戶端的,客戶端的時間可是不準確的,用戶可以隨著自己的喜好修改自己機器的時間,比如我把我機器的時間調成Sun, 16 Oct 05:43:03 GMT,過期了?我的瀏覽器就不會再使用緩存了,而每次都去服務器獲取文件。于是,服務器怒了:給你個絕對時間,你由于環境被修改沒法判斷過期,那么我就給你相對時間吧。于是就返回了Cache-Control: max-age:600,瀏覽器你給我緩存個10分鐘去。于是瀏覽器只有乖乖的緩存10分鐘了。

但是問題又來了,如果有的服務器同時設置了Expires和Cache-Control怎么辦呢?那么就是根據更先進的設置Cache-Control來為標準。好了,現在有個問題,我有個文件可能時不時會更新,服務端非常希望客戶端能時不時過來問一下,這個文件是否過期,如果沒有過期,服務端不返回數據給你,只告訴瀏覽器你的緩存還沒有過期(304)。然后瀏覽器使用自己存儲的緩存來做顯示。這個就叫做條件請求。

三、對比緩存

對比緩存,就是需要進行比較判斷是否可以使用緩存。瀏覽器第一次請求數據時,服務器會將緩存標識與數據一起返回給客戶端,客戶端將二者備份至緩存數據庫中。

再次請求數據時,客戶端將備份的緩存標識發送給服務器,服務器根據緩存標識進行判斷,判斷成功后,返回304狀態碼,通知客戶端比較成功,可以使用緩存數據。

對于對比緩存來說,緩存標識的傳遞是我們著重需要理解的,它在請求header和響應header間進行傳遞,一共分為兩種標識傳遞,接下來,我們分開介紹。

Last-Modified / If-Modified-Since

Last-Modified:服務器在響應請求時,告訴瀏覽器資源的最后修改時間。

If-Modified-Since:再次請求服務器時,通過此字段通知服務器上次請求時,服務器返回的資源最后修改時間。服務器收到請求后發現有頭If-Modified-Since 則與被請求資源的最后修改時間進行比對。若資源的最后修改時間大于If-Modified-Since,說明資源又被改動過,則響應整片資源內容,返回狀態碼200;若資源的最后修改時間小于或等于If-Modified-Since,說明資源無新修改,則響應HTTP 304,告知瀏覽器繼續使用所保存的cache。

Etag / If-None-Match(優先級高于Last-Modified / If-Modified-Since):第一次客戶端訪問資源的時候,服務端返回資源內容的同時返回了ETag:1234,告訴客戶端:這個文件的標簽是1234,我如果修改了我這邊的資源的話,這個標簽就會不一樣了。

第二次客戶端訪問資源的時候,由于緩存中已經有了Etag為1234的資源,客戶端要去服務端查詢的是這個資源有,木有過期呢?所以帶上了If-None-Match: 1234。告訴服務端:如果你那邊的資源還是1234標簽的資源,你就返回304告訴我,不需要返回資源內容了。如果不是的話,你再返回資源內容給我就行了。服務端就比較下Etag來看是返回304還是200。

四、各種刷新

理解了上面的緩存標簽之后就很好,理解各種刷新了。

刷新有三種:

  • 瀏覽器中寫地址,回車
  • F5
  • Ctrl+F5

假設對一個資源:瀏覽器第一次訪問,獲取資源內容和cache-control: max-age:600,Last_Modify: Wed, 10 Aug 15:32:18 GMT于是瀏覽器把資源文件放到緩存中,并且決定下次使用的時候直接去緩存中取了。

瀏覽器url回車:瀏覽器發現緩存中有這個文件了,就不發送任何請求了,直接去緩存中獲取展現。(最快)。

F5刷新:F5就是告訴瀏覽器,別偷懶,好歹去服務器看看這個文件是否有過期了。于是瀏覽器就膽膽襟襟的發送一個請求帶上If-Modify-since:Wed, 10 Aug 15:32:18 GMT。

然后服務器發現:這個文件我在這個時間后還沒修改過,不需要給你任何信息了,返回304就行了。于是瀏覽器獲取到304后就去緩存中,歡歡喜喜獲取資源了。

如果我們按下了Ctrl+F5,這個可是要命了,告訴瀏覽器,你先把你緩存中的這個文件給我刪了,然后再去服務器請求個完整的資源文件下來。于是客戶端就完成了強行更新的操作...實際上很少人使用,因為它的計算是使用算法來得出的,而算法會占用服務端計算的資源,所有服務端的資源都是寶貴的,所以就很少使用了。


相關推薦:










網友評論

彩票开奖查询 极速快乐十分开奖结果 广西11选5的台子 网上炸金花真人赌钱 捕鱼达人2原版下载 浙江十二选五推荐号码 时时彩开奖直播网址 山西快乐十分投注网站 全梭哈表情包 河北风采好运彩3 老时时0613