Nginx 中怎么将 Nginx 静态服务与后端反向代理配合-Nginx-PHP中文网

nginx同时提供静态文件服务和反向代理是前后端分离部署的标准做法，核心是用不同location规则分流请求：/api/等路径代理至后端，其余路径从本地目录读取静态文件并支持spa路由回退。

nginx 中怎么将 nginx 静态服务与后端反向代理配合

Nginx 同时提供静态文件服务和反向代理，是前后端分离部署的标准做法。核心在于用不同 location 规则分流请求：前端资源走本地磁盘，API 请求转发给后端服务。

明确区分两类请求路径
Nginx 不会自动判断该返回文件还是转发请求，必须靠 location 匹配规则显式定义。常见约定是：

所有 /api/、/prod-api/、/v1/ 等带前缀的路径 → 反向代理到后端
其他路径（如 /, /assets/, /static/）→ 尝试从本地目录读取静态文件

配置静态资源服务（含单页应用支持）

location / {
    root /var/www/frontend/dist;
    index index.html;
    try_files $uri $uri/ /index.html;
}

root 指定前端构建产物根目录
try_files 是关键：先找真实文件（$uri），再找目录（$uri/），最后 fallback 到 index.html，确保 Vue/React 路由刷新不 404

配置反向代理（注意斜杠细节）

Nginx Config Linter

对 Nginx 配置文件进行语法检查、验证和安全、性能审计。

下载

location /api/ {
    proxy_pass http://127.0.0.1:3000/;
    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_pass 末尾加 /：Nginx 会剥离 /api/，只把 /users 发给后端（后端路由无需带 /api）
不加 /：整个 /api/users 原样转发，后端需能处理带 /api 前缀的路径
proxy_set_header 确保后端拿到真实客户端 IP 和原始 Host

避免配置冲突的要点

不要把 location / 和 location /api/ 写在不同 server 块里，它们必须共存于同一 server 中才能按优先级匹配
location 匹配遵循“最长前缀匹配”，/api/ 比 / 更精确，所以 API 请求一定先被它捕获
静态资源路径若与 API 路径重叠（比如 /api.js），建议后端 API 使用统一前缀（如 /api/v1/），前端静态资源避免命名冲突