AWS部署Express+React应用时/data路由请求超时问题

核心问题分析 #

站点可正常显示说明静态资源服务与根路由工作正常，但/data路由请求超时，且简化路由返回仍超时，可排除数据库逻辑问题，重点排查网络配置、请求路径、服务监听逻辑这几个方向。

逐步排查与解决方案 #

1. 修正React请求路径（最易忽略） #

你的React代码中fetch(${baseURL})请求的是根路径，而非/data路由，这会导致请求返回HTML页面而非接口数据，若前端尝试解析HTML为JSON会出错，也可能因后续处理逻辑阻塞表现为超时。

修改请求代码：

const[incomes, setIncomes] = useState([]); 
useEffect(() => {
  fetch(`${baseURL}/data`) // 补充/data路径
    .then((res) => {
      if (!res.ok) throw new Error('请求失败');
      return res.json();
    })
    .then((data) => setIncomes(data))
    .catch(err => console.error('请求错误:', err)); // 增加错误捕获便于排查
}, []);

2. 验证AWS网络与安全组配置 #

AWS服务的端口访问权限是常见坑点：

• EC2实例：检查安全组入站规则，确保允许服务监听端口（或80/443端口）的HTTP/HTTPS流量，来源可临时设为0.0.0.0/0测试（生产环境需缩小访问范围）。
• Elastic Beanstalk/ECS：这类服务会自动分配端口，确保代码监听process.env.PORT（你的代码已实现），无需手动指定固定端口；同时检查负载均衡的目标组配置，确保健康检查路径（如/data或/）返回200状态码，否则负载均衡会拒绝转发流量。

3. 本地实例内部测试服务可用性 #

登录AWS实例（EC2用SSH，Beanstalk用EB CLI或控制台日志），直接在实例内部发起请求：

curl http://localhost:${PORT}/data

• 若请求成功返回响应：说明服务本身正常，问题出在外部网络路由或安全组配置。
• 若请求仍超时：检查服务是否正常运行，查看服务日志：
  • PM2管理的服务：pm2 logs
  • Systemd服务：journalctl -u your-service-name
  • 控制台输出：确认Server running on port XXXX日志是否出现，端口是否与预期一致。

4. 简化服务逻辑排查阻塞问题 #

将/data路由改为极简响应，排除任何潜在的代码阻塞：

app.get('/data', (req, res) => {
  res.status(200).json({ status: 'ok', message: 'test response' });
});

重新部署后再次测试：

• 若仍超时：说明服务监听逻辑或端口配置有问题，可添加console.log('PORT:', process.env.PORT)验证环境变量是否正确设置；若为undefined，可临时改为固定端口（如3000）并同步开放安全组对应端口测试。
• 若请求成功：说明原路由的数据库连接逻辑可能存在隐藏阻塞（尽管排除了数据库，但连接池或初始化逻辑可能阻塞事件循环），可改用mysql2/promise的异步连接方式避免阻塞。

5. 检查静态资源路由冲突 #

确认public目录下不存在data文件夹或data.html等文件，因为express.static会优先匹配静态资源，若存在同名资源会覆盖路由，导致请求返回静态文件而非接口响应。

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