http缓存过程

2020-09-23 本文已影响0人 _咻咻咻咻咻

注：http 缓存只能缓存 get 方式请求的资源
浏览器缓存分 强制缓存 和 协商缓存 ，分别使用的字段前者是Expires和Cach-control，后者是 Etag 和 Last-modified。

强制缓存

Expires(http/1.0)：设的是资源的过期时间（绝对时间），浏览器判断这次请求的时候是不是超过这个日期，没超的话就直接读取缓存中的资源，不向服务器发请求。

Pragma：字段值为“no-cache”的时候，会通知客户端不要对该资源读缓存，即每次都得向服务器发一次请求才行。但是这种禁用缓存的形式作用不是那么太大：1. 仅有IE才能识别这段meta标签含义，其它主流浏览器仅能识别“Cache-Control: no-store”的meta标签。2. 在IE中识别到该meta标签含义，并不一定会在请求字段加上Pragma，但的确会让当前页面每次都发新请求，但是仅限页面，页面上的资源则不受影响。
如果Pragma和Expires一起出现的话，Pragma的优先级是高的。

Cach-Control(http/1.1)：缓存控制示例：

Cache-Control: public max-age=3600
Cache-Control: private immutable
Cache-Control: no-cache
Cache-Control: public max-age=3600 s-maxage=7200
Cache-Control: public max-age=3600 proxy-revalidate

Cache-Control 有三种属性：缓冲能力、过期时间和二次验证。

缓冲能力:

private：表示它只应该存在本地缓存；
public：表示它既可以存在共享缓存，也可以被存在本地缓存；
no-cache：表示不论是本地缓存还是共享缓存，在使用它以前必须用缓存里的值来重新验证；会强制浏览器每次都直接向服务端请求，即跳过强制缓存，直接进行协商缓存。
no-store：表示不允许被缓存，禁用一切缓存。

过期时间:

max-age=<seconds>：设置缓存时间，设置单位为秒。本地缓存和共享缓存都可以。是相对时间，是上次请求开始到资源过期之间的时间间隔，可以看做是设定了缓存有效期的长短，没超的话就直接读取缓存中的资源，不向服务器发请求。
s-maxage=<seconds>：覆盖 max-age 属性。只在共享缓存中起作用。

二次验证:

immutable：表示文档是不能更改的。
must-revalidate：表示客户端（浏览器）必须检查代理服务器上是否存在，即使它已经本地缓存了也要检查。
proxy-revalidata：表示共享缓存（CDN）必须要检查源是否存在，即使已经有缓存

Max-Age VS Expires

Expires使用的是服务端时间，可能出现客户端和服务端时间不同步，导致本地缓存无用或无法过期。
Max-Age使用的是客户端本地时间的计算，不会出现这个问题，推荐Max-Age。
如果同时启用了Cache-Control和Pragma ，Expires，Cache-Control优先级高。

协商缓存

Last-Modified / If- Modified-Since(http/1.0)：判断资源最后修改时间，只要这个日期改变了就不使用缓存。浏览器的头部是If- Modified-Since，服务端的是Last-Modified，如果两个匹配，代表服务器资源未改变，服务端不会返回资源实体，只返回头部，通知浏览器使用缓存。
缺点：可能有些文件会周期性地改变日期，但是内容其实没变，但是该字段只判断最后修改时间，
E-tag / If-None-Match(http/1.1)：Etag 是服务器针对请求的资源文件生成的唯一标识，只要文件内容没变化，则Etag值不变，克服了 Last-Modified / If- Modified-Since 的缺点。浏览器的头部是If-None-Match，服务端的是E-tag，如果两个匹配，代表内容未改变，通知浏览器使用缓存。
Etag 缺点：不适用于分布式系统，因为每个服务器上的 Etag 值不同。

如果同时带有E-tag和Last-Modified，服务端优先检查E-tag。