參考地址—如下:

掘金1：瀏覽器緩存
掘金2 :瀏覽器緩存

跟別人怎么講，從大的說：緩存的原理是什么？ 再說什么是瀏覽器緩存？

	緩存的原理是什么：減少請求（瀏覽器向服務器發(fā)起的）

瀏覽器緩存 請求（靜態(tài)資源 ｜ 動態(tài)資源）

一、緩存是什么？

1、如果沒有緩存的機制 每次都要重新請求靜態(tài)資源 1.從網絡上的下載時間，肯定大于從硬盤里讀的時間 2.浪費流量
2、

二、為什么？

文件地址一樣，就一定會緩存
例如： 
首次訪問	www.baidu.com?123.js

更換地址	www.baidu.com?234.js

切回地址	www.baidu.com?123.js

瀏覽器會自動緩存，

瀏覽器是如何判斷是否使用緩存的？？第一次請求網頁

第二次請求相同網頁：

三、怎么做？

問題1、 怎么樣才能讓瀏覽器知道 我需要更新我的緩存了

關于時間戳計算問題參考地址：

假如我設定一個定時器，每到一定的時間去更新  「 cacheTime  」，就解決了

問題2，使用定時器，也會遇到問題，規(guī)定1小時發(fā)送一個請求，但是接口中的數據 5分鐘有改動（數據不及時），或者1小時02分鐘有改動（發(fā)現未變動，獲取的還是緩存中的數據），還是會存在問題，這就是

（強緩存） 的弊端， 我不知道什么時間去更新，去調用。

強緩存：瀏覽器不會像服務器發(fā)送任何請求，直接從本地緩存中讀取文件并返回Status Code: 200 OK

 200 form memory（內存） cache : 不訪問服務器，一般已經加載過該資源且緩存在了內存當中，直接從內存中讀取緩存。瀏覽器關閉后，數據將不存在（資源被釋放掉了），再次打開相同的頁面時，不會出現from memory cache。

200 from disk（硬盤） cache： 不訪問服務器，已經在之前的某個時間加載過該資源，直接從硬盤中讀取緩存，關閉瀏覽器后，數據依然存在，此資源不會隨著該頁面的關閉而釋放掉下次打開仍然會是from disk cache。

注意：優(yōu)先訪問memory cache,其次是disk cache，最后是請求網絡資源

協商緩存： 需要向服務器發(fā)送請求嗎？（肯定發(fā)送了）

***（優(yōu)先級低）一、Last-Modified： 瀏覽器訪問服務器，返回Last-Modified：時間（秒），下次請求通過參數（If-Modified-Since）攜帶過去。

瀏覽器向服務器發(fā)送資源最后的修改時間，單位是s，當1s內有資源修改，如果修改時間是100ms，那么就存在問題。

二、If-Modified-Since：（Last-Modified文件最后修改時間，通過這個參數攜帶）

當資源過期時（瀏覽器判斷Cache-Control標識的max-age過期），發(fā)現響應頭具有Last-Modified聲明，則再次向服務器請求時帶上頭if-modified-since，表示請求時間。服務器收到請求后發(fā)現有if-modified-since則與被請求資源的最后修改時間進行對比（Last-Modified）,若最后修改時間較新（大），說明資源又被改過，則返回最新資源，HTTP 200 OK;若最后修改時間較舊（?。?，說明資源無新修改，響應HTTP 304 走緩存。

*****（優(yōu)先級高）三、Etag：瀏覽器訪問服務器，返回Etag：hash值，下次請求通過參數（If-None-Match）攜帶過去。

Etag是屬于HTTP 1.1屬性，它是由服務器（Apache或者其他工具）生成返回給前端，用來幫助服務器控制Web端的緩存驗證。

Apache中，ETag的值，默認是對文件的索引節(jié)（INode），大小（Size）和最后修改時間（MTime）進行Hash后得到的。

四、If-None-Match:

當資源過期時，瀏覽器發(fā)現響應頭里有Etag,則再次像服務器請求時帶上請求頭if-none-match(值是Etag的值)。服務器收到請求進行比對，決定返回200或304

結論：

• Last-Modifed/If-Modified-Since的時間精度是秒，而Etag可以更精確。
• Etag優(yōu)先級是高于Last-Modifed的，所以服務器會優(yōu)先驗證Etag。
• Last-Modifed/If-Modified-Since是http1.0的頭字段。

問題一？既然有了Last-Modified，為什么還要誕生Etag呢？？

《鳳凰架構》談緩存的時候有提及到：
“Etag 是 HTTP 中一致性最強的緩存機制，譬如，Last-Modified 標注的最后修改只能精確到秒級，如果某些文件在 1 秒鐘以內，被修改多次的話，它將不能準確標注文件的修改時間；又或者如果某些文件會被定期生成，可能內容并沒有任何變化，但 Last-Modified 卻改變了，導致文件無法有效使用緩存，這些情況 Last-Modified 都有可能產生資源一致性問題，只能使用 Etag 解決。

Etag 卻又是 HTTP 中性能最差的緩存機制，體現在每次請求時，服務端都必須對資源進行哈希計算（如果修改的文件特別大），這比起簡單獲取一下修改時間，開銷要大了很多。Etag 和 Last-Modified 是允許一起使用的，服務器會優(yōu)先驗證 Etag，在 Etag 一致的情況下，再去對比 Last-Modified，這是為了防止有一些 HTTP 服務器未將文件修改日期納入哈希范圍內。”文章來源地址http://www.zghlxwxcb.cn/news/detail-664475.html

到了這里，關于前端---需要了解瀏覽器相關知識--瀏覽器請求服務器資源---緩存的文章就介紹完了。如果您還想了解更多內容，請在右上角搜索TOY模板網以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網！