使用公网IP访问Azure VM内web应用时SpringBoot后端连接失败

问题根因 #

你遇到的问题核心是React代码运行在访问者的本地浏览器，而非Azure VM上：

• 你通过RDP在VM内部访问时，浏览器的localhost指向VM本身，所以可以正常调用后端服务
• 你在外网用个人设备访问时，React代码被下载到本地运行，代码里写死的http://localhost:8081会尝试访问你个人设备的8081端口，自然找不到VM上的后端服务

修复步骤 #

1. 修改React API调用地址 #

把React代码里所有后端API调用的基地址从http://localhost:8081替换为http://<你的Azure VM公网IP>:8081，修改完成后重新构建React镜像，重新部署到VM上。

2. 放行8081端口访问权限 #

需要同时配置两处放行规则：

• Azure VM关联的网络安全组(NSG)添加入站规则：允许TCP协议、目标端口8081、来源为0.0.0.0/0（可根据需求缩小来源范围）的入站请求
• VM内部的操作系统防火墙也要放行8081端口：Linux环境可通过ufw allow 8081或firewall-cmd --add-port=8081/tcp --permanent配置；Windows环境可在Defender防火墙中添加入站规则

3. 确认SpringBoot监听配置 #

确保SpringBoot服务监听的是0.0.0.0:8081而非127.0.0.1:8081：

• 可在SpringBoot配置文件中添加配置server.address=0.0.0.0
• 若用Docker启动SpringBoot容器，启动命令的端口映射参数要写为-p 0.0.0.0:8081:8081，避免默认绑定到本地回环地址

4. 验证连通性 #

先在个人设备的浏览器直接访问http://<VM公网IP>:8081/（可替换为你后端的健康检查接口），确认可以正常拿到返回结果后，再访问前端页面验证功能是否正常。

可选优化方案（更安全） #

如果不想对外暴露8081端口，可以在部署React的Nginx服务中添加反向代理规则，所有/api前缀的请求自动转发到VM本地的127.0.0.1:8081，全程只需要对外放行80端口即可，还能避免跨域配置问题。

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