要让Nginx静态资源被CDN高效缓存,需同步三件事:Nginx输出含public、max-age和immutable的Cache-Control头;CDN后台按资源类型分级设置TTL并确保Cache Key包含Host与URI;前端构建自动将静态资源URL替换为CDN域名。

要让 Nginx 静态资源真正被 CDN 高效缓存,不能只靠“加个 expires”,关键在于三件事同步到位:Nginx 响应头明确告诉 CDN “能缓、多久、不可变”,CDN 自身按类型设好 TTL 规则,前端所有资源 URL 必须指向 CDN 域名。漏掉任一环,缓存就形同虚设。
1. Nginx 输出可信的缓存响应头
CDN 是否缓存、缓多久,主要看 Nginx 返回的 Cache-Control 头。推荐用 add_header 显式设置,比 expires 更精准:
- 对 JS/CSS/图片/字体等长期不变资源,设为:
add_header Cache-Control "public, max-age=31536000, immutable";
其中immutable表示内容不会更新,浏览器和 CDN 可跳过验证请求。 - 避免用
private或no-cache——这些指令会禁止 CDN 缓存,只适合含用户数据的 HTML 片段。 - 确保该 location 块未被更高优先级规则(如
location ^~ /static)覆盖;可用nginx -T检查最终生效配置。
2. CDN 控制台按类型分级设 TTL
即使 Nginx 发了 max-age=1y,CDN 仍可能按自身规则截断缓存时间。需在 CDN 后台主动配置:
- .js、.css、.woff2、.png 等带哈希版本号的资源:设 TTL = 30 天或更长(部分 CDN 支持“遵循源站”)
- .html 文件:必须设为短时效(如 10 分钟)或
TTL=0,防止页面更新不生效 - 确认 CDN 的缓存键(Cache Key)包含
Host和完整URI,避免不同子域名间缓存污染
3. 前端构建自动注入 CDN 域名
如果 HTML 里写的还是 /static/app.js,请求根本不会走到 CDN,而是直连 Nginx 源站。
- Webpack 项目:在
output.publicPath中填 CDN 域名,例如'https://static.example.com/' - Vite 项目:配置
base: 'https://static.example.com/' - 若用 Nginx 的
sub_filter动态替换,仅作兜底,不建议作为主方案(性能与可靠性受限)
4. (可选)Nginx 开启本地 proxy_cache 减少回源压力
当 CDN 节点未命中时,多个边缘节点可能同时回源,造成源站瞬时压力。可在 Nginx 加一层本地缓存:
- 在
http块中定义缓存区:proxy_cache_path /var/cache/nginx levels=1:2 keys_zone=cdn_cache:10m inactive=1d; - 在静态资源 location 中启用:
proxy_cache cdn_cache;<br>proxy_cache_valid 200 304 365d;<br>proxy_cache_use_stale error timeout updating;
- 注意:需关闭
proxy_buffering off或调大缓冲区,避免大文件缓存失败


















