Angular 应用程序未从 docker-compose.yml 文件运行

Question

我为我的 angular 应用程序编写了以下 docker 文件。

Dockerfile:

# base image
FROM node:10.16.0-alpine AS build-step
# set working directory
WORKDIR /app
COPY package.json ./
RUN npm install
COPY . .
RUN npm run build
FROM nginx:1.16.1-alpine
COPY --from=build-step /app/dist/* /usr/share/nginx/html/
EXPOSE 4100
CMD ["nginx","-g","daemon off;"]

Docker 镜像创建成功。 在 docker-compose.yml 文件中我写了：

version: '3'
services:
  applicationui:
    image:  applicationui
    build: /
    network_mode: host
    container_name: angular-container
    ports:
      - 4200:4100 

执行 docker-compose 后，当我使用 localhost:4200 访问浏览器时，页面未打开。

运行 docker-compose 起来 任何线索我错过了？

Answer 1

您没有在 Dockerfile 中覆盖 Nginx 配置，因此端口的实际问题是 Nginx 默认监听PORT 80 。 所以改变暴露的端口。

EXPOSE 80

作为 Nginx 默认在端口80上侦听，而不是在端口4100上，例如 Angular ng serve 等，您期望从 Nginx 中获得。

所以最好使用 Expose 80 ，这将增加可读性，因为@David 提到如果你设置 network_mode: host 没有任何效果。

所以用80打开你的浏览器，它应该可以工作。

或者您可以绑定所需的端口，而无需提及 docker-compose 中的主机网络

    ports:
      - 4200:80 

http://localhost/

Answer 2

ports:如果设置network_mode: host则没有任何效果。 此设置经常被用作 Docker 网络问题的解决方法，在这里不需要。 只需删除该行。 （您也可以安全地删除container_name:和image:而不会产生不良影响。）