使用Nginx Docker代理React调用Spring Boot后端时出现400错误求助

核心问题 #

从访问日志里的upstream: "http:///user_service/api/getuserroles"能直接看出——你的Nginx反向代理配置中，proxy_pass的目标地址未正确配置，导致Nginx无法定位后端服务，进而触发连接提前关闭和400错误。另外，直接用npm启动前端可正常调用接口，说明后端服务本身无问题，问题集中在Nginx配置和网络层面。

关键配置修复 #

1. 修正proxy_pass目标地址 #

• 如果后端服务与Nginx容器在同一个Docker网络：使用后端容器的服务名（例如spring-cloud-gateway）或内部IP，必须添加末尾斜杠避免路径拼接出错：

location / {
    proxy_pass http://spring-cloud-gateway:8080/;
}

• 如果后端服务部署在宿主机器：Docker环境下不要用localhost，Windows/macOS系统可替换为host.docker.internal，Linux系统使用宿主机器的局域网IP，同样需添加末尾斜杠。

2. 添加反向代理必备请求头 #

Spring Boot（尤其是Spring Cloud Gateway）依赖特定请求头识别合法请求，将以下配置加入location /块中：

location / {
    proxy_pass http://<后端服务地址>/;
    # 传递客户端真实信息给后端
    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;
    # 延长超时时间，避免后端响应慢导致连接中断
    proxy_connect_timeout 60s;
    proxy_send_timeout 60s;
    proxy_read_timeout 60s;
    # 支持WebSocket（若你的应用用到）
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
}

3. 修复前端静态资源路由 #

React属于单页应用，当前location /eprimo配置会导致页面刷新时出现404，修改为：

location /eprimo {
    root /usr/share/nginx/html;
    index index.html index.htm;
    try_files $uri $uri/ /eprimo/index.html;
}

4. 检查Docker网络配置 #

• 确保Nginx容器与后端容器处于同一个Docker网络，启动Nginx容器时通过--network参数加入后端所在网络：

docker run -d --name nginx-frontend --network your-backend-network -p 80:80 -v /local/path/nginx.conf:/etc/nginx/nginx.conf nginx

额外排查方向 #

• 查看Spring Cloud Gateway的日志，确认请求是否到达网关，以及返回400错误的具体原因（例如请求头缺失、路径匹配失败）
• 检查后端服务的跨域配置，虽然Nginx代理后跨域问题应由Nginx处理，但网关的严格限制仍可能触发错误
• 确认Nginx容器的端口映射与前端访问的端口一致（日志中显示访问端口为3000，需确保Nginx容器映射的是3000端口）

内容的提问来源于stack exchange，提问作者Ajay Bisht