Nginx反向代理到Angular Docker容器缺少静态资源文件

juzqafwq 于 2022-11-02 发布在 Docker

关注(0)|答案(1)|浏览(151)

我有Nginx服务器在机器上运行，我设置反向代理到在localhost：4200上运行的angular docker应用程序。重新路由工作得很好，但angular应用程序不能加载静态资产。贝娄是我的conf.d文件的一部分。如果我使用位置到根（/）一切都工作得很好，看起来像我遗漏了什么：（。
`

location /auth {

      proxy_set_header        Host $host;
      proxy_set_header        X-Real-IP $remote_addr;
      proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header        X-Forwarded-Proto $scheme;

      proxy_pass          http://localhost:4200/;
      proxy_read_timeout  90;

        }

`
我尝试在angular应用程序中将basehref设置为/auth，但没有效果。

docker

来源：https://stackoverflow.com/questions/74259697/nginx-reverse-proxy-to-angular-docker-container-missing-static-asset-files

1条答案

按热度按时间

efzxgjgh1#

您不需要Angular 容器来反转流量，您可以使用Dockerfile中的多阶段选项来编译Angular 项目，并将dist文件复制到nginx容器中。

停靠文件

FROM node:14.15.1 AS build

RUN apt-get update && apt-get install -y ca-certificates

# Google Chrome

RUN wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | 
apt-key add - && \
echo "deb http://dl.google.com/linux/chrome/deb/ stable main" > 
/etc/apt/sources.list.d/google.list && \
apt-get update && \
apt-get install -y google-chrome-stable xvfb

# Define the working directory of a Docker container

WORKDIR /usr/src/app

# Copy package.json file in to working directory

COPY package.json ./

# Install dependency library from package.json

RUN npm install

# Copy project from local directory to working directory

COPY . .

# Default build configuration.

ARG CONFIGURATION=staging

# Run application with staging environment

RUN npm run build:$CONFIGURATION

FROM nginx:latest

# Remove default nginx file

RUN rm -rf /usr/share/nginx/html/*

# Copy nginx config file

COPY /nginx.conf /etc/nginx/conf.d/default.conf

# Copy compiled project files in to nginx path container

COPY --from=build /usr/src/app/dist/* /usr/share/nginx/html

EXPOSE 4200

您应该将blow配置添加到nginx容器中。

nginx.conf

server {
    listen       4200;
    server_name  example.com;

    location / {
        root   /usr/share/nginx/html;
        try_files $uri $uri/ /index.html;
        index  index.html;
    }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }

}

赞(0）回复(0）举报 2022-11-02

我来回答

Nginx反向代理到Angular Docker容器缺少静态资源文件

1条答案

相关问题

热门标签

最新问答