通过Kubernetes使Angular应用程序可用

我创建了一个角度应用程序的Docker图像

Dockerfile：

FROM node:alpine AS builder

WORKDIR /app

COPY . .

RUN npm install
RUN npm run build-prod

FROM nginx:alpine

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

buildprod

将执行

ng build--prod=true

然后将该映像推送到存储库，并在Kubernetes集群中的服务中使用

apiVersion: apps/v1
kind: Deployment
metadata:
  name: web-client-deployment
  labels:
    app: webclient
spec:
  replicas: 1
  selector:
    matchLabels:
        app: webclient
  template:
    metadata:
      labels:
        app: webclient
    spec:
      imagePullSecrets:
        - name: "azurecr-xxx"
      containers:
      - name: webclient
        image: xxx.azurecr.io/webclient:dev
        imagePullPolicy: Always
        ports:
        - containerPort: 80
---
apiVersion: v1
kind: Service
metadata:
  name: webclient
spec:
  type: ClusterIP
  ports:
  - port: 80
  selector:
    app: webclient

通过入口控制器提供

apiVersion: cert-manager.io/v1alpha2
kind: ClusterIssuer
metadata:
  name: letsencrypt
spec:
  acme:
    server: https://acme-v02.api.letsencrypt.org/directory
    email: xxx@xxx.xxx
    privateKeySecretRef:
      name: letsencrypt
    solvers:
      - http01:
          ingress:
            class: nginx

我遇到的问题是，我可以通过app.xxx.dev网址访问Angular应用程序（index.html、main.js、polyfills.js等），但Angular应用程序无法加载其他静态文件（例如资产/图像下的图像）。它将得到一个404

我做错了什么？如何访问Angular应用程序的静态文件？

我犯了两个错误：

Dockerfile中COPY命令中的星号将容器中的文件夹结构弄乱。正确的是

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

我需要将angular.json文件中的outputPath文件夹添加到重写目标注释中。正确的是

nginx.ingres.kubernetes.io/rewrite-target:/app spa/$1

---

尝试使用

ingres.kubernetes.io/add-base-url:“true”

和

nginx.ingres.kubernetes.io/use-regex:“true”

apiVersion: networking.k8s.io/v1beta1
kind: Ingress
metadata:
  name: app-ingress
  annotations:
    kubernetes.io/ingress.class: nginx
    cert-manager.io/cluster-issuer: letsencrypt
    nginx.ingress.kubernetes.io/rewrite-target: /$1
spec:
  tls:
    - hosts:
      - app.xxx.dev
      secretName: app-tls-secret
  rules:
    - host: app.xxx.dev
      http:
        paths:
          - path: /?(.*)
            backend:
              serviceName: webclient
              servicePort: 80