如何将应用从8080端口切换到verus-ai.com域名访问？

核心问题分析 #

1. 浏览器访问域名时默认使用80（HTTP）或443（HTTPS）端口，你的应用当前仅监听8080端口，导致直接访问域名时因端口不匹配无法连接。
2. 前端硬编码http://localhost:8080/api，部署到EC2后，该地址会指向用户本地机器而非EC2服务器，外部用户无法正常调用API。
3. 前端请求头中设置的Access-Control-Allow-Origin无效，该响应头需由后端配置，前端无需添加。

具体调整方案 #

1. 后端端口适配（生产环境优化） #

无需完全移除8080，但需适配标准端口：

• 生产环境建议使用80（HTTP）或443（HTTPS）端口，避免用户手动输入端口。可以通过环境变量切换端口：

// 开发环境用8080，生产环境优先读取环境变量指定的端口（如80）
const PORT = process.env.PORT || 8080;
app.listen(PORT, () => {
  console.log(`Server is running on port ${PORT}.`);
});

• 在EC2启动后端时，执行sudo PORT=80 node your-server-file.js（1024以下端口需要sudo权限）。

2. 前端API地址修复（必须操作） #

删除硬编码的localhost:8080，改用环境变量区分开发/生产环境：

// 根据环境自动切换API地址，同时移除原baseURL末尾的空格
const baseURL = process.env.NODE_ENV === 'production'
  ? '/api' // 配合反向代理时直接用相对路径，或写完整域名'https://verus-ai.com/api'
  : 'http://localhost:8080/api';

export default axios.create({
  baseURL: baseURL,
  headers: {
    "Content-type": "application/json",
  }
});

3. 推荐：用Nginx做反向代理（专业生产方案） #

通过Nginx监听80/443端口，同时托管前端静态文件和转发API请求，无需修改后端端口：

server {
  listen 80;
  server_name verus-ai.com www.verus-ai.com;

  # 托管build后的前端静态文件
  location / {
    root /usr/share/nginx/html;
    try_files $uri $uri/ /index.html;
  }

  # 转发API请求到后端8080
  location /api {
    proxy_pass http://localhost:8080;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
  }
}

此方案下前端baseURL直接用/api即可，无需绑定具体域名，灵活性更高。

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