核心是分两层缓存：浏览器端用Cache-Control精准控制静态资源缓存，Nginx代理层用proxy_cache减少回源压力，二者目标不同、不可替代，配合效果最佳。
核心是分两层做：一层让浏览器自己缓存（用 Cache-Control 响应头），另一层让 Nginx 代理缓存后端返回的内容（用 proxy_cache）。两者目标不同，不能互相替代，配合使用效果最好。
浏览器端缓存：靠响应头精准控制
静态资源（JS、CSS、图片、字体）一旦发布就很少变动，应让浏览器长期持有。关键是用 Cache-Control，而不是只依赖 expires。
-
带哈希指纹的文件（如
app.a1b2c3.js）：可设为永久缓存，加immutable防止重验证add_header Cache-Control "public, max-age=31536000, immutable"; -
不带版本号的 HTML 文件：不宜长期缓存，建议禁用缓存或设极短时间
add_header Cache-Control "no-cache, must-revalidate"; -
避免 location 优先级踩坑：正则匹配（
~ \.js$）可能被更高优先级的^~或=location 覆盖，建议把缓存配置写在最匹配的 location 块内，或用if判断扩展名兜底
Nginx 代理缓存：减少回源压力
当 Nginx 充当反向代理（比如前端资源由 Node/PHP 动态生成），可在 Nginx 层缓存后端响应，避免每次请求都打到应用服务器。
- 先在
http块定义缓存区：proxy_cache_path /var/cache/nginx levels=1:2 keys_zone=my_cache:10m max_size=2g inactive=1h use_temp_path=off; - 在具体
location中启用：
proxy_cache my_cache;<br> proxy_cache_valid 200 304 12h;<br> proxy_cache_valid 404 1m;<br> proxy_cache_key "$scheme$request_method$host$request_uri";
- 对登录页、含用户信息的接口等动态内容，用
proxy_cache_bypass或proxy_no_cache显式跳过缓存
传输与文件系统层面优化
这些配置不涉及缓存逻辑，但直接影响静态资源交付速度：
-
sendfile on;：启用内核零拷贝，省去用户态内存复制 -
tcp_nopush on;：配合 sendfile，等数据包填满再发，减少小包数量 -
open_file_cache max=1000 inactive=30s;：缓存文件句柄和元数据，降低stat()系统调用开销 -
gzip on;和gzip_types：对文本类资源（HTML、JS、CSS）开启压缩，减小体积
验证与调试不能少
光配不验等于没配。上线后务必检查：
- 用
curl -I https://yoursite.com/app.js看是否返回了预期的Cache-Control和ETag - 加
add_header X-Cache-Status $upstream_cache_status;，响应头中出现HIT才说明代理缓存生效 - 修改资源后清缓存：重启 Nginx（清内存区）、删
/var/cache/nginx（清磁盘缓存），或用第三方模块支持按 key 清除
