用 proxy_pass 实现伪静态与后端路由同步的关键是透传原始 URI：带尾部斜杠的 proxy_pass（如 /）可替换 location 匹配部分，实现路径剥离；需配合 try_files、正确头信息传递及 ^~ 提升匹配优先级，确保前端路由由后端统一处理。
用 proxy_pass 实现伪静态与后端路由同步，核心不是让 Nginx 做路由判断，而是把前端“看起来像静态路径”的请求，原样、准确地透传给后端服务，由后端统一处理路由逻辑。关键在路径拼接和重写控制，避免 Nginx 意外截断或改写 URI。
确保 proxy_pass 不自动重写 URI
Nginx 的 proxy_pass 行为取决于写法：带 URI 后缀（如 proxy_pass http://backend/;）会替换 location 匹配部分；不带则原样转发。要同步前端伪静态路径，通常需保留原始 URI 结构。
- ✅ 正确（透传完整路径）：
location /app/ {<br> proxy_pass http://127.0.0.1:3000/;
访问/app/user/profile→ 后端收到/user/profile - ❌ 错误（意外截断）：
location /app/ {<br> proxy_pass http://127.0.0.1:3000;
访问/app/user/profile→ 后端收到/app/user/profile（多出/app前缀，易导致 404）
处理根路径与 history 模式（如 Vue Router）
单页应用常启用 HTML5 History 模式，前端路由无 #，依赖服务端兜底——所有非静态资源请求都应返回 index.html，再由前端 JS 解析路径。Nginx 需配合后端做两层判断：
- 先尝试匹配真实静态文件（js/css/img 等），命中则直接返回
- 未命中时，将请求代理给后端（如 Node.js 或 Go 服务），由其决定是否渲染页面或返回 404
- 示例配置片段：
location / {<br> try_files $uri $uri/ @backend;<br>}<br>location @backend {<br> proxy_pass http://127.0.0.1:3000;<br>}
传递原始 Host 和协议信息
后端若需生成绝对 URL（如邮件链接、API 响应中的回调地址），必须知道用户实际访问的域名和协议（HTTP/HTTPS）。Nginx 默认不转发这些头，需手动设置：
-
proxy_set_header Host $host;—— 保持原始 Host -
proxy_set_header X-Real-IP $remote_addr;—— 传递真实客户端 IP proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;-
proxy_set_header X-Forwarded-Proto $scheme;—— 让后端知道是 http 还是 https
避免 location 匹配干扰伪静态路径
多个 location 块可能因优先级覆盖预期行为。例如：
- 有
location ~ \.js$ { ... }和location /app/ { ... }，而请求是/app/main.js，正则 location 会优先生效，导致 JS 文件被静态返回，而非走代理 - 解决方法：用
^~前缀提升前缀匹配优先级，或调整顺序，确保伪静态路径的 location 覆盖更广 - 推荐写法：
location ^~ /app/ {<br> proxy_pass http://127.0.0.1:3000/;<br> proxy_set_header Host $host;<br>}
