首页 > 解决方案 > How to Configure angular application to connect to remote server in production mode

问题描述

I have an angular application which is hosted on a server 'abc-def.com' and the corresponding REST apis' which allows the user to authenticate and use this angular application are on 'cdf-aqb.com'.

Both angular application and my REST apis' are hosted on tomcat on different servers. How can i configure my angular application connect to the server application once both are hosted in production environment.

In my case ,i have created a angularapp.war which is a part of an installer . This war is deployed in tomcat in abc-def.com. Similarly the REST api's code is part of another installer which is deployed on another server on cdf-aqb.com. In this case i won't know beforehand how to use environment.prod.ts. Because the server application can be hosted anywhere.

Should i ask for an input for the server api's host name, before trying to connect to authenticate to the server?

标签: angularrestapi

解决方案


您是否考虑过配置您的 environment.ts 和 environment.prod.ts 文件?

我通常做的是以下几点:

在里面environment.ts我放了本地网址

export const environment = {
  production: false,
  BASEURL: 'localhost:3000'
};

然后在`environment.prod.ts 我会有:

export const environment = {
  production: true,
  BASEURL: 'cdf-aqb.com'
};

您将必须更新所有服务以包含 BASEURL,它看起来如下所示:

return this.http.post<TokenResponse>(`${environment.BASEURL}/api/auth/register`, body);

当您使用 ng build --prod angular 将使用environment.prod.ts 希望这会有所帮助

有用的文章:

https://angular.io/guide/build

https://blog.angulartraining.com/how-to-manage-different-environments-with-angular-cli-883c26e99d15


推荐阅读