在多容器设置中，使用 Docker-Compose 时无法从另一个容器调用服务

Question

我正在使用带有多容器设置的 docker compose。我有一个 Angular 应用程序，部署在 nginx 上并暴露于端口 80。在第二个容器上，我托管 .note 核心 API，该服务返回一个字符串。

在 Angular 中，我调用 URL http://localhost/api/values

看看我附加的 docker compose.yml 文件。使用我目前的设置，当我在本地浏览器中点击“http://localhost:81”时，我得到了想要的结果。

但是，在 Angular 应用程序 (http://localhost/api/values) 中，我想使用“webapi”(http://webapi/api/values)，而不是使用“localhost”，我尝试了各种选项，但没有得到想要的输出。到目前为止，我尝试使用主机名、容器名称、别名等

如果您能在这里指出我的错误并帮助我获得期望的输出，我将不胜感激。另外，如果您能建议最佳选择，以防我们在 .net 服务上运行多个实例，我将不胜感激。

解决此问题后，我计划将其部署在 Azure 上，是否需要任何其他设置/配置？

这是我的 yml 文件

提前致谢。

version: '3.7'

services:
  web:
    build: hello
    container_name: web
    hostname: web
    image: jayforu/hello
    networks:
      backend:
         #aliases: 
          #  - web
      #   ipv4_address: 172.16.238.01

    ports:
      - 81:80
  webapi:
    build: HelloApi
    container_name: webapi
    hostname: webapi
    image: jayforu/helloapi
    networks:
      backend:
         #aliases: 
          #  - webapi
        #ipv4_address: 172.16.238.02
    ports:
      - 80:80
networks:
  backend:
   # ipam:
      driver: bridge
    #  config:
     #   - subnet: "172.16.238.0/24"

Answer 1

根据 cmets，您必须执行以下操作才能使其正常工作

手动构建镜像并在 docker-compose 中指定本地构建的镜像（我认为这不是必需的，因为您在 docker-compose 中构建镜像）

# My docker compose installation doesn't support 3.7.
version: '3.6'

services:
  web:
    image: hello:latest
    networks:
      - backend
    ports:
        - 80:80
  webapi:
    image: helloapi2:latest
    networks:
      - backend
    ports:
      - 81:80
networks:
  backend:
      driver: bridge

我将 hello-worl.service.ts 中的 http.get 方法 url 和 port 更改为您的主机，在我的情况下，我使用的是虚拟机，因此我的容器部署在 http://192.168.99.100 和在 docker-compose 中为 webapi 服务指定的端口 81 上侦听，在您的情况下，如果它的 localhost 则将其更改为 http://localhost:81

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';

@Injectable({
    providedIn: 'root'
})
export class HelloWorldService {
    constructor(private http: HttpClient) {
    }
    messages: string[];
    executeHelloWorldService(): Observable<boolean> {
      return this.http.get<string[]>('http://http://192.168.99.100:81/api/values').pipe(
        map((data: string[]) => {
          this.messages = data;
          return true;
        }));
    }
}