Docker Compose部署前端无法通过服务名调用容器化API问题咨询

• 你写在前端代码里的请求地址，是运行在访问用户的本地浏览器中，而非sssfe容器内部。Docker Compose的服务名解析能力仅作用于Docker内部网桥下的所有容器，用户本地设备不在这个网络内，自然无法解析sssapi这个域名，也就没法发起请求。
• 你进入sssfe容器执行curl能成功，是因为curl命令的运行环境在Docker内部网络，可以正常解析服务名、访问对应容器的端口。

方案1：通过现有Nginx反向代理转发（最推荐） #

你已经部署了reverseproxy服务，可以直接通过它统一处理前端页面和API请求，无需额外暴露API端口到公网，也不存在跨域问题：

1. 修改前端代码的apiBase为相对路径：

const apiBase = "/api"

2. 调整reverseproxy的Nginx配置，新增/api前缀的转发规则，示例配置如下：

location /api {
    proxy_pass http://sssapi:80/;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

3. 修改docker-compose.yml中reverseproxy的配置，添加对sssapi的依赖，确保Nginx可以正常解析sssapi服务名：

reverseproxy:
  build:
    context: ./nginx
    dockerfile: Dockerfile
  ports:
    - 80:80
  depends_on:
    - sssfe
    - sssapi

方案2：直接使用公网地址调用（临时方案） #

直接把前端代码里的apiBase替换为你服务器的公网地址+API暴露的端口，也就是你测试可用的http://myurl.com:44384/api，这种方案需要确保44384端口对外放行，同时sssapi服务要配置CORS规则允许前端域名跨域访问，不适合生产环境使用。

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