为 Angular 4/5 应用程序配置服务端点答案

【问题标题】：Configure service endpoint for angular 4/5 application为 Angular 4/5 应用程序配置服务端点
【发布时间】：2017-11-08 10:39:37
【问题描述】：

为此应用程序有 angular4 应用程序和 web api 数据服务。拥有该应用程序和数据服务的 100 个客户。他们的 IIS 上有这个数据服务和 Angular 应用程序。因此，100 个角度应用程序中的每一个都使用另一个端点地址。因此，每个客户中的角度应用程序都需要配置来设置端点地址——必须在客户中设置。没有一个常量端点可以写入任何角度应用程序的文件。 angular 4/5 应用如何解决这个问题？

【问题讨论】：

更准确地说 - 端点不能在 .ts (environment.ts) 文件中硬编码 - 因为它们不能在客户中更改。我需要客户端应用程序配置文件，可以为每个客户单独更改。数据服务（asp.net web api）没问题，它有他的 web.config - 它可以工作。但似乎不支持 Angular 应用程序的配置文件。

标签： angular configuration endpoint

【解决方案1】：

我看到的一个解决方案是在项目的资产文件夹中创建一个名为 configuration.json（或您希望的任何名称）的文件，并更改所有端点当您在现场部署时。

在您的代码中，您应该创建一个角度服务，该服务从文件中读取 json 并将其作为对象公开给需要数据服务端点的应用程序部分。这将涉及使用 HttpClient 对 configuration.json 文件执行 GET 请求。

此外，您可以使用解析器，它使用服务，在导航到每条路线之前解析环境数据。

这篇文章很好地描述了解决方案：https://www.intertech.com/Blog/deploying-angular-4-apps-with-environment-specific-info/

重点是您可以更改文件中的端点，您的应用程序将在运行时解析它们。

【讨论】：

谢谢，我找到了类似的东西——从资产文件夹中读取（json）配置文件。但是 - 正如我所看到的，Web 应用程序在读取本地文件时存在问题 - 可能是因为安全性。但在某些情况下 - 当 web api url 类似于 web 客户端 url 时，可以从 assets 文件夹中读取文件。在某些情况下，我得到了不好的结果（Web 应用程序中的路径无效，资产文件的相对路径不能正常工作）。我找到了一些使用 APP_INITIALIZER、javascript 函数的可接受的解决方案 - 它可以在 AOT 编译和 prod 模式下工作。