介绍一下浏览器缓存策略

[sisterAn]

浏览器缓存机制分析及实际应用.pptx

[blackhu0804]

浏览器缓存分为强缓存和协商缓存

强缓存规则

1. Expires 是 http1.0 的缓存标识字段，值为浏览器缓存到期时间，如果服务器时间和本地时间不一致会导致缓存失效的问题。
2. Cache-Control 是 http 1.1的缓存标识字段，优先级大于 Expires；

协商缓存

1. Last-modified 和 If-Modified-Since ， Last-Modified 返回资源上次修改的时间， If-Modified-Since 是客户端发起请求时上次的 Last-Modified 值。发起请求时，两值做比对。命中缓存返回304，缓存失效返回200，重新获取新的资源。
2. ETag 和 If-None-Match，ETag 代表资源的唯一标识，发起请求时会携带 If-None-Match 值和服务器中的 ETag 做比对。命中缓存返回304，缓存失效返回200，重新获取新的资源。且优先级大于 Last-Modified 和 If-Modified-Since。

[yancongwen]

浏览器缓存按照请求的优先级顺序包括以下四个阶段：Mermory Cache、Service Worker Cache、HTTP Cache、Push Cache。其中最常用的是HTTP Cache。

HTTP Cache

HTTP Cache 又可以称为 Disk Cache，因为缓存是存储在硬盘上的。HTTP 缓存又可以分为强制缓存和协商缓存。

强制缓存

强制缓存的意思就是，如果判定缓存有效，就不再请求服务器，而是直接读取本地硬盘缓存内容，因此不会发起网络请求，状态码显示为200。控制强制缓存的有以下两个头部字段:

Expire

Expire是 HTTP 1.0 时期的字段，表示资源过期时间。当用户当前时间早于Expire设置的时间，则不再请求服务器，否则请求。Expire有一个缺陷，就是用户设备时间不靠谱，可能被篡改。

Catche-Control

Catche-Control 是HTTP 1.1新增的字段，可配置性更强。包括以下属性：

• max-age，表示有效期时长，单位为秒
• public
• private，控制转发服务器能否缓存
• no-cache，跳过强制缓存
• no-store，跳过强制缓存和协商缓存

协商缓存

Last-Modified/If-Modified-Since

Last-Modified 表示资源上次修改时间，当请求头If-Modified-Since中的值不等于资源当前值，则未命中，返回资源，状态码200；如果命中缓存，则响应体为空，状态码304；

Etag/If-None-Match

Etag 是指文件的一个标识，一般采用某种算法（如MD5）计算出一个唯一标识，当文件修改时，改唯一标识就会改变。第一次请求时，响应头中包含 Etag 响应头，后续再次请求该资源时，会携带 If-None-Match 请求头，服务器判断 If-None-Match 和 文件当前 Etag 值是否相等，相等则命中缓存，返回 304；否则返回 200；

Etag 的优先级高于 Last-Modified

Mermory Cache

Mermory Cache 指存储在内存中的换粗，它的特点就是存储时间短、资源小。通常的场景是，网页中多次引用同一张图片，那么只会请求一次。当页面退出，缓存即失效。至于哪些资源会被缓存进内存，不同浏览器策略不同。

Service Worker Cache

Service Worker 是一个独立于主线程之外的一个独立线程，需要编写 JS 脚本去控制缓存哪些资源。Service Worker 缓存未命中，才会进行进入 HTTP 缓存的判断。

Push Cache

HTTP2 才有。得益于 HTTP2 的多路复用、服务端推送等特性。Push Cache 是会话级别的缓存，会话结束，缓存失效。

[liyanangrace]