使用 angular 8 一切正常。使用 angular 16 部署后，assets 文件夹中的所有图像都会出现 403 错误。但在本地运行良好。我们使用的是 docker build 和 nginx

使用角度 8

• 一切正常。

角度 16

• 部署后，assets 文件夹内的所有图像都出现 403 错误。
• 但在本地运行良好。

我们使用 docker build 和 nginx 服务器进行部署。

用于访问图像的代码

<img src="assets/images/telematics/Ms_logo_white.png" alt="">

Docker 文件**

# base image
FROM node:16.14.0 as builder-side

# copy the package.json to install dependencies
COPY package.json package-lock.json ./

# Install the dependencies and make the folder
RUN npm install && mkdir /app && mv ./node_modules ./app

WORKDIR /app

COPY . .

# start app
RUN npm run build

FROM nginx:alpine

COPY ./nginx.conf /etc/nginx/nginx.conf

## Remove default nginx index page
RUN rm -rf /usr/share/nginx/html/*

COPY --from=builder-side /app/dist/ /usr/share/nginx/html

EXPOSE 4200

# Starting server.
CMD ["nginx", "-g", "daemon off;"]
#CMD ["npm", "start"] #gives 502 bad gateway

使用的 nginx 配置

worker_processes 1;

events { worker_connections 1024; }

http { 

    server {
        listen 4200;

        # server_name  localhost;
        root   /usr/share/nginx/html;
        include /etc/nginx/mime.types;
        server_tokens off;

        location / {
           
            index index.html index.htm;
            try_files $uri $uri/ /portal/index.html;
        }
        add_header X-Frame-Options "DENY";
        add_header Strict-Transport-Security "max-age=31536000; includeSubDomains" always;
        add_header X-Content-Type-Options nosniff;
        add_header Referrer-Policy same-origin;
        add_header Permissions-Policy geolocation=*;
        add_header X-Permitted-Cross-Domain-Policies master-only;

        gzip on;
        gzip_vary on;
        gzip_proxied expired no-cache no-store private auth;
        gzip_types text/plain text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript image/x-icon image/bmp image/svg+xml application/javascript;
    }

}

• 尝试提供图像的相对路径，但没有效果。