生产环境浏览器缓存配置核心是静态资源长期可缓存、动态内容不缓存或短时验证，且须与前端发布策略对齐；静态资源用immutable+max-age实现永不过期，html禁用强缓存，api按语义分级控制，上线后须逐项验证响应头及缓存命中。
生产环境浏览器缓存配置的核心原则是：**静态资源长期可缓存，动态内容不缓存或短时验证，且必须与前端发布策略对齐**。配错会导致用户卡在旧版本、反复清缓存、甚至业务故障——这不是性能优化，而是发布保障环节。
静态资源：用 immutable + max-age 实现“内容不变即永不过期”
对带哈希指纹的 JS/CSS/图片（如 app.a1b2c3.js、style.f4e5d6.css），浏览器应永久信任其内容：
- 使用
expires 1y;或更推荐的add_header Cache-Control "public, immutable, max-age=31536000"; -
immutable 是关键：它告诉浏览器即使 URL 带查询参数（如
?v=2）也不重新验证，避免因构建工具加参导致缓存失效 - 匹配规则建议用扩展名+大小写不敏感：
location ~* \.(js|css|png|jpg|jpeg|gif|ico|webp|woff2?)$
HTML 文件：必须短缓存或禁用强缓存
HTML 是资源入口，内容频繁变更，且无法靠文件名哈希区分版本：
- 禁止设置
expires 1y或max-age=31536000，否则用户永远看不到新页面 - 推荐配置：
add_header Cache-Control "no-cache, must-revalidate, max-age=0"; - 若需轻微缓存（如降低 TTFB），可用
max-age=60，但务必配合 ETag / Last-Modified 协商验证 - 匹配路径建议明确：
location = /index.html { ... }或location ~* \.html$
API 与动态接口：按语义分级控制
后端返回的 JSON、XML 等响应，缓存策略取决于数据时效性与敏感性：
- 公开、低频更新数据（如地区列表）：
add_header Cache-Control "public, max-age=3600"; - 用户私有数据（如个人资料）：
add_header Cache-Control "private, max-age=300"; - 实时性要求高或含敏感信息（如支付状态、会话接口）：
add_header Cache-Control "no-store, no-cache, must-revalidate"; - 注意：若上游已返回
Cache-Control: no-cache，Nginx 的add_header不会覆盖它——需在后端统一控制，或 Nginx 中用proxy_hide_header Cache-Control+ 重写头（慎用）
验证与兜底：确保配置真实生效
上线后必须逐项验证，不能只信 reload 成功：
- 用
curl -I https://yoursite.com/static/app.js检查响应头是否含预期的Cache-Control和Expires - 在 Chrome DevTools → Network 中查看具体资源的
Size列：显示from disk cache或from memory cache表示命中 - 修改资源后，确认 HTML 不缓存、JS/CSS 因文件名变化而加载新版——这是“缓存不可变性”的最终校验点
- 避免全局 location 匹配干扰：例如
location /中的缓存头会覆盖子 location，优先级以最长前缀为准
