如何在加载时configurationSPA?

我们正在使用Webpack,React,Node.JS,但我认为这个问题是更通用的具体技术。 在构build开发模式或生产模式时(例如使用DefinePlugin),我可以使用Webpack来configurationSPA。

如何在不同的部署环境下(例如,分段与生产)在生产模式下configurationSPA(在构build时configuration)? 例如,这些不同的部署将与不同的后端服务器API进行通信。

不知何故,SPA必须从服务器获取一些本地上下文,因为它正在被浏览器取得。 或者,也许我们必须在SPA可以安全地获取的每个服务器上有一个自定义的configuration文件?

我们在服务器上使用NodeJS,这个SPA最终将作为一个同构的应用程序运行,这样可以提供帮助。 我们正在将这些应用程序部署在Docker镜像中,并且很容易在部署时configuration其环境。

感谢您的任何build议。

我们现在正在用同样的概念挣扎。 我发现在运行时configuration的最好方法是使用envvariables(可以在构build时设置,但也可以在运行时使用docker native或任何其他编排工具(如ECS或GKE)覆盖)。

另一个更脏的方式,我们以前使用的是通过图像的CMD指令执行运行时间调整。 这不是真的build议,因为它使您的图像可变,并可以使其容易出错。 然而 – 它确实有效,如果明智地使用,可以实现你想要的。 一个简单的例子是replace你现在的CMD,看起来有点像这个CMD node app.js ,像这样 – bash -c "wget prod.conf && node app.js"

我发现了一种做需要的方法。 在服务SPA时,通过设置一个包含configuration细节的cookie。 然后SPA可以读取该cookie来获取configuration(并且因为不再需要该cookie而删除该cookie)。

有一个名为ClientConfig的NPM模块可以帮助我完成我所描述的内容。 它的作用非常类似于一个名为GetConfig的配套NPM模块,它有助于在服务器端进行configuration。 ClientConfig: https : //github.com/henrikjoreteg/clientconfig

如何使用ClientConfig和GetConfig(单独和一起)在这里描述: http ://read.humanjavascript.com/ch12-settings-and-configs.html

这似乎是一个解决scheme,虽然我想知道任何潜在的安全问题(这比第一次出现要复杂得多),如果没有更简单的方法。 任何意见或进一步的解决scheme将不胜感激

我们目前的代码使用WebPack DefinePlugin,但我不相信这允许我们做我们需要的。 我也find了提到客户端的ExtendedDefinePlugin,但是我不确定这是否是一个可能的解决scheme:

https://github.com/ArikMaor/extended-define-webpack-plugin https://www.npmjs.com/package/extended-define-webpack-plugin

DefinePlugin也在这里讨论:

在webpack中传递依赖于环境的variables

但是我不相信这将允许我们根据部署上下文而不是构build上下文来configuration客户端SPA。