部署相同的Javascript webapp构建到不同的环境 [英] Deploy same Javascript webapp build to different environments

问题描述

我有一个ExtJS应用程序和一些不同的环境（本地机器，开发，类似生产的测试环境和生产）。
ExtJS应用程序由Java后端支持，后端还运行在本地机器上，在开发环境中，类似于生产的测试环境或生产环境（与前端应用程序的生命周期不同的服务器）对于最后两个环境，我想建立一个ExtJS应用程序的构建，并首先将其部署到测试服务器上，然后在准备发布时部署与生产服务器完全相同的构建。

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

什么是最好的方式来解决这样的问题？如何（以干净的方式）通常是构建并部署到几个不同环境并与其相应的后端应用程序通信的JavaScript Web应用程序？

解决方案

如何（以干净的方式）通常是构建一个JavaScript Web应用程序，并将
部署到多个不同的环境中，并与他们的
对应的后端应用程序进行通信？

嗯，情况不是很平常。通常后端应用程序（至少看似）在与前端应用程序加载的同一台服务器上。因此，可能最难以完成任务的方式是将前端应用程序的前端服务器代理请求发送到相应的后端服务器。这种方式前端应用程序仍然会与其原始服务器进行通信，它允许您为所有环境设置一个版本。

官方方式将使用 app.json 文件中的每个环境部分：

 production：{
backend：backend.domain.tld，
 //其他东西
}，
testing：{
后端：backend.testing.domain.tld，
 //其他东西
}，
开发：{
后端：后端.dev.domain.tld，
 //其他东西
} 
  

后端值将最终在构建的 classic.json （和/或现代）中。 json ）文件。前端应用将会看到值为 Ext.manifest.backend 。但是，这样做有效地创建了您想要避免的不同构建。因此，您可以手动创建一个这样的一个生产构建的 classic.json / modern.json ：

• classic.json.testing


• classic.json.staging


• classic.json.production / li>
  

，然后在前端服务器上使用重写来响应/classic.json请求与任何json文件匹配服务器的目的。 / p>

然而另一种方式是保持前端应用程序中所有环境的前端 - 后端映射，如下所示：

  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 作为关键和对话后端。

I have an ExtJS application and some different environments (local machine, development, production-like test environment, and production). The ExtJS application is backed by a Java backend which is also running on either a local machine, in a development environment, a production-like test environment or a production environment (not the same servers as where the front end application lives though).

For the last two environments, I want to build ONE build of the ExtJS app and first deploy it to the test server, then when ready for release deploy the exact same build to the production server.

Question: Is it possible to somehow use the environment where the frontend is deployed, to decide which backend the ExtJS should connect to? Since the ExtJS front-end is executed on the client's machine, it doesn't know if it should connect to the production backend or the test backend.

What is the best way to solve a problem like this? How (in a clean way) is usually a javascript web application built and deployed to several different environments and communicates with their corresponding backend application?

解决方案

How (in a clean way) is usually a javascript web application built and deployed to several different environments and communicates with their corresponding backend application?

Well, the case is not very usual. Usually the backend app would be (at least seemingly) on the same server that the frontend app is loaded from. Therefore, probably the most hassle free way to accomplish your task is to make the frontend server proxy requests from frontend app to corresponding backend server. This way frontend app will still talk to its origin server which allows you to have just one build for all environments.

The "official" way would be to use the per-environment sections in the app.json file like this:

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

The backend value will end up in the build's classic.json (and/or modern.json) file. Frontend app will see the value as Ext.manifest.backend. But this way is effectively creating different builds which you wanted to avoid. Therefore, you could just manually create several versions of classic.json/modern.json files for ONE production build like this:

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

and then use rewriting on the frontend server to respond to "/classic.json" requests with whatever json file matches the server purpose.

Yet another way is to the keep the frontend-backend mapping for ALL environments within the frontend app like this:

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
};

The app would use location.host as the key and talk to the corresponding backend.

这篇关于部署相同的Javascript webapp构建到不同的环境的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！