浏览器的缓存方式主要分为以下几种：

1. 强制缓存（强缓存 / Memory Cache & Disk Cache）

通过 Expires 或 Cache-Control 头部控制。

在缓存有效期内，浏览器直接使用缓存，不发起请求。

关键HTTP头：

Expires: Wed, 21 Oct 2025 07:28:00 GMT（绝对时间，容易受客户端时间影响）

Cache-Control: max-age=3600, public（相对时间，推荐使用）

存储位置：

Memory Cache（内存缓存）：用于短时间内频繁访问的资源（如当前页面的 CSS、JS）。

Disk Cache（磁盘缓存）：用于存储较大的资源，关闭页面后仍然有效。

2. 协商缓存（弱缓存 / ETag & Last-Modified）

如果强缓存失效，浏览器会发送请求，并通过协商缓存判断资源是否更新。

如果资源未更新，服务器返回 304 Not Modified，浏览器继续使用缓存的资源。

关键HTTP头：

Last-Modified（资源的最后修改时间） & If-Modified-Since

ETag（资源的唯一标识符） & If-None-Match

3. Service Worker 缓存

Service Worker 作为浏览器的代理，拦截请求并返回缓存，适用于 PWA（渐进式Web应用）。

可用 Cache API 控制哪些资源缓存、如何更新。

4. 浏览器存储（LocalStorage / SessionStorage / IndexedDB）

LocalStorage：持久化存储，关闭页面或浏览器不会丢失数据。

SessionStorage：会话级存储，页面关闭后数据丢失。

IndexedDB：适用于存储大量数据，如 JSON 对象。

5. Push Cache（HTTP/2 推送缓存）

仅限 HTTP/2 使用，服务器可以主动推送资源到客户端缓存，但 生命周期很短，仅在会话（Session）内有效。

总结

缓存方式

是否需要请求

过期控制

适用场景

强缓存

否

Cache-Control / Expires

资源不变更，减少请求

协商缓存

是

ETag / Last-Modified

资源可能变更

Service Worker

否

自定义缓存规则

PWA、离线缓存

浏览器存储

否

自己控制

存储 JSON、用户设置

Push Cache

否

仅会话内有效

HTTP/2 服务器推送

你可以根据需求选择合适的缓存策略！🚀