在前面

HTTP缓存 是浏览器或代理服务器对之前请求过的资源进行存储，当再次请求相同资源时，可以直接从本地缓存中获取，避免重复向服务器发起请求的机制，可显著减少网络传输量、降低服务器负载、提升用户体验。

核心流程

首次请求

后续请求

• 若缓存有效：直接返回缓存资源（状态码 200 OK，标注 from cache）。

• 若缓存过期：向服务器发送验证请求（携带 If-None-Match/If-Modified-Since），服务器判断资源是否更新：
• 未更新：返回 304 Not Modified，浏览器使用本地缓存。
• 已更新：返回新资源及新缓存规则。

缓存策略

强制缓存

浏览器根据响应头中的 Cache-Control 判断缓存是否过期，无需向服务器发送请求。

• public：允许浏览器和代理服务器缓存（如 CDN）。

• private：仅允许浏览器缓存（默认值）。

• max-age=秒数：缓存有效期（如 max-age=3600 表示 1 小时内有效）。

• no-cache：并非禁止缓存，而是需要先验证（与协商缓存配合使用）。

• no-store：禁止缓存，每次请求必须从服务器获取资源（用于敏感数据）。

服务端

css文件

html

首次请求

后续请求

缓存有效

缓存失效

协商缓存

浏览器发送请求时携带缓存标识（ETag/Last-Modified），服务器根据标识判断是否返回新资源。

1. ETag/If-None-Match（精确匹配）

• 服务器通过 ETag 返回资源的唯一标识（如文件哈希值）。

• 浏览器下次请求时携带 If-None-Match: <ETag值>，服务器对比标识：
• 一致：返回 304 Not Modified。
• 不一致：返回新资源及新 ETag。

1. Last-Modified/If-Modified-Since（时间匹配）

• 服务器通过 Last-Modified 返回资源最后修改时间（如 Last-Modified: Thu, 22 May 2025 12:00:00 GMT）。

• 浏览器下次请求时携带 If-Modified-Since: <时间值>，服务器对比时间：
• 未修改：返回 304 Not Modified。
• 已修改：返回新资源及新 Last-Modified。

服务端

首次请求

再次请求

缓存有效

缓存失效