如何在 React 中使用在 Google Cloud Run Dashboard 上声明的 ENV 变量

Posted 2023-02-19

【中文标题】如何在 React 中使用在 Google Cloud Run Dashboard 上声明的 ENV 变量

【英文标题】：How to use ENV Variables Declared on Google Cloud Run Dashboard in React

【发布时间】：2021-01-08 23:24:22

【问题描述】：

我正在使用 Dockerfile 将 create-react-app 服务部署到 Google Cloud Run 上，但我不想在 .env 文件中声明 env 变量，而是在 Google Cloud Run 的仪表板上声明它们，如下所示：

但是，当我使用调用 env var 时

console.log("REDIRECT", process.env.REACT_APP_REDIRECT_URI)

null 为我尝试引用的任何环境变量返回。是否还有其他步骤可以访问我缺少的这些变量？

这是我的 Dockerfile：

FROM node:10-alpine as react-build
WORKDIR /app
COPY . ./
RUN yarn
RUN yarn build

FROM nginx:alpine
COPY nginx.conf /etc/nginx/conf.d/configfile.template
ENV PORT 8080 
ENV HOST 0.0.0.0
RUN sh -c "envsubst '\$PORT'  < /etc/nginx/conf.d/configfile.template >      /etc/nginx/conf.d/default.conf"
COPY --from=react-build /app/build /usr/share/nginx/html
EXPOSE 8080
CMD ["nginx", "-g", "daemon off;"]

【问题讨论】：

您是将应用程序作为节点进程还是静态托管？

我相信作为一个节点进程？

你能添加你的 docker 文件吗？

刚刚添加了 Dockerfile。

您的process.env 中有什么内容吗？同样在您的图片中您没有设置任何值，这是隐藏值对吗？

【参考方案1】：

您的容器仅提供静态文件（通过 NGINX），并且在 Cloud Run 端不执行任何处理。

实际上，您将静态文件公开给用户。用户获取文件并将其加载到浏览器中。用户浏览器执行javascript，读取当前环境下的Env变量：用户浏览器。

因此，在此用例中未使用 Cloud Run 环境变量。您必须在 Cloud Run 上执行处理才能使用 Cloud Run 环境变量。

【讨论】：

您能否详细解释一下“Cloud Run 上的本地处理”是什么意思，或者向我指出一些关于此的资源。非常感谢您的回答！

好的，我删除了“本地”。实际上，env var 仅适用于 Cloud Run 进程。您应该有一个在 Cloud Run 上运行的执行以使用环境变量。如果您的代码在用户端（在浏览器中）运行，则不会填充环境变量