你是不是也遇到过这种情况:
静态资源没变,每次用户访问却都要重新加载,服务器压力大,页面还慢。
其实 Nginx 自带一套很顺手的缓存机制。
今天这篇直接给你动静分离 + 缓存配置模板,复制就能用。
看完你会得到:
-
一套可直接上线的缓存配置
-
静态资源命中率明显提升
-
服务器负载肉眼可见下降
一、先搞清楚一个概念:动静分离
动 → 动态请求(PHP、Java、API)
静 → 静态资源(图片、CSS、JS、字体、HTML)
动静分离 = 把静态请求交给 Nginx 直接返回,不转给后端。
这里有个坑:很多人把图片也走后端应用服务器,白白浪费 CPU。
二、最简单的动静分离配置
直接上配置,放在 server {} 里:
# 静态资源直接由 Nginx 处理
location ~* \.(jpg|png|gif|ico|css|js|svg|woff|woff2|ttf|eot)$ {
root /var/www/static;
expires 30d;
add_header Cache-Control "public, immutable";
}
# 动态请求转发到后端
location / {
proxy_pass http://backend_servers;
}
解释一下:
-
expires 30d→ 告诉浏览器缓存 30 天 -
immutable→ 文件不变,不用反复确认 -
动态请求走
proxy_pass
三、再加一层 Nginx 本地缓存(更强)
如果你希望连后端请求都能缓存 (比如接口数据、HTML),用 proxy_cache。
三步配置:
1. 在 http {} 里定义缓存区
proxy_cache_path /var/cache/nginx levels=1:2 keys_zone=my_cache:10m max_size=1g inactive=60m use_temp_path=off;
2. 在 server {} 或 location {} 里启用
location / {
proxy_cache my_cache;
proxy_cache_key "$scheme$request_method$host$request_uri";
proxy_cache_valid 200 302 60m;
proxy_cache_valid 404 1m;
proxy_cache_use_stale error timeout updating;
proxy_pass http://backend_servers;
}
3. 加个缓存命中标识(方便测试)
add_header X-Cache-Status $upstream_cache_status;
返回结果:
-
HIT→ 命中缓存 ✅ -
MISS→ 未命中 -
BYPASS→ 绕过
四、动静分离 + 本地缓存,完整模板
http {
proxy_cache_path /var/cache/nginx levels=1:2 keys_zone=static_cache:10m max_size=2g inactive=30d use_temp_path=off;
server {
listen 80;
server_name example.com;
# 静态资源:走本地缓存
location ~* \.(css|js|jpg|png|gif|ico|svg|woff|woff2|ttf|eot)$ {
root /var/www/static;
expires 30d;
add_header Cache-Control "public, immutable";
add_header X-Resource-Type "static";
}
# 动态请求:走 proxy_cache
location / {
proxy_cache static_cache;
proxy_cache_key "$host$request_uri";
proxy_cache_valid 200 302 60m;
proxy_cache_use_stale error timeout updating;
add_header X-Cache-Status $upstream_cache_status;
proxy_pass http://backend_servers;
}
}
}
五、几个你可能踩到的坑
| 坑 | 正确做法 |
|---|---|
| 缓存区目录没权限 | chown -R www-data /var/cache/nginx |
| 动态请求不该缓存但缓存了 | 用 proxy_cache_bypass 或按 cookie 跳过 |
| 用户看不到最新静态资源 | 加版本号:style.css?v=20260411 |
| 缓存空间填满 | 设置 max_size 并配 inactive 自动清理 |
六、一句话总结
动静分离 + proxy_cache = 又快又稳。
-
静态资源:Nginx 直接吐,浏览器长期缓存
-
动态请求:Nginx 本地缓存,减少后端压力
-
一套配置,复制就能跑