Docker容器间HTTP通信失败问题排查求助

核心问题分析 #

你一开始的误区是混淆了容器内请求和浏览器端请求的发起方：Angular是单页应用（SPA），代码是在用户的浏览器中执行的，而非前端容器内部。所以当你在Angular里配置http://api:8080/employee时，这个请求是从用户本地浏览器发出去的——而浏览器所在的本地网络根本不知道Docker自定义网络里的api服务名，自然会返回未知错误。

后来你尝试用Nginx反向代理，但漏了关键一步：没有把容器的8081端口映射到宿主机，导致浏览器访问localhost:8081无法到达前端容器内的Nginx服务。

最优解决方案：通过Nginx反向代理实现同源请求 #

推荐用同域名反向代理的方式，既避免跨域问题，又能利用Docker容器间的服务名通信。具体步骤如下：

1. 修改Angular的API地址为相对路径
   把ENDPOINT_BASE改成和前端页面同源的相对路径，这样请求会自动发送到当前前端的域名：

   private ENDPOINT_BASE: string = "/api/employee";
   

2. 更新Nginx配置，添加API转发规则
   在你的nginx.conf的80端口server块中，新增一个location /api的规则，把所有以/api开头的请求转发到API容器：

   server {
       listen 80;
       server_name localhost;
       root /usr/share/nginx/html;
   
       location / {
           index index.html index.htm;
           try_files $uri $uri/ /index.html;
       }
   
       # 新增API转发规则
       location /api/ {
           proxy_pass http://api:8080/;
           proxy_set_header Host $host;
           proxy_set_header X-Real-IP $remote_addr;
           proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
       }
   }
   

   这里的http://api:8080/是Docker容器间的通信地址，因为两个容器在同一个app网络里，所以可以直接用服务名api访问。

3. 简化docker-compose配置
   不需要暴露8081端口，也不需要单独的8081 server块，保持webapp的ports只映射80和443即可：

   version: '3'
   services:
     webapp:
       image: com.midamcorp/emp_front:latest
       ports:
         - 80:80
         - 443:443
       networks:
         - app
       depends_on:
         - api
     api:
       image: com.midamcorp/employee_search:latest
       networks:
         - app
       # 可选：添加健康检查，确保API服务就绪后再启动前端
       healthcheck:
         test: ["CMD", "curl", "-f", "http://localhost:8080/employee"]
         interval: 30s
         timeout: 10s
         retries: 3
   networks:
     app:
   

验证步骤 #

1. 重新构建前端镜像（确保新的nginx.conf和Angular代码被打包进去）
2. 用docker-compose up -d启动服务
3. 访问http://localhost，测试API请求是否正常

额外排查点 #

• 如果仍然失败，先进入前端容器验证容器间通信：

  docker exec -it employee_service_webapp_1 sh
  # 先ping api，确认网络连通
  ping api
  # 再curl API地址，确认服务正常
  curl http://api:8080/employee
  

  如果这两步都正常，说明问题出在前端代码或Nginx转发规则；如果curl失败，检查API服务是否正常启动，端口是否正确监听。

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