nginx 部署 next.js 时应优先用 location ^~ /_next/static/ 直接服务静态资源,避免回退 node.js;再配正则匹配其他静态文件,最后 location / 代理剩余请求。

用 Nginx 部署 Next.js 应用时,静态资源(如 _next/static 下的 JS、CSS、图片)若未被 Nginx 优先直接服务,就会回退到 Next.js 的 Node.js 服务处理,造成额外开销和延迟。关键在于利用 location 指令的匹配优先级,让 Nginx 在请求到达后第一时间命中静态路径,跳过代理逻辑。
明确 Next.js 静态资源路径特征
Next.js 构建后会在 .next/static 目录生成哈希化资源,生产环境通过 /_next/static/ 路径对外提供。例如:
/_next/static/chunks/main-abc123.js/_next/static/css/987def.css/_next/static/media/logo-456ghi.png
这些路径固定且无服务端逻辑,完全可由 Nginx 零延迟响应。
按优先级顺序配置 location 块
Nginx 的 location 匹配遵循“最长前缀匹配”和“精确/正则优先级规则”。需按如下顺序书写(顺序不能颠倒):
-
精确匹配:
location = /_next/static/—— 不常用,但可拦截空路径请求 -
前缀匹配(推荐):
location ^~ /_next/static/—— 阻止后续正则检查,高效且安全 -
正则匹配(可选):
location ~* \.(js|css|png|jpg|jpeg|gif|webp|woff2?|ttf|eot|svg)$—— 补充非/_next下的其他静态文件(如/favicon.ico) -
通用代理:
location /—— 所有未被前面规则捕获的请求,才转发给 Next.js 后端(如https://www.php.cn/link/8e5687e2d6ab87e5da2f833f3e8986a4)
注意:^~ 是关键——它确保以 /_next/static/ 开头的请求立即由 Nginx 处理,不进入正则分支,避免性能损耗和意外覆盖。
完整静态资源服务配置示例
假设 Next.js 构建输出在 /var/www/my-app/.next,Nginx 配置片段如下:
location ^~ /_next/static/ {
alias /var/www/my-app/.next/static/;
expires 1y;
add_header Cache-Control "public, immutable";
}
<p>location ~* .(js|css|png|jpg|jpeg|gif|webp|woff2?|ttf|eot|svg)$ {
root /var/www/my-app;
expires 1y;
add_header Cache-Control "public, immutable";
}</p><p>location / {
proxy_pass <a href="https://www.php.cn/link/8e5687e2d6ab87e5da2f833f3e8986a4">https://www.php.cn/link/8e5687e2d6ab87e5da2f833f3e8986a4</a>;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}</p>
说明:alias 用于 ^~ 前缀匹配(末尾斜杠必须一致),root 更适合正则匹配;expires 和 Cache-Control 强制强缓存,减少重复请求。
验证与常见陷阱
部署后可通过 curl 或浏览器开发者工具检查响应头:
- 访问
https://yoursite.com/_next/static/chunks/app-xyz.js,应返回200且Server: nginx,无X-Powered-By: Next.js - 若返回
200但含X-Powered-By,说明请求仍被代理,检查location ^~是否拼写错误、是否被包裹在其他location内、或顺序是否靠后 - 避免使用
location /_next/static/(无修饰符)——它属于普通前缀匹配,优先级低于正则,可能被后续location ~*截胡
不复杂但容易忽略。











