TLDR - 在K8群集上托管1个React应用程序 . 托管两个不是因为两者都需要到 '/static' 的路径 . 无法使Ingress服务与Create React App构建限制很好地协作 .

Setup...

  • 创建React App v2

  • 头盔

  • 使用NGNIX GKE Kubernetes

Detail

未弹出时，Create React App构建过程输出 build 文件夹，其中包含存储在 build/static 子文件夹中的静态css和js块 .

Default Create React App Folder Structure

虽然您可以更改 build 文件夹的名称，但无法在不弹出的情况下更改 static 文件夹的名称 .

当我将应用程序部署到GKE上的K8群集并提供Ingress服务路径时，我的应用程序和静态文件夹一切都按预期完成 .

这个Ingress服务工作....

apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  annotations:
    certmanager.k8s.io/cluster-issuer: letsencrypt-prod
    kubernetes.io/ingress.class: nginx
  creationTimestamp: 2018-04-24T11:34:49Z
  generation: 7
  labels:
    app: redacted
    chart: redacted
    heritage: Tiller
    release: redacted
  name: redacted
  namespace: frontend
  resourceVersion: redacted
  selfLink: /apis/extensions/v1beta1/namespaces/frontend/ingresses/redacted
  uid: redacted
spec:
  rules:
  - host: redacted
    http:
      paths:
      - backend:
          serviceName: redacted
          servicePort: 80
        path: /crm
  - host: redacted
    http:
      paths:
      - backend:
          serviceName: redacted
          servicePort: 80
        path: /static
  tls:
  - hosts:
    - redacted
    secretName: redacted
status:
  loadBalancer:
    ingress:
    - ip: redacted

问题是当我在同一个集群上托管第二个React App时 . 由于两个应用程序都需要一条路径，因此NGINX要求最旧的规则得到尊重，因此只有一个应用程序能够加载所需的文件 .

所以...这里有两个问题

  • 为什么我需要首先明确提供 /static 路径 . 为什么Ingress服务无法使用 /crm 处的文件和子文件夹可访问该路径？

  • 如何代理/重写/执行任何操作以使 app2/static 中的文件通过Ingress服务公开？

我尝试过的事情

  • 弄清楚如何在CRA构建过程中重命名静态文件夹

  • crm/* ， crm/static/* ， app2/* ， app2/static/* 等的所有变体 . 通配符似乎与NGINX有很多问题

  • CRA homepage package.json参数 .

  • 该服务上的应用程序都没有 /static . （两者都不起作用） .

我很难过 . 任何一个应用程序在独立托管时工作正常当我达到谷歌能力的极限时，任何帮助都会受到高度赞赏 .

reactjs kubernetes create-react-app kubernetes-ingress nginx-ingress