HTTP協議定義的緩存機制(如:Expire;Cache-control等)html
瀏覽器無緩存場景圖瀏覽器
瀏覽器有緩存場景圖緩存
緩存校驗過時機制服務器
(1)第一步:客戶端緩存校驗app
第一步:本地客戶端經過Expires、Cache-Control(max-age)字段校驗本地緩存是否過時3d
Expires出如今Http1.0版本;Cache-Control(max-age)出如今Http1.1版本;code
(2)第二步:Etag緩存校驗server
第二步:經過Etag頭信息校驗服務器緩存是否過時,若是不過時,不走第三步,不然執行下一步htm
Etag解釋:blog
(3)第三步:Last-Modified緩存校驗
第三步:經過Last-Modified頭信息校驗服務器緩存是否過時,若是不過時,直接返回,不然請求服務端。
Last-Modified解釋:
Last-Modified的值是具體時間:年-月-日 時:分:秒
Last-Modified用來跟服務端的緩存文件進行校驗,若是服務端緩存文件在新的時間有新的更新,客戶端請求的時間就會跟服務端緩存文件時間對比,這個時候就會出現客戶端請求的時間跟服務端請求的時間不一致。 這樣的話,服務端就會把最新的文件返回給客戶端,這個利用的就是請求頭中的Last-Modified頭信息進行校驗的。
瀏覽器請求到服務端緩存原理圖
304狀態碼:客戶端已經執行了GET,但文件未變化。
Nginx在響應頭中添加:Cache-Control、Expires頭
expires過時時間語法
Syntax:
Default:expires off;
Context: http, server, location, if in location
(1)配置location
location ~ .*\.(htm|html)$ { root /opt/app/code; }
(2)建立新的html文件
在/opt/app/html目錄下建立index.html文件並編寫內容
<h1>hello zhangbiao </h1>
訪問
http://www.zhangbiao.com/index.html
第一次請求
連續請求 響應狀態碼 304
客戶端請求頭攜帶這兩個字段,目的是跟服務端本地緩存文件對比
Nginx配置location
location ~ .*\.(htm|html)$ { expires 24h; root /opt/app/code; }
第一次請求:查看請求頭和響應頭信息
響應頭多了兩個字段:
第二次請求:查看請求頭和響應頭信息
響應頭中Cache-Control字段在第一次和第二次的值都同樣
無論Nginx是否配置expires過時時間,第二次請求都會攜帶這兩個字段