Angular与Node.js应用部署至服务器后出现net::ERR_CONNECTION_REFUSED错误的技术咨询

这个问题我之前部署前后端分离项目时也踩过坑，核心原因是你在前端代码里写的http://localhost:3000/something在服务器环境下的逻辑和本地开发完全不同：

在本地开发时，前端（Angular）和后端（Node.js）都运行在你的本地电脑上，localhost指向你的机器，所以能正常连通。但部署到服务器后，前端代码是在用户的浏览器里执行的，这时候localhost指的是用户自己的电脑，而你的Node.js后端在远程服务器上，自然会出现连接拒绝的错误。

下面给你几种可行的解决方案：

1. 直接替换为服务器的公网IP或域名 #

把前端代码里的API地址从localhost:3000改成服务器的公网IP或者绑定的域名，比如：

• 如果服务器IP是123.45.67.89，API地址就改成http://123.45.67.89:3000/something
• 如果有域名your-app.com，就改成http://your-app.com:3000/something（注意如果后端端口不是默认的80/443，需要带上端口）

不过这种方式有两个小问题：一是端口暴露在外有安全风险，二是如果前后端域名/端口不同，可能会触发浏览器的跨域限制。

2. 配置Nginx反向代理（推荐方案） #

用Nginx做反向代理，把前端的API请求转发到后端的3000端口，这样前端可以用相对路径调用API，既安全又避免跨域问题。

举个简单的Nginx配置示例：

server {
    listen 80;
    server_name your-app.com; # 替换成你的域名或IP

    # 处理Angular静态文件请求
    location / {
        root /usr/share/nginx/html; # 替换成你的Angular打包后的dist目录路径
        try_files $uri $uri/ /index.html; # 支持Angular路由的刷新
    }

    # 反向代理所有/api开头的请求到Node.js后端
    location /api {
        proxy_pass http://localhost:3000; # 后端服务的地址（因为Nginx和Node.js在同一服务器，所以用localhost:3000）
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }
}

配置完成后，前端的API调用就可以写成相对路径/api/something，不用再写完整的IP和端口，部署环境切换时也不用修改代码。

3. 处理跨域问题（如果需要） #

如果暂时不想配置反向代理，或者前后端确实不在同一域名下，需要在Node.js后端开启CORS支持，允许前端所在域名的跨域请求。

可以用corsnpm包快速实现：

const express = require('express');
const cors = require('cors');
const app = express();

// 生产环境建议指定具体的origin，比如cors({ origin: 'http://your-app.com' })
app.use(cors()); 

// 你的API路由
app.get('/something', (req, res) => {
    res.json({ data: 'Hello from API' });
});

app.listen(3000, () => {
    console.log('Backend running on port 3000');
});

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