Angular 與 Nginx 和 docker-compose

Question

我正在嘗試與 Docker 一起運行，編寫一個有角度的應用程序。 這是我的 Angular 容器的 Dockerfile

# Stage 0, for downloading project’s npm dependencies, building and compiling the app.
FROM node:14.13 as node

# set working directory
RUN mkdir /usr/src/app
WORKDIR /usr/src/app

# add .bin to $PATH
ENV PATH /usr/src/app/node_modules/.bin:$PATH

# install package.json (o sea las dependencies)
COPY package.json /usr/src/app/package.json
RUN npm install
RUN npm install -g @angular/cli@10.0.3 

# add app
COPY . /usr/src/app

# start app
CMD npm build-prod

# Stage 1, for copying the compiled app from the previous step and making it ready for production with Nginx
FROM nginx:alpine
COPY --from=node /usr/src/app/dist/bloomingfrontend /usr/share/nginx/html/
COPY nginx.conf /etc/nginx/conf.d/default.conf

docker-compose 文件：

version: '3.3'

services:
  web: 
    build: './blooming_frontend'
    ports: 
      - 80:80
    depends_on:
      - spring
  spring:
    build: ./blooming_backend
    ports:
      - 8080:8080

和 nginx.conf

server {

    server_name localhost;
    listen      80;
    root        /usr/share/nginx/html;
    index       index.html index.htm;

    location / {

        try_files $uri $uri/ /index.html;

    }

}

正如我在一些教程中看到的那樣，它可以正常工作，但是在訪問 localhost 時拋出 localhost 頁面已拒絕連接。

我是 Nginx 的新手，我不知道我必須做什么

Answer 1

在您的 nginx 配置中， localhost匹配容器而不是主機（nginx 只接受來自容器本身的連接）。 刪除server_name行應該可以使其正常工作。