Nginx可通过add_header X-Cache-Status $upstream_cache_status always;注入缓存状态头，需先启用proxy_cache或fastcgi_cache并配置cache_path；常见值包括HIT、MISS、EXPIRED等，仅反映Nginx本层缓存。
在前端调试中，快速判断请求是否命中 CDN 或 Nginx 缓存非常关键。Nginx 本身不直接提供标准的缓存状态头，但可通过 add_header 结合内置变量（如 $upstream_cache_status）动态注入 X-Cache-Status，让前端一目了然看到缓存结果。
确认 Nginx 已启用 proxy_cache 或 fastcgi_cache
只有开启缓存模块后，$upstream_cache_status 变量才有值。常见配置示例如下：
- 定义缓存区：
proxy_cache_path /var/cache/nginx levels=1:2 keys_zone=my_cache:10m max_size=1g inactive=60m use_temp_path=off; - 在 server 或 location 块中启用：
proxy_cache my_cache; - 设置缓存键与过期策略，例如：
proxy_cache_key "$scheme$request_method$host$request_uri";和proxy_cache_valid 200 302 10m;
使用 add_header 注入 X-Cache-Status 头部
add_header 必须放在能访问到 $upstream_cache_status 的上下文中（通常是 location 块内），且注意它不会继承父块配置。推荐写法：
前端设计优化skill
下载
前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。
-
add_header X-Cache-Status $upstream_cache_status always;——always参数确保即使响应是 304、4xx 也输出该头 - 避免写在 if 块或不匹配的 location 中，否则变量可能为空或未定义
- 若同时用到了
fastcgi_cache（如 PHP-FPM 场景），对应变量为$fastcgi_cache_status，需按实际缓存类型选择
前端如何查看和利用这个头部
浏览器开发者工具 Network 面板中，点击任意请求 → Headers → Response Headers，即可看到 X-Cache-Status 的值。常见取值含义：
立即学习“前端免费学习笔记（深入）”；
- HIT：命中本地缓存（Nginx 或上游 CDN）
- MISS：未命中，回源拉取
-
EXPIRED：缓存已过期，但仍在使用（stale），通常伴随
proxy_cache_use_stale -
BYPASS：因
proxy_cache_bypass规则跳过缓存 - UPDATING：缓存正在更新（旧内容仍返回，后台异步刷新）
注意事项与常见问题
该头部仅反映 Nginx 本层缓存行为，不体现 CDN 或浏览器缓存状态。若需全链路追踪，建议配合其他头（如 X-Cache、X-Cache-Hits）或日志分析。另外：
- 确保 Nginx 版本 ≥ 1.7.5（
$upstream_cache_status自此版本稳定支持） - 避免在多个 location 中重复添加同名 header，否则可能被覆盖
- 生产环境可考虑关闭该头，或通过 map + 变量控制是否输出，避免暴露服务细节
