http緩存

時間 2019-12-14

標籤 http 緩存欄目 HTTP/TCP 简体版

原文原文鏈接

http緩存

有時候爲了頁面加載快，咱們須要讓一部分資源默認緩存在本地，這樣不用每次都進行請求。但如果發佈也被緩存下來，這樣就很尷尬了，原本已經更新了，卻依舊顯示上一次的，這樣就不合理了javascript

各類類型的緩存

私有緩存 [local (private) cache]
- 只能用於單獨用戶 (eg: 瀏覽器設置中的「緩存」選項。瀏覽器緩存擁有用戶經過 HTTP 下載的全部文檔。)
共享緩存 [shared cache]
- 共享緩存能夠被多個用戶使用 (eg: ISP 或你所在的公司可能會架設一個 web 代理來做爲本地網絡基礎的一部分提供給用戶。這樣熱門的資源就會被重複使用，減小網絡擁堵與延遲。)

緩存操做的目標

常見的HTTP緩存只能存儲GET響應，對於其餘類型的響應無能爲力css

緩存控制

Cache-control 頭html

HTTP/1.1定義的 Cache-Control 頭用來區分對緩存機制的支持狀況，請求頭和響應頭都支持這個屬性。經過它提供的不一樣的值來定義緩存策略前端
- 緩存請求指令 [客戶端]java
```
Cache-Control: max-age=<seconds>
  Cache-Control: max-stale[=<seconds>]
  Cache-Control: min-fresh=<seconds>
  Cache-control: no-cache 
  Cache-control: no-store
  Cache-control: no-transform
  Cache-control: only-if-cached
```
- 緩存響應指令 [服務端]web
```
Cache-control: must-revalidate
  Cache-control: no-cache
  Cache-control: no-store
  Cache-control: no-transform
  Cache-control: public
  Cache-control: private
  Cache-control: proxy-revalidate
  Cache-Control: max-age=<seconds>
  Cache-control: s-maxage=<seconds>
```
- 指令解讀
  - 可緩存性
    - public 代表響應能夠被任何對象（包括：發送請求的客戶端，代理服務器，等等）緩存
    - private 代表響應只能被單個用戶緩存，不能做爲共享緩存（即代理服務器不能緩存它）,能夠緩存響應內容
    - no-cache 在發佈緩存副本以前，強制高速緩存將請求提交給原始服務器進行驗證
    - only-if-cached 代表客戶端只接受已緩存的響應，而且不要向原始服務器檢查是否有更新的拷貝
  - 到期
    - max-age=<seconds> 設置緩存存儲的最大週期，超過這個時間緩存被認爲過時(單位秒)。與Expires相反，時間是相對於請求的時間
    - s-maxage=<seconds> 覆蓋max-age 或者 Expires 頭，可是僅適用於共享緩存(好比各個代理)，而且私有緩存中它被忽略
    - max-stale[=<seconds>] 代表客戶端願意接收一個已通過期的資源。可選的設置一個時間(單位秒)，表示響應不能超過的過期時間
    - min-fresh=<seconds> 表示客戶端但願在指定的時間內獲取最新的響應
  - 從新驗證和從新加載
    - must-revalidate 緩存必須在使用以前驗證舊資源的狀態，而且不可以使用過時資源
    - proxy-revalidate 與must-revalidate做用相同，但它僅適用於共享緩存（例如代理），並被私有緩存忽略
  - 其餘
    - no-store 緩存不該存儲有關客戶端請求或服務器響應的任何內容
    - no-transform 不得對資源進行轉換或轉變 (Content-Encoding, Content-Range, Content-Type等HTTP頭不能由代理修改)
  - 示例
    - 禁止緩存apache
```
Cache-Control: no-cache, no-store, must-revalidate
```
    - 緩存靜態資源瀏覽器
```
// 圖像，CSS文件和JavaScript文件
  Cache-Control:public, max-age=31536000
```
禁止進行緩存緩存
```
Cache-Control: no-store
```
強制確認緩存
每次有請求發出時,該請求應該會帶有與本地緩存相關的驗證字段發到服務器，服務器端會驗證請求中所描述的緩存是否過時，若爲過時（返回 304），則緩存才使用本地緩存副本。服務器
```
Cache-Control: no-cache
```
私有緩存和公共緩存
- private 通常應用於瀏覽器私有緩存
- public 能夠被任何中間人（eg: 中間代理， cdn等）緩存
緩存過時機制
- max-age=<seconds> 資源可以被緩存的最大時間, 是距離請求發起的時間的秒數
- Expires 響應頭包含日期/時間，即在此時候以後，響應過時。 如今基本不使用了
  
  若是在Cache-Control響應頭設置了 "max-age" 或者 "s-max-age" 指令，那麼 Expires 頭會被忽略。
```
// http-date: 一個 HTTP-日期 時間戳 (eg: Wed, 21 Oct 2015 07:28:00 GMT)
  Expires: <http-date>
```
緩存驗證確認 must-revalidate

那就意味着緩存在考慮使用一個陳舊的資源時，必須先驗證它的狀態，已過時的緩存將不被使用
Pragma 頭 是HTTP/1.0標準中定義的一個header屬性 (等同於 Cache-Control: no-cache),可是HTTP的響應頭不支持這個屬性

解決方案

實現方案

新鮮度
加速資源
實現方案
前端設置
- 添加時間戳 [get請求] (eg: index.css?v=Date.now())
- 請求頭設置

服務端設置【基於 Apache/2.4.39】參考

找到 httpd.conf
搜索到下面兩個，同時去掉#

LoadModule expires_module modules/mod_expires.so
LoadModule headers_module modules/mod_headers.so

文本後添加

expire 開啓

<IfModule expires_module>

  #打開緩存
  ExpiresActive on 
  #css文件緩存7200000/3600/24=83天
  ExpiresByType text/css A7200000

  #js文件緩存83天
  ExpiresByType application/x-javascript A7200000
  ExpiresByType application/javascript A7200000

  #html文件緩存83天
  ExpiresByType text/html A7200000

  #圖片文件緩存83天
  ExpiresByType image/jpeg A7200000
  ExpiresByType image/gif A7200000
  ExpiresByType image/png A7200000
  ExpiresByType image/x-icon A7200000

</IfModule>

Cache-Control

<FilesMatch "\.(flv|gif|jpg|jpeg|png|ico|swf)$">
　　Header set Cache-Control "max-age=604800, public"
</FilesMatch>

<FilesMatch "\.(css|js)$">
　Header set Cache-Control "max-age=604800, public"
</FilesMatch>