HTTP 缓存1 HTTP 缓存 http缓存流程图 http缓存分类 1.1 http缓存流程图 1.2 http缓存

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

直接从本地副本比对读取，**不去请求服务器**，返回的状态码是 **200**

强缓存不会发送请求，直接使用，设置强缓存可以减少不必要请求
命中强缓存时，浏览器并不会发起请求，在Chrome开发者工具中可以看到http返回的状态码是200,size列会显示为memory cache或 disk cache

memory cache
不访问服务器，一般已经加载过该资源且缓存在了内存当中，直接从内存中读取缓存。浏览器关闭后，数据将不存在（资源被释放掉了），再次打开相同的页面时，不会出现memory cache。
disk cache
不访问服务器，已经在之前的某个时间加载过该资源，直接从硬盘中读取缓存，关闭浏览器后，数据依然存在，此资源不会随着该页面的关闭而释放掉下次打开仍然会是 disk cache。

强缓存是利用http的返回头中的Expires或者Cache-Control两个字段来控制的，用来表示资源的缓存时间。

该字段返回一个时间，如expires: Sun, 14 Aug 2022 08:50:40 GMT
代表资源的失效时间，即在2022/08/14 08:50:40之前都是有效的。

Expires的缺点
失效时间是绝对时间，本地时间被修改之后导致服务器与客户端时间出现偏差过大，导致缓存混乱

为了弥补Expires的缺点,Cache-Control出现了，Cache-Control不依赖客户端时间。该字段是一个相对时间，如cache-control: max-age=3600,表示资源有效期是3600秒。

Expires和Cache-Control可以同时配置启用，也可单独启用，同时启用时Cache-Control优先级最高

cache-control 主要有 max-age 和 s-maxage、public 和 private、no-cache 和 no-store 等值。

max-age 和 s-maxage
两者是 cache-control 的主要字段，它们是一个数字，表示资源过了多少秒之后变为无效。在浏览器中，max-age 和 s-maxage 都起作用，而且 s-maxage 的优先级高于 max-age。在代理服务器中，只有 s-maxage 起作用。可以通过设置 max-age 为 0 表示立马过期来向服务器请求资源。
public 和 private
public 表示该资源可以被所有客户端和代理服务器缓存，而 private 表示该资源仅能客户端缓存。默认值是 private，当设置了 s-maxage 的时候表示允许代理服务器缓存，相当于 public。
no-cache 和 no-store
no-cache 表示的是不直接询问浏览器缓存情况，而是去向服务器验证当前资源是否更新（即协商缓存）。no-store 则更狠，完全不使用缓存策略，不缓存请求或响应的任何内容，直接向服务器请求最新。由于两者都不考虑缓存情况而是直接与服务器交互，所以当 no-cache 和 no-store 存在时会直接忽略 max-age 等。

若未命中强缓存，则浏览器会请求服务器，服务器根据http头信息中的Last-Modify/if-Modify-Since或Etag/If-None-Match来判断是否命中协商缓存，如果命中则返回状态码304，浏览器就在缓存中加载资源。

第一次请求时，服务器的返回头中会返回last-modified 记录资源最后修改的时间当再次请求该资源时，请求头中会带有 if-modified-since 字段，值是之前返回的 last-modified 的值

服务器收到if-modified-since后根据资源的最后修改时间来判断是否命中缓存判断规则
若一致则证明没有被修改，告知浏览器可直接使用缓存并返回 304；若不一致则直接返回修改后的资源，并修改 last-modified 为新的值。

Etag/If-None-Match返回的是一个校验码，Etag可以保证每个资源是唯一的，资源变化导致Etag变化。首次请求是响应头会返回Etag的值回来

服务器会根据请求头上的If-None-Match来判断是否命中缓存，If-None-Match值是之前返回的 Etag 值

强 ETag 值和弱 Tag 值
ETag 中有强 ETag 值和弱 ETag 值之分。

ETag: "usagi-1234"

ETag: W/"usagi-1234"

①Last-Modified只能精确到秒，1秒内多处修改无法准确标注文件修改时间。 ②Etag优先级高
③Etag 比 last-modified 更加精准地感知了变化
④Etag 生成标识字符串会增加服务器的开销