在我们使用浏览器访问网页的过程中，浏览器经常会缓存各种网页中的内容。当再次访问同一个网页时，可以发现部分内容是从缓存直接读取的。
查看HTTP的响应信息，就能发现一些端倪。比如响应 200 from cache； 304 not modify 等等。
下面对浏览器使用缓存的各种情形做一下分析：
Pragma
Pragma是HTTP 1.0版本的一个参数，在HTTP 1.1版本里面这个参数也会生效，如果不想浏览器缓存网页的内容，可以在 Response header 里面加上 ：Pragma: no-cache。
Cache-Control
Cache-Control是HTTP 1.1版本新增的一个参数。
Cache-Control:no-store 不允许缓存
Cache-Control:no-cache 不允许直接使用缓存，需要先发起请求和服务器协商(这个经常被误认为是不允许缓存，实际上它的作用是让浏览器在使用缓存前先请求服务端一次，确认内容是否有更新)
Cache-control: max-age=86400 表示缓存86400秒 如果你在缓存期间再次访问 并且没有设置 Cache-Control:no-cache , 就可以看到这个响应：
QQ20180325-170150@2x.png
这样的响应代表没有跟服务端进行交互，内容是直接从本地读取的。
Expires
Expires和Cache-control: max-age= 有类似的作用，都是指定缓存内容的有效周期，Expires指定的格式是格林威治时间，max-age则是秒数。
Last-Modified/If-Modified-Since
服务端也可以在 Response header 里加上 Last-Modified,它的格式是格林威治时间，再次请求时，浏览器的 Request header 中会多出一个叫 If-Modified-Since的值，通过比较这两个值是否一致来决定是否返回304。
ETag/If-None-Match
ETag的用法和 Last-Modified 类似，值是一种文件指纹。比如：ETag:"5a3ccff0-5dc"。
服务端在 Response header 里加上 ETag，再次请求时，浏览器的 Request header 中会多出一个叫 If-None-Match的值，通过比较这两个值是否一致来决定是否返回304。
总结
总体来说，浏览器使用缓存时有两种表现：
1.直接从本地读取，不与服务端有交互，就是 200 OK (from memory cache)。
2.请求一次服务端，查看本地缓存是否生效，这种方式叫 协商缓存。如果服务端判断缓存有效，将不返回完整内容，而是返回 304 Not Modified。
在优先级上 Pragma > Cache-Control > Expires。
网友评论