这篇笔记是第六届青训营的第四篇实践笔记

当我们打开开发者工具时，可以看到网页发送的请求，我们平时经常发送的请求一般是get、post请求。 从浏览器发起请求的时候经历了什么样的过程呢？

浏览器的缓存策略

浏览器的缓存策略是指浏览器在请求和响应过程中如何管理和使用缓存来提高性能和减少网络流量。

强缓存

浏览器首先检查资源的缓存标识，如 Cache-Control 和 Expires 头信息。如果资源被标记为可缓存，并且没有过期，浏览器将直接从缓存中获取资源，而不发送请求到服务器，返回 200 状态码。强缓存字段有 Expires 和 Cache-control。

• Cache-Control：通过 max-age 指定资源在缓存中的最长有效时间（以秒为单位）。
• Expires：指定一个具体的过期日期和时间，在该时间之前浏览器会认为资源是有效的。

Cache-Control

Cache-Control 相应头信息的常用项：

• no-cache：浏览器将在发送请求前向服务器验证资源是否过期，即使资源存在本地缓存。如果资源未过期，服务器将返回 304 Not Modified 状态码，否则返回新的资源。
• no-store：浏览器不缓存资源，每次都重新请求完整的资源。
• public：资源可以被任何涉及的缓存（浏览器、CDN等）缓存。
• private：资源只能被单个用户的私有缓存缓存，如浏览器的本地缓存。

实例

以掘金请求文章列表的接口为例：

接口响应头的Cache-control为no-store, no-cache, must-revalidate。 具体意思为浏览器不缓存资源，每次都重新请求完整的资源、资源存在本地缓存、一旦缓存过期，必须向服务器进行校验。 expires字段为0。一个绝对时间表示缓存的到期时间，用于告诉浏览器在过期时间之前不需要发送请求

协商缓存

如果资源的缓存标识过期或不存在，浏览器将发送一个带有特定头信息的请求到服务器，以确定是否可以使用缓存的副本。服务器将检查请求中的 If-Modified-Since 或 If-None-Match 头信息，并与资源的最后修改日期或实体标签进行比较，协商缓存的状态码由服务器决策返回 200 或 304。

协商缓存字段有两组： Last-Modified/If-Modified-Since 和 Etag/If-None-Match

• If-Modified-Since：指定上次请求时返回的响应中的最后修改日期。如果资源在该日期后没有被修改，服务器会返回一个 304 Not Modified 状态码，告知浏览器可以使用缓存副本。
• If-None-Match：指定上次请求时返回的响应中的实体标签（通常是资源的哈希值）。如果资源的实体标签与服务器上的匹配，服务器会返回一个 304 Not Modified 状态码。