nginx代理实现前端无感切换后端环境：一、基础反向代理通过upstream+手动修改proxy_pass支持dev/test/staging；二、url参数（如?env=test）动态路由；三、请求头（如x-backend-version）灰度分流；四、注意https验证、cookie重写及配置校验。
不用每次改代码、重启前端服务，就能快速切不同后端环境做测试——Nginx 代理是目前最轻量、最稳定的方案之一。核心思路是：把后端地址从前端代码里剥离，交由 Nginx 统一转发，通过修改配置或请求参数动态路由到目标服务。
一、基础反向代理 + 手动切换
适用于少量固定环境（如 dev / test / staging），操作简单、无需额外开发。
- 在
nginx.conf的http块中定义多个 upstream：
upstream backend_test { server 192.168.4.242:5001; }
upstream backend_staging { server 192.168.4.117:5001; }
- 在
server块中配置统一入口，例如：
- 切换时只需注释/取消注释对应行，执行
nginx -s reload即可生效，前端完全无感 - 注意保持
proxy_set_header完整，避免丢失原始 Host 或 IP 信息
二、URL 参数驱动的动态路由
适合多终端、多租户或多项目并行调试，一个入口支持任意后端实例，免配置重启。
- 利用 Nginx
map指令将请求参数映射为后端地址：
default http://192.168.4.102:5001;
dev http://192.168.4.102:5001;
test http://192.168.4.242:5001;
staging http://192.168.4.117:5001;
}
- 在 location 中使用该变量：
proxy_pass $backend_target;
proxy_set_header X-Backend-Env $arg_env;
}
- 前端请求时带上参数即可切换：
/api/users?env=test - 支持默认 fallback，参数缺失时自动走 default 地址
三、请求头识别 + 灰度分流
适合需要按用户、设备或内部标识定向打流量的场景，比如验证新旧接口兼容性。
- 用
map匹配自定义请求头（如X-Backend-Version）：
"" http://192.168.4.102:5001; # 默认
"v2" http://192.168.4.9:9072;
"canary" http://192.168.4.117:5001;
}
- 配合
proxy_pass $target_api使用，前端只需加 header：
- 便于与前端调试工具（如浏览器插件、Postman）配合，不侵入业务逻辑
- 可结合日志记录实际路由路径，方便问题回溯
四、注意事项与验证要点
- 跨域问题已消失：所有请求都走同源 Nginx，不再触发浏览器 CORS 限制
-
HTTPS 后端需启用
proxy_ssl_verify off（仅测试环境），否则自签名证书会拦截 -
确保后端响应头中的
Location、Set-Cookie.Domain正确重写，必要时用proxy_redirect和proxy_cookie_domain - 每次修改配置后务必运行
nginx -t校验语法，再nginx -s reload - 建议在 response header 中注入
X-Upstream-Addr，方便前端或抓包确认当前路由目标
