角度应用程序的参数化

Question

我有一个application，它包含一个Angular前端，一个app层和一个DB层。您可以在this image中看到该架构。

我正在使用nginx实例向客户端提供JS前端位以及将客户端请求代理到应用层。所以，让我说我在具有IP 18.1.1.1的云虚拟机上部署这个nginx（假的）我可以将我的浏览器指向该IP，客户端将下载JS代码，并且配置了JS代码，请参阅{{ 3}}，将app服务器ip / fqdn设置为相同的ip / fqdn我指向浏览器下载ui。 此时，nginx代理配置here并将JS代码发出的所有/ api请求转发给特定的fqdn。现在这是一个特定的FQDN，因为我将这些组件部署为容器，而nginx容器总是知道如何到达http://yelb-appserver:4567/api。

我现在想要创建其他部署方法，特别是我想在S3存储桶（或任何其他Web服务器）上托管Angular位，并让JS直接指向类似API GW的东西，一个单独的EC2实例，云负载均衡器，或表示与提供JS文件的Web服务器的IP / FQDN不同的IP / FQDN端点的任何内容。 在这种情况下，我无法再使用kicks in使用的appserver_env: 'http://' + window.location.host。

由于我想创建一个动态且可重复的部署工作流程（使用cloudformation或类似工具），我想知道是否有办法使用单个JS编译工件参数化Angular代码以指向创建的/ api端点在部署时或者如果我唯一的选择是，在每次部署时，1）在部署时创建/读取/ api端点，2）以编程方式使用端点自定义Angular代码，3）动态重建Angular应用程序（现在包括特定的/ api端点）和4）最后使用为部署的特定应用程序实例的custom / api端点创建的JS代码ad-hoc部署网站。

感谢。

Answer 1

使用环境变量并将它们保存在配置中（例如＆＃34; environment.prod.ts＆＃34;在您的情况下），这将提供给运行构建的节点进程。您的javascript角度代码可以使用这些变量，例如对于api端点，您可以在代码中的process.env.API_ENDPOINT使用api端点。现在提供这些变量你可以使用简单的API_ENDPOINT='/api' npm run build或者更高级的方法，你可以使用Docker。