在 Nginx 中从 Angular 调用 API 无法解析 Docker 服务名称

Question

我有一个在容器Angular中运行的应用程序NginX Docker。

该Angular应用程序可以调用REST另一个容器（Spring BootAPI Docker）localhost作为服务器。

server: string = 'localhost';
return this.httpClient.post<MyClass[]>('http://' + this.server + ':6060/files-data/list-files', request);

但REST使用Docker服务名称时调用会失败。

server: string = 'files-service';
return this.httpClient.post<MyClass[]>('http://' + this.server + ':8080/files-data/list-files', request);

*这次使用8080端口来尝试解析docker服务名称

UI 控制台中出现错误：

net::ERR_NAME_NOT_RESOLVED

使用NginX带有 default 的默认图像nginx.conf。

  nginx-files-ui:
    image: nginx:latest
    container_name: nginx-files-ui
    volumes:
      - ./files-ui/dist/html:/usr/share/nginx/html
    ports:
      - 99:80

容器都在同一网络上运行Docker。

networks:
  default:
    external:
      name: files-net

修改nginx.conf为包括解析器但没有乐趣。

resolver 127.0.0.11 valid=30s;

知道为什么我无法REST使用Docker服务名称拨打电话吗？

编辑

浏览器中运行的 Angular 代码似乎无法解析服务名称。

Docker 组成的服务无法通过服务名称进行通信

Answer 1

我认为这是在 docker 容器内运行应用程序时非常常见的误解，特别是对于浏览器应用程序:)。

service name如果您的应用程序和 api 正在同一网络中运行并被访问，您只能在应用程序中调用 API 。在您的情况下，Angular 应用程序和您的后端在同一网络中运行，但 Angular 应用程序是从主机而不是容器内访问的。

详细信息：在当前上下文中，当您从浏览器访问 Angular 应用程序时，您是在主机、主机网络中使用 Angular 应用程序，而不是在容器内，您的 Angular 应用程序是通过将端口从容器映射到主机来公开的。因此，当您发出 API 请求时，它将来自主机 -> docker 容器，此时，主机将尝试service name在当前上下文中解析，当然从主机上没有service name

因此，对于所有浏览器应用程序，即使您使用 docker 容器部署它，但当您调用 API 时，大多数情况下您都必须使用localhost:<mapped_port>或解析为不在 docker 容器内的主机（例如：域名）。