我无法从我的 REACT 应用程序中读取 azure 应用程序服务配置中的环境变量

Posted

技术标签:

【中文标题】我无法从我的 REACT 应用程序中读取 azure 应用程序服务配置中的环境变量【英文标题】:I am unable to read environment variable from azure app service configuration from my REACT app 【发布时间】:2021-08-07 02:58:49 【问题描述】:

我已在 azure 应用服务配置中添加了我的变量,并尝试从我的 React 项目中读取它,但我每次都未定义。

Azure 应用服务:-

https://i.stack.imgur.com/NextN.png

反应代码:- console.log("PreviewMode>>" + process.env.REACT_APP_PREVIEWMODE)

【问题讨论】:

Azure 应用服务配置存在于 服务器端,而您的 React 应用包含在 浏览器 中执行的静态 javascript 文件。只有 Node.js 后端可以访问环境变量,浏览器中没有。 【参考方案1】:

您无法在 azure 应用服务配置中获取 appsettings。

React 客户端项目本质上是下载一段代码在客户端浏览器上运行,不会与 azure 应用程序设置相关。所以它的 process.env 无法读取任何 azure 环境变量。

但是你可以在你的项目中创建.env 文件。然后您可以通过process.env.REACT_APP_PREVIEWMODE 获取环境变量。 (我在windows平台下测试过。)

更多详情,请阅读以下帖子中的答案。

1. 404 Error when trying to fetch json file from public folder in deployed create-react-app

2. Azure WebApps React: the environment variables exist but are not present when I call process.env

【讨论】:

以上是关于我无法从我的 REACT 应用程序中读取 azure 应用程序服务配置中的环境变量的主要内容,如果未能解决你的问题,请参考以下文章

Azure 移动应用程序:无法从我的 nodeJS 后端发送推送通知

如何使用 React 从 mongoose 读取 api

为啥我的应用程序无法从我的 API 读取 JSON?

React / Redux - 无法读取未定义的属性“XXX”

无法将 React 应用(构建)文件夹部署到应用服务 Azure

无法从我的网络服务器读取本地服务器上的 json 文件