瀏覽器緩存詳解

第一次請求了 100 個文件, 再次訪問的時候,若是所有從新請求, 很是浪費時間, 也很笨拙.

分析:

由於有些文件, 在用戶的屢次請求中, 都是相同的, 若是屢次請求都重複請求這個文件, 無疑是一種浪費.

那麼就想到了緩存: 把資源緩存到本地, 再次請求的時候直接使用本地的緩存文件.

走極端:

把全部的文件都緩存起來.

分析:

這樣也不行, 由於在請求過來的 100 個文件中, 可能有一部分是長久不變的, 有一部分是隔一段時間就變的,
 還有的文件是每次都不同的.

那麼怎麼辦?

要區分這些文件, 緩存的主動方(瀏覽器) 說: 我要知道我要不要緩存一個文件, 我要知道下次請求的時候對於
 某個文件我到底能不能直接用緩存, 仍是須要從新請求.

OK.

服務器說: 那我跟你說每一個文件的你要不要緩存, 何時不能用緩存.
而後服務器就在響應的時候, 添加一個響應頭 Expires

相似這樣:Expires: Thu, 01 Dec 1994 16:00:00 GMT （必須是GMT格式）

瀏覽器獲得這個文件以後, 先使用這個文件.
過了一會用戶從新請求了

瀏覽器把 Expires 標記的時間 a, 和當前請求的時間 b 作個對比, 若是是這樣
      a....b  // 說明過時了, 那麼就從新請求
      b....a  // 咦還沒過時, 還能吃

與 Expires 有一樣功能的還有 Cache-Control, Parama 等響應頭
Cache-Control 是 HTTP 1.1 提出的, Expires 是 HTTP 1.0 提出的, 前者比後者優先級高--在同時使用的時候.

...

而後, 瀏覽器發現不對, 這個文件過時了, 我從新拿過來的怎麼仍是和過時的同樣, 你丫騙我.
服務器說: 那我能怎麼辦, 你又要過時時間, 還不能不給, 那哪能每一個文件的過時時間我都能精確算出來, 那個文件明明我以爲
它常常變, 誰知道它一直都不變.

OK.

服務器給出了個解決方案:

你看這樣, 我呢, 把每一個文件算出來一個值, 只要文件變化了, 這個值就會改變. 而後把這個值扔給你。
 你若是發現緩存過時了, 請求的時候把這個值也給我.
 我來看看這個值和我這邊的值是否是同樣的
 若是是同樣的, 那麼說明這個文件沒有變對不對, 那我就不給你文件了,給你一個 304 你再繼續使用緩存文件

這個值使用 Etag 來標記,
客戶端在緩存過時從新請求的時候, 加上一個頭 If-None-Match:(Etag的值)
OK.

服務器又說了, 哎這樣的話我還想到另一種方案

我給你文件的時候標記一下這個文件最後修改的時間, 你要是發現緩存過時了, 從新請求的時候把這個時間給我
 我比較一下我這邊記錄的最新的文件更改時間, 若是兩個相同不就說明文件沒改, 對不對.

服務器給客戶端的時間叫: Last-Modified客戶端返回過來的是: If-Modified-Since(Last-Modified 的值)