正文
1、基本介绍
浏览器会存储用户最近请求过的资源，当用户再次请求同一资源时，浏览器可以直接从本地读取
这样，不仅可以提高浏览器的加载速度，也能减轻服务器的负载压力，可以说是一举两得
具体而言，浏览器的缓存策略分为两种，一种是强缓存（又称本地缓存），一种是弱缓存（又称协商缓存）
它们的行为会根据响应头和请求头的特定字段决定
- 强缓存与 expires 和 cache-control 字段有关
- 弱缓存与 etag / if-none-match 和 last-modified / if-modified-since 字段有关
2、本地缓存
本地缓存：当一个请求发生时，浏览器自己决定是否从缓存中读取数据
在浏览器第一次请求资源时，服务器会返回资源，并在响应中设置 expires 或 cache-control 字段
然后浏览器会把这些信息都缓存下来，当再次请求资源时，浏览器先不向服务器发送请求
而是根据该资源的 expires 或 cache-control 字段判断缓存的资源是否已经失效
如果缓存没有失效，那么直接读取缓存拿到资源
exprise：表示这个资源的失效时间，它的值是一个绝对时间的 GMT 格式字符串
cache-control：表示这个资源的失效时间，主要通过该字段的 max-age 进行设置，值是一个相对时间
此外，这个字段还能设置其它的值，不同的值表示不同的含义，列举如下：
no-cache 表示不使用本地缓存，而使用协商缓存；no-store 表示禁止浏览器缓存资源
public 表示允许所有用户缓存，包括 CDN 等中间代理服务器；private 表示只能被终端用户缓存
注意，由于 exprise 使用的是绝对时间，如果服务端和客户端的系统时间相差较大，容易出现缓存混乱
exprise 和 cache-control 可以同时设置，在同时设置的情况下 cache-control 的优先级高于 exprise
3、协商缓存
协商缓存：当一个请求发生时，由服务器来决定是否从缓存中读取数据
在浏览器第一次请求资源时，服务器会返回资源，并在响应中设置 last-modified 或 etag 字段
然后浏览器会把这些信息都缓存下来，当再次请求资源时，浏览器会发送一个 Conditional GET 请求
并在请求中带上 if-modified-since 或 if-none-match 字段
服务器根据 if-modified-since 或 if-none-match 字段的值判断缓存的资源是否已经失效
如果缓存没有失效，那么返回 304，但不返回资源，浏览器收到 304 后就从缓存中读取资源
如果缓存已经失效，那么返回 200，并且返回资源，浏览器收到 200 后它就使用返回的资源
注意，last-modified 和 if-modified-since 是成对出现的，etag 和 if-none-match 是成对出现的
last-modified 和 if-modified-since
last-modified 表示这个资源的最后修改时间，if-modified-since 的值就是 last-modified 的值
如果服务器判断缓存没有失效，也就意味着资源没有被修改，所以也不用返回 last-modified
etag 和 if-none-match
etag 它是这个资源的唯一标识，当资源变化时，etag 也会变化，if-none-match 的值就是 etag 的值
如果服务器判断缓存没有失效，由于 etag 可能会重新生成，即使值没有变化，所以始终会返回 etag
last-modified 和 etag 可以同时设置，在同时设置的情况下 etag 的优先级高于 last-modified
4、完整过程
在实际使用中，本地缓存和协商缓存一般都会同时使用，一个完整的过程如下：
浏览器在第一次请求资源时，会缓存资源和相关的信息
在之后的请求中，通过本地缓存和协商缓存策略，决定是否从缓存中读取资源
首先检查本地缓存
浏览器检查该资源的 expires 或 cache-control 字段，判断资源是否过期
如果资源没有过期，那么直接从缓存中读取，整个过程到此结束；如果已经过期，就继续走下面的流程
然后检查协商缓存
如果该资源有 etag 字段，则向服务器发送一个 Conditional GET 请求，带上 if-none-match 字段
或该资源有 last-modified 字段，也发送一个 Conditional GET 请求，带上 if-modified-since 字段
然后，服务器根据 if-none-match 或 if-modified-since 字段，判断缓存是否失效
如果缓存没有失效，那么返回 304，但不返回资源，浏览器收到 304 后就从缓存中读取资源
如果缓存已经失效，那么返回 200，并且返回资源，浏览器收到 200 后它就使用返回的资源
5、用户行为
用户在浏览器上进行的操作对浏览器缓存的使用方式有很大的影响
比如，在地址栏输入链接进入页面、通过前进后退进入页面等的行为都会同时启用强缓存和弱缓存
但普通刷新 ( F5 ) 会忽略强缓存而启用弱缓存，而强制刷新 ( Ctrl + F5 ) 会同时忽略强缓存和弱缓存
