AWS EC2 Windows实例同端口部署前后端及单路由文件配置问询

当然可以实现！我们可以通过反向代理的方式，用一个Node.js服务作为中间层监听80端口，同时处理前端静态资源请求和后端API的转发。这样用户访问www.example.com就能加载前端页面，访问www.example.com/backend/就能对应到原来运行在5000端口的后端服务，完全不需要暴露客户端端口。下面是具体的实现步骤和代码示例：

具体实现步骤 #

1. 准备工作 #

首先确保你的EC2 Windows实例上已经安装了Node.js和npm。如果还没安装，可以直接从Node.js官方下载安装包完成部署。

2. 安装依赖 #

在项目目录下打开命令提示符，安装两个核心依赖：

npm install express http-proxy-middleware

3. 编写server.js配置文件 #

创建一个server.js文件，内容如下（每部分都加了注释说明作用）：

const express = require('express');
const { createProxyMiddleware } = require('http-proxy-middleware');
const path = require('path');

const app = express();

// 1. 托管前端静态文件：假设你前端打包后的文件放在当前目录的`dist`文件夹下
// 如果你的前端文件路径不同，修改`path.join(__dirname, 'dist')`中的`dist`为实际路径
app.use(express.static(path.join(__dirname, 'dist')));

// 2. 配置反向代理：将所有以/backend开头的请求转发到后端的5000端口
app.use('/backend', createProxyMiddleware({
  target: 'http://localhost:5000', // 后端服务的本地地址
  changeOrigin: true, // 确保后端能正确识别请求来源
  pathRewrite: {
    '^/backend': '' // 转发时去掉路径中的/backend前缀，比如/backend/api/user会变成http://localhost:5000/api/user
  }
}));

// 3. 处理前端SPA路由（可选）：如果你的前端是React/Vue等单页应用，必须配置这一步
// 当用户直接访问前端路由路径（比如www.example.com/about）时，返回index.html让前端路由处理
app.get('*', (req, res) => {
  res.sendFile(path.join(__dirname, 'dist', 'index.html'));
});

// 4. 监听80端口
const PORT = 80;
app.listen(PORT, () => {
  console.log(`代理服务已启动，监听端口${PORT}`);
});

4. 调整前端配置 #

修改前端项目的API请求地址：原来的www.example.com:5000/api/xxx需要改成/backend/api/xxx，这样请求会被代理服务自动转发到后端的5000端口。

5. 启动服务并保持运行 #

• 临时启动：在命令提示符中运行node server.js，但关闭窗口后服务会停止。
• 后台运行（推荐）：使用pm2工具管理进程，实现后台运行和开机自启：
  1. 安装pm2：npm install -g pm2
  2. 启动服务：pm2 start server.js
  3. 设置开机自启：pm2 startup windows，按照提示完成系统配置

6. 验证配置 #

• 访问www.example.com：应该能正常加载前端页面
• 访问www.example.com/backend/xxx：应该能获取到后端的响应，和原来访问www.example.com:5000/xxx效果一致

注意事项 #

• 确保EC2安全组已经开放80端口的入站流量
• 检查Windows防火墙是否允许80端口的网络请求
• 如果后端服务不是运行在localhost:5000，修改target字段为实际的后端地址
• 前端打包时要确保静态资源路径正确，避免出现404问题

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