Nginx 502 Bad Gateway问题：React前端经Nginx请求Node.js后端失败

嘿，我仔细看了你的问题和提供的所有信息，发现了几个核心问题，咱们一步步来解决：

1. 最关键的问题：Node后端根本没在运行 #

从你的netstat输出里完全看不到Node.js进程监听5000端口的记录，这就是Nginx返回502的直接原因——它找不到要代理的后端服务！

先做这几步确认：

• 用命令检查Node进程：ps aux | grep node，如果没有任何和你的后端相关的进程，说明服务没启动
• 尝试手动启动后端，比如运行node server.js（替换成你的后端入口文件名），注意看控制台有没有报错——这里你肯定会看到报错，因为你的后端代码有问题！

2. 后端代码的致命错误：缺少cors模块引入 #

你的后端代码里写了app.use(cors());，但根本没引入cors模块，也没安装它，这会导致Node启动失败：

• 先安装cors依赖：npm install cors
• 在后端代码顶部添加引入：

const cors = require('cors'); // 新增这一行

修正后的后端开头代码：

const express = require('express');
const bodyParser = require('body-parser');
const path = require('path');
const cors = require('cors'); // 新增引入
const app = express();
const port = process.env.PORT || 5000;

app.use(cors());
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

3. 验证后端是否正常运行 #

启动后端后，用curl测试API是否可用：

curl http://127.0.0.1:5000/api/hello

如果返回{"express":"Hello From Express"}，说明后端已经正常运行了，再看netstat，应该会出现127.0.0.1:5000的LISTEN记录。

4. 调整Nginx配置的小细节 #

你的Nginx配置整体没问题，但可以优化一下代理头，让请求传递更准确：

server {
        listen 80 default_server;
        listen [::]:80 default_server;

        index index.html index.htm;
        server_name moneyserver;

        location / {
                root /home/matan/frontend/build;
                try_files $uri /index.html;
        }

        location /api {
                proxy_pass http://127.0.0.1:5000;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_set_header X-Real-IP $remote_addr; # 新增，传递真实IP
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; # 新增
                proxy_cache_bypass $http_upgrade;
        }
}

修改后重启Nginx：sudo systemctl restart nginx

5. 前端代码的小优化 #

前端fetch请求里的Access-Control-Allow-Origin是响应头，不是请求头，前端设置这个完全没用，删掉即可：

// 删掉这一行
'Access-Control-Allow-Origin': '*'

最后测试 #

现在启动后端、重启Nginx，再访问前端页面，应该就能正常调用/api/hello和/api/world接口了！

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