我使用 Angular 8 创建了一个 Angular Web 应用程序。 Angular Web 应用程序通过格式端点连接到 Java Jetty 服务器 http://ip-address-of-server:port/endpoint-name。 我使用 environment.ts 文件来指定服务器的 IP 地址。
现在，我必须向客户端提供 Java Jetty 服务器和 Angular webapp（仅 webapp 和 .war 文件，不提供源代码）。然后谁会将它们安装在他们的私人设置中。因此，生产 IP 地址事先是未知的。
因此，我如何提供允许在生产环境中编辑 Angular webapp 中的服务器 IP 地址？
【问题讨论】：
/api/foo 之类的URL 而不是http://ip:post/api/foo，核心将连接到它来自的服务器，无论其IP 或端口是什么。奖励：它也将原生支持 https。
一个更易于维护的解决方案是 Dockerize 您的应用程序。您将提供 docker 映像，您的客户可以简单地在他想要的端口上启动一个容器。
您只需要编写端点，一切都会在本地主机上提供服务。
构建 docker 映像是一次性的，但有助于稍后提供修复而不是提供战争文件。希望这会有所帮助。
【讨论】：
您可以像这样修改您的环境设置：
import * as deepmerge from 'deepmerge';
export const environment: EnvConfig = deepmerge<EnvConfig>(
{
apiEndpoint: 'http://ip-address-of-server:port/endpoint-name',
// other stuff
},
(typeof INJECTED_CONFIG === 'undefined' ? {} : INJECTED_CONFIG),
);
当您为应用程序提供服务时，您可以将 INJECTED_CONFIG 变量注入您的 index.html（在服务器端）
<!doctype html>
<html>
...
<body>
...
<!-- Injections -->
</body>
</html>
您的服务器可以将<!-- Injections --> 替换为
<script>
var INJECTED_CONFIG = { apiEndpoint: 'http://0.0.0.0:port/endpoint-name', }
</script>
在服务器端，您可以从服务器环境中读取apiEndpoint 的值。
此类应用程序将替换提供的 INJECTED_CONFIG 中的所有环境设置，因此您可能希望缩小要启用替换的范围。
【讨论】：
在我的项目中，我们从事过类似的工作。 在 environment.ts 文件中，我引用了我之前在配置文件中配置的一些变量。 您可能可以让客户端使用他们需要的值或其他内容来配置此文件（在我的情况下，它将在运行时在我的 docker 映像中被覆盖）。
怎么做？
首先你必须声明类型文件来设置你的全局变量。
typings.d.ts
declare var ENV_CONFIG: EnvConfig;
interface EnvConfig {
ENVIRONMENT: string;
API_URL: string;
CLIENT: string;
}
environment.ts 文件
export const environment = {
appVersion: require('../../package.json').version,
env: ENV_CONFIG.ENVIRONMENT,
apiUrl: ENV_CONFIG.API_URL,
client: ENV_CONFIG.CLIENT
};
config.js 文件：
let ENV_CONFIG = {
ENVIRONMENT: 'production',
API_URL: 'http://ip-address-of-server:port',
CLIENT: 'yourClientName'
};
最后，你需要在 index.html 中声明你的文件：
<script src="./your/config/file/path/config.js"></script>
之后，您可以像往常一样使用您的环境属性。
public API_URL = environment.apiUrl;
希望对你有帮助！
【讨论】：
如果服务器应用程序和客户端应用程序都在同一个环境中。那么您可以使用 - this.window.location.hostname 来获取主机名并构建端点。
如果您正在维护环境。文件，那么在这种情况下，您需要提供界面来编辑或手动要求更改.. 环境/environment.prod.ts
【讨论】：