reactjs - 从 react 应用程序读取 kubernetes pod 的 configmap 中设置的环境变量？

Question

我有一个 react 应用程序，它读取几个 API 相关的环境变量。

在本地机器或 VM 上运行时，API 变量会正确读入应用程序。

当硬编码到 React 应用程序本身时，应用程序也会运行。

但是，使用 在 Kubernetes 中创建 pod图片 和一个 配置映射 不起作用 - 应用程序运行但未设置环境变量。

pod.yaml

...
 spec:
      containers:
      - command:
        - sleep
        - "3600"
        envFrom:
        - configMapRef:
            name: configmap
        image: xxxxx
        imagePullPolicy: IfNotPresent
...

配置映射

apiVersion: v1
data:
  API_HOST: xxxxxxx
  SOME_ID: abcdef
  NODE_ENV: development
  PROVIDER: GCP
kind: ConfigMap
metadata:
  creationTimestamp: xxxx
  name: configmap
  namespace: xxxx
  resourceVersion: xxxx
  selfLink: xxxx
  uid: xxxx

react 片段

    if(!process.env.SOME_ID) {
      console.log('ID')
    }

我的麻烦在于将环境变量传递给 React 应用程序。我确定 pod 中的环境变量设置正确，但看起来，客户端 React 应用程序没有这些变量(即 console.log 不打印任何内容)。

我偶然发现了这个 article用 Docker 做类似的事情。它提到转译替换了所有 process.env带有字符串值。用于缓解此 bash 脚本的技巧，该脚本创建 JavaScript 文件，其中环境变量被分配为全局窗口对象的属性。

虽然我不确定这在 Kubernetes 中是否可行，但我想知道有没有更简单的方法可以在运行时将 Kubernetes pod 的环境变量注入(inject)到 React 应用程序中？

Answer 1

它不像您期望的那样工作，因为 process.env变量在转译期间被替换。您无法在运行时访问它们。

您可以查看本指南以获取一种可能的解决方案:https://www.freecodecamp.org/news/how-to-implement-runtime-environment-variables-with-create-react-app-docker-and-nginx-7f9d42a91d70/ .但是关于您的问题，您的 Kubernetes 配置没有任何问题。