Question

我有一个ReactJS应用程序，我正在使用Kubernetes进行部署。

我正试图解决如何从Kubernetes部署文件中将环境变量注入我的config.js文件。

我目前有这些： config.js档案：

export const CLIENT_API_ENDPOINT = { 
    default:process.env.URL_TO_SERVICE,
};

这是我的Kubernetes部署变量：

"spec": {
  "containers": [
    {
      "name": "container_name",
      "image": "image_name",
      "env": [
        {
          "name": "URL_TO_SERVICE",
          "value": "https://www.myurl.com"
        }
      ]

有点无法解释为什么我在config.js文件中看不到环境变量。任何帮助都将受到高度赞赏。

这是我的dockerfile：

# Dockerfile (tag: v3)
FROM node:9.3.0
RUN npm install webpack -g
WORKDIR /tmp
COPY package.json /tmp/
RUN npm config set registry http://registry.npmjs.org/ && npm install
WORKDIR /usr/src/app
COPY . /usr/src/app/
RUN cp -a /tmp/node_modules /usr/src/app/
#RUN webpack
ENV NODE_ENV=production
ENV PORT=4000
#CMD [ "/usr/local/bin/node", "./index.js" ]
ENTRYPOINT npm start
EXPOSE 4000

Answer 1

kubernetes环境变量在容器中可用。因此，您认为此处的任务是将服务器端配置变量发送到客户端代码的版本。

但是，如果您的react应用程序在容器中运行，那么在构建docker镜像时，您很可能正在运行javascript构建管道。像这样：

RUN npm run build

# Run app using nodemon
CMD [ "npm", "start" ]

当docker正在构建容器时，kubernetes注入的环境变量尚不可用。在集群上运行构建的容器之前，它们将不存在。

一个解决方案，这可能是您的最短路径，是停止在docker文件中构建客户端代码，并在npm start命令中组合构建和运行步骤。如果你使用webpack，那就是这样：

"start": "webpack -p --progress --config webpack.production.config.js && node index.js"

如果您采用这种方式，那么您可以使用任何记录良好的技术在构建步骤中将服务器端环境变量传送到客户端：Passing environment-dependent variables in webpack。所有其他javascript构建工具都有类似的技术和工具。

二：如果您正在运行节点，则可以继续在容器中构建客户端应用程序，但让节点应用程序在节点应用程序启动时将config.js写入文件系统。

你可以做更复杂的事情，比如通过api暴露你的配置（第二种方法的变种），但这似乎是在糟糕的情况下抛出好钱。

我想知道是否有更简单的方法。如果您有一个纯粹的客户端应用程序，为什么不将它作为静态站点部署到亚马逊或gcloud存储桶，firebase或netlify？这样，您只需运行构建过程并部署到正确的环境。不需要容器。

使用Kubernetes向config.js注入变量

1 个答案: