Angular+JWT项目部署Ionos服务器后遇net::ERR_CONNECTION_REFUSED求助

问题核心 #

前端代码硬编码了API请求地址为http://localhost:3300，但浏览器发起请求时，localhost指向的是用户本地机器而非Ionos服务器，因此出现连接拒绝错误。

具体解决步骤 #

1. 修正前端API地址配置

• 打开Angular项目的环境配置文件：
  • 开发环境：src/environments/environment.ts
  • 生产环境：src/environments/environment.prod.ts
• 将apiBaseUrl（或类似字段）从http://localhost:3300修改为服务器公网访问地址，比如https://server.ionos.com:3300；若后续用反向代理，可改为相对路径/api。
• 重新构建生产包：ng build --configuration=production，将新生成的dist文件夹重新上传到服务器子域名目录。

2. 开放服务器端口（若直接访问API端口）

• 登录Ionos PLESK面板，进入对应域名的「防火墙」设置，添加入站规则开放3300端口（TCP协议）。
• 注意：如果前端用HTTPS访问，直接请求HTTP的3300端口会触发混合内容拦截，需给API服务配置HTTPS证书，或改用反向代理方案。

3. 配置Express反向代理（推荐生产环境做法）

利用已运行在5500端口的app.js做反向代理，避免直接暴露API端口，同时解决跨域问题：

• 安装代理依赖：npm install http-proxy-middleware
• 在app.js中添加代理配置：

  const express = require('express');
  const { createProxyMiddleware } = require('http-proxy-middleware');
  const app = express();
  
  // 静态托管Angular dist文件（如果app.js负责托管前端）
  app.use(express.static('dist/your-angular-project-name'));
  
  // 代理API请求到3300端口的server.js
  app.use('/articles', createProxyMiddleware({
    target: 'http://localhost:3300',
    changeOrigin: true
  }));
  
  app.listen(5500, () => {
    console.log('Server started on port 5500');
  });
  

• 重启app.js服务，此时前端API请求可改为相对路径/articles，无需指定端口。

4. 确保服务后台持续运行

当前用node app.js和node server.js是前台运行，关闭SSH后服务会终止，需用进程管理器托管：

• 安装pm2：npm install -g pm2
• 启动服务：

  pm2 start app.js --name "angular-server"
  pm2 start server.js --name "api-server"
  

• 查看服务状态：pm2 status
• 设置开机自启：pm2 startup，按提示执行生成的命令。

内容的提问来源于stack exchange，提问作者Michael J.