nginx静态资源缓存动态更新靠url哈希化、精准缓存头控制和配置热生效三环联动:构建时生成带内容哈希的文件名(如app.a1b2c3.js),配以expires 1y和immutable强缓存;非哈希路径设短缓存;配置变更须nginx -s reload热重载并验证响应头。

Nginx 实现静态资源缓存的动态更新,核心不是“让旧缓存消失”,而是让浏览器主动放弃旧缓存、加载新内容,同时确保 Nginx 服务端不因配置或文件变更导致缓存混乱。关键靠三环联动:URL 可变性 + 缓存头精准控制 + 配置热生效。
用带哈希的文件名切断缓存依赖
浏览器只认 URL,不关心文件内容。只要 URL 不变,哪怕服务端文件已更新,强缓存仍可能返回旧副本。 所以构建阶段必须生成内容哈希文件名,例如: - `/static/js/app.js` → `/static/js/app.a1b2c3.js` - `/static/css/main.css` → `/static/css/main.d4e5f6.css`这样每次内容变更,URL 自动变化,浏览器视为全新资源,自然跳过旧缓存。
避免仅加查询参数(如 ?v=2),部分 CDN 或代理会忽略参数做合并缓存,导致更新失效。
配对设置长期缓存头,锁定新资源生命周期
对哈希化后的静态资源(`.js`、`.css`、`.png` 等),直接启用强缓存策略: - `expires 1y;` - `add_header Cache-Control "public, immutable";`immutable 是关键:它告诉浏览器该资源不会在有效期内变更,可跳过 If-None-Match 协商请求,提升加载速度。
而对未哈希的通用路径(如 /static/ 根目录),应设短缓存或禁用强缓存:
-
expires 1m; -
add_header Cache-Control "no-cache, must-revalidate";
防止模板或入口 HTML 引用旧哈希路径时,因根路径缓存过久导致降级失败。
Nginx 配置变更必须热重载,且验证生效
验证是否生效:
curl -I https://example.com/static/app.a1b2c3.js
查看响应头中 Cache-Control 和 Expires 是否符合预期。
补充:配合磁盘缓存提升服务端效率(可选)
若静态文件由 Nginx 直接 `root` 提供,本身不走 `proxy_cache`;但如需进一步降低磁盘 I/O(比如高并发小文件读取),可用“伪代理”方式启用磁盘缓存: - 在 `http` 块定义缓存区: ```nginx proxy_cache_path /var/cache/nginx/static_disk levels=1:2 keys_zone=static_disk:10m max_size=1g inactive=7d use_temp_path=off; ``` - 在 `location` 中用 `proxy_pass` 指向本地内部服务(如 `http://127.0.0.1:8080/_static/`),并在对应 location 启用 `proxy_cache static_disk`; - 注意:此时仍需保证文件 URL 带哈希,否则磁盘缓存更新后,浏览器仍可能命中旧 URL 的旧缓存。不复杂但容易忽略











