Nginx配置SPA路由需优先匹配静态资源，再匹配API路径，最后用try_files $uri $uri/ @backend兜底；location @backend中proxy_pass http://127.0.0.1:3000/并设置必要header，确保SSR或网关正确处理前端路由。
这不是反向代理的常规用法——单页应用（SPA）的前端路由本不该转发给后端，而应由 Nginx 本地兜底返回 index.html；只有明确属于后端 API 的请求（如 /api/、/v1/）才该走反向代理。若你确实需要把所有非静态资源的请求（包括 SPA 路由）都转发到后端，说明后端承担了前端路由服务（例如 SSR 或统一网关），这时配置关键在于：**让 Nginx 把“找不到文件”的请求全部代理过去，同时避免误转静态资源**。
明确区分静态资源与动态路由
前端构建产物（.js、.css、.png 等）必须优先被识别并直接返回，否则会触发不必要的代理，导致 404 或资源加载失败。Nginx 按 最长匹配 + 顺序优先级 执行 location，所以静态资源规则要放在代理规则之前：
- 用正则 location 匹配常见静态后缀，指定
root并加expires缓存 - 确保这些规则在
location /和location /api/之前定义 - 例如：
location ~*\.(js|css|json|woff2?|ttf|eot|svg|png|jpe?g|gif)$ { root /var/www/frontend/dist; }
配置 fallback 代理兜底所有未命中路径
当请求既不匹配静态资源，也不匹配 API 前缀时，就把它交给后端处理（比如 Node.js SSR 服务或统一网关）。这需要一个通用的 location / 块，但必须放在静态规则之后、API 规则之前（因 /api/ 更长，会自然优先匹配）：
-
location / { proxy_pass http://127.0.0.1:3000/; }—— 注意末尾斜杠，剥离根路径，使/user/profile变成/user/profile转发 - 务必添加必要 header：
proxy_set_header Host $host;、X-Real-IP、X-Forwarded-For、X-Forwarded-Proto - 如果后端是 SSR 且依赖原始 URI（比如渲染
/admin/dashboard），无需 rewrite，proxy_pass已自动携带完整路径
避免 index.html 被错误代理
默认 location / 若只写 proxy_pass，会把 / 请求也转发，导致首页无法加载静态资源。正确做法是：把 SPA 的入口逻辑交给 try_files + 代理组合实现：
立即学习“前端免费学习笔记（深入）”；
- 先尝试找真实文件：
$uri - 再找目录索引：
$uri/ - 最后 fallback 到后端：
@backend（命名 location） - 示例：
location / { root /var/www/frontend/dist; try_files $uri $uri/ @backend; } - 然后定义：
location @backend { proxy_pass http://127.0.0.1:3000/; ... }
检查并防止循环或冲突
这类配置容易引发 500、502 或无限重定向。需确认：
- 所有 location 都在同一
server块内，不能拆到不同 server 中 - 没有两个 location 匹配同一路径（如
/api/和/同时存在，但/api/因前缀更长会优先生效） - 后端服务已监听对应端口，且能正确响应
GET /、GET /about等纯路径请求 - 测试时用
curl -v http://localhost:8080/some-route查看响应头和状态码，确认是否真由后端返回
