http 缓存

http 缓存

什么是缓存？ 把从服务器获取到的资源（例如：js、css、img）存储到本地磁盘中，下一次直接从本地磁盘中获取，节省请求的时间

强制缓存

1、首次请求，服务器返回资源，并在响应头中设置 Cache-Control，本地将资源进行缓存

2、再次请求，直接从本地磁盘获取资源

Cache-Control 的取值：

• max-age：缓存最大过期时间
• no-cache：可以在客户端存储资源，但每次都必须去服务端做新鲜度校验，从而决定是从服务端获取新的资源（200）还是使用客户端缓存（304）
• no-store：永远都不要在客户端存储资源，永远都去服务器获取资源

协商缓存

服务端收到请求后，判断客户端的资源是否和服务端资源一致，如果一致则返回 304，客户端就从本地缓存中获取资源，否则返回 200 和最新的资源。

1、首次请求，服务端返回资源，并在响应头中设置资源标识

2、再次请求，请求头带上资源标识，服务端根据标识判断返回 304 还是 200 和最新资源

响应头的资源标识属性有：

• Last-Modified：资源的最后修改时间
• Etag：资源的唯一标识（一个字符串，类似于人类的指纹）

请求头的资源标识属性有：

• If-Modified-Since
• If-None-Match

分别与 Last-Modified 和 Etag 对应。

优先使用 Etag，因为 Last-Modified 只能精确到秒级，如果资源被重复生成，而内容不变，则 Etag 更精确

三种刷新操作对 http 缓存的影响

操作	触发方法	强缓存	协商缓存
正常操作	地址栏输入 url，跳转链接，前进后退等	√	√
手动刷新	F5，点击刷新按钮，右键菜单刷新	×	√
强制刷新	Ctrl + F5，Command + R	×	×