Javascript React JS-从外部属性文件读取环境配置_Javascript_Reactjs_Environment Variables_Property Files

Javascript React JS-从外部属性文件读取环境配置

javascript reactjs

Javascript React JS-从外部属性文件读取环境配置,javascript,reactjs,environment-variables,property-files,Javascript,Reactjs,Environment Variables,Property Files,问题: 我不熟悉React JS，正在寻找从外部属性文件读取环境配置的选项。这个问题对于我的一个客户来说更为具体，他希望能够选择动态更改环境文件。例如，每当发生更改时，动态更改主机名/端口。生成过程不属于我的客户。我创建了一个缩小的最终包，我的客户机将其部署在tomcat/web服务器上尝试过的解决方案：通过一些读取，我已经为不同的环境配置了.env文件，并且能够成功地从这些文件中读取配置。但是，这些文件更多的是构建过程环境文件。而且，我正在试图找到一种在创建包后从外部源读取配置的方法可能

问题: 我不熟悉React JS，正在寻找从外部属性文件读取环境配置的选项。这个问题对于我的一个客户来说更为具体，他希望能够选择动态更改环境文件。例如，每当发生更改时，动态更改主机名/端口。生成过程不属于我的客户。我创建了一个缩小的最终包，我的客户机将其部署在tomcat/web服务器上

尝试过的解决方案：通过一些读取，我已经为不同的环境配置了.env文件，并且能够成功地从这些文件中读取配置。但是，这些文件更多的是构建过程环境文件。而且，我正在试图找到一种在创建包后从外部源读取配置的方法

可能的解决方案：我可以想到一种可能的方法-

使用诸如属性读取器之类的库读取外部属性文件。我将提供属性文件作为发布包（即构建文件夹）的一部分。我的客户可以随时更改此属性文件

请建议这是正确的方法还是有更好的解决方案？

我建议使用类似的方法。我有一个类似的要求，即将应用程序构建指向我公司的生产或开发服务器API。为此，我们使用加载Firebase配置，并从中加载用于获取主机服务器端点的UI

优点：

这样可以避免每次部署生成文件夹。这是实时的，不容易出错。 FirebaseDB对于这样的小东西是免费的。

第二个选项是创建两个环境文件，我看到您已经这样做了。

一个适合我的解决方案

1在react项目的公用文件夹中创建一个config.js文件。样品含量 config.js文件-

window.env = {
  API_DOMAIN_ADDR: "http://localhost:8080"
};

2参考index.html中的config.js文件。index.html的代码将为-

<body>
    <div id="root"></div>
    <script src="%PUBLIC_URL%/config.js"></script>
  </body>

在需要访问变量值的地方添加此代码。我在正在进行ajax调用的服务类中添加了此选项。

谢谢Rishi！！我的客户对技术堆栈/软件也有限制，因为获得批准和认可需要时间。所以，Firebase可能不适合我的客户。此外，为了调用Firebase DB，我仍然需要具有特定于环境的连接url，因为不同环境的DB url也会有所不同。

window.env.API_DOMAIN_ADDR