如何在Angular应用的environment.prod.ts中动态配置到后端的连接？

Question

构建具有Angularjs开发的前端和Java（maven）后端的应用程序。

下面是Angular与后端通信的environment.prod.ts文件。

export const environment = {
  production: true,
  urlAddress: 'http://localhost:8085'
};

到目前为止，我已经在本地部署了该应用程序，如下所示，我同时启动了前端和后端，并且该应用程序在本地计算机上运行正常-localhost：4200

frontend 
ng server --host 0.0.0.0

backend
java -jar backend.jar

当我尝试从同一网络中的其他系统访问该应用程序时出现了问题。我可以使用如下所示的系统部署的IP地址而不是localhost：4200来访问前端。

192.168.43.214:4200

但是当我对浏览器进行检查时，与后端的连接不起作用，发现它尝试将localhost：8085作为后端访问，因为IP地址localhost：8085硬编码在environment.prod.ts文件中。

当我尝试使用系统IP地址单独访问java后端服务时，jhipster页面也将正常运行。

192.168.43.214:8085

如下配置的prod文件解决了该问题

export const environment = {
  production: true,
  urlAddress: 'http://192.168.43.214:8085'
};

但是我必须事先知道要在其中运行后端服务的系统的IP地址。

由于前端和后端都将在同一服务器上运行。如何使角度服务器使用其自己的IP地址进行后端连接。

谢谢

Mohan

Answer 1

angular website详细介绍了如何配置环境文件以及在为不同环境构建时如何让系统替换它。

Answer 2

尝试

export const environment = {
  production: true,
  urlAddress: 'http://' + window.location.hostname + ':8085'
};