将相同的Javascript Webapp构建部署到不同的环境

Question

我有一个ExtJS应用程序和一些不同的环境（本地计算机，开发，类似于生产的测试环境和生产）。 ExtJS应用程序由Java后端支持，该Java后端也可以在本地计算机上，开发环境，类似于生产的测试环境或生产环境中运行（尽管与前端应用程序所处的服务器不同）。

对于最后两个环境，我想构建一个ExtJS应用程序的内部版本，然后将其部署到测试服务器，然后在准备发布时将完全相同的内部版本部署到生产服务器。

问题：是否可以以某种方式使用部署前端的环境来确定ExtJS应该连接到哪个后端？ 由于ExtJS前端是在客户端计算机上执行的，因此它不知道应该连接到生产后端还是测试后端。

解决此类问题的最佳方法是什么？ 通常如何（以一种干净的方式）构建一个javascript Web应用程序并将其部署到几个不同的环境中，并与其相应的后端应用程序进行通信？

Answer 1

通常如何（以一种干净的方式）构建一个javascript Web应用程序并将其部署到几个不同的环境中，并与其相应的后端应用程序进行通信？

好吧，这种情况不是很平常。 通常，后端应用程序（至少表面上）应该与前端应用程序从同一服务器上加载。 因此，可能最轻松的方式来完成任务是将前端服务器代理请求从前端应用程序发送到相应的后端服务器。 这样，前端应用程序仍将与其原始服务器通信，从而使您仅能针对所有环境构建一个版本。

“正式”的方式是使用app.json文件中的每个环境部分，如下所示：

"production": {
    "backend": "backend.domain.tld",
    // other stuff
},
"testing": {
    "backend": "backend.testing.domain.tld",
    // other stuff
},
"development": {
    "backend": "backend.dev.domain.tld",
    // other stuff
}

backend值将最终出现在构建的classic.json （和/或modern.json ）文件中。 前端应用程序将看到值为Ext.manifest.backend 。 但是这种方式有效地创建了您要避免的不同版本。 因此，您可以为一个生产版本手动创建几个classic.json / modern.json文件版本，如下所示：

• classic.json.testing
• classic.json.staging
• classic.json.production

然后在前端服务器上使用重写功能，以匹配服务器目的的任何json文件响应“ /classic.json”请求。

另一种方法是在这样的前端应用程序中保留所有环境的前端-后端映射：

var ENV_CONF = {
    'frontend.testing.domain.tld': 'backend.testing.domain.tld',
    'frontend.staging.domain.tld': 'backend.staging.domain.tld',
    'domain.tld': 'backend.domain.tld' // production
};

该应用程序将使用location.host作为密钥并与相应的后端通信。