在多个环境中使用的 angular4 应用程序中编码 url 的最佳实践是什么？

Question

我有一个 angular 4 应用程序，我正在尝试找到一种最佳实践方法来创建用于创建服务的解决方案或某种用于处理许多 urls 的解决方案开发和生产环境中的 http 请求。

此时我的解决方案如下所示。

import { Injectable } from '@angular/core';
/**
 * PathsService is like a properties file for all of the URL paths used in the application.
 */
@Injectable()
export class PathsService {

  constructor() {}

  productionEnvironment:string = "https://myproductionenvironment.com"
  developmentEnvironment:string = "https://mydevelopmentenvironment.com"

  activeRoot:string = productionEnvironment;


  loginResource = "/loginresources"
  employeeResource = "/employeeresouces"

  public getLoginResources(): string {
    return this.activeRoot+this.loginResource;
  }

  public getEmployeeResource():string {
    return this.activeRoot+this.employeeResource;
  }




}

虽然我相信这会工作得很好，但有一个小问题，因为在从开发环境切换到生产环境时我必须更改 activeRoot。我想知道是否有更好的方法可以做到这一点，所以我不必手动切换。我可以使用 javascript 获取 url，解析它，并以这种方式在生产和开发环境之间切换，但似乎应该有更好的 angular 方法来解决这个问题问题。对此问题的任何意见将不胜感激。谢谢！

Answer 1

使用 angular cli，您将在编译时获得 environment.dev.ts 和 environment.prod.ts。

例如： http://www.alternatestack.com/development/app-development/angular2-environment-specific-configuration/

Answer 2

如果您使用的是 Angular CLI，则您有一个名为 environments 的文件夹。在此，您有 environment.ts 和 environment.prod.ts。

在这两个文件中，您都有一个导出的对象。在这个对象中，可以添加一个let apiUrl = 'your URL;。然后，在您的文件中，您 仅导入第一个 (environment.ts)

那么，构建的时候只需要运行ng build --prod，编译的时候不会使用environment.ts，而是使用environment.prod.ts

够清楚了吧？

Answer 3

如果您使用 Angular CLI，您应该有两个文件，src/environments/environment.ts 和 src/environments/environment.prod.ts。在此文件中，您可以为生产和开发目的分配环境变量。只需 import { environment } from '../environments/environment'，一切就绪。 CLI 会自动 select 适合您的环境。

在多个环境中使用的 angular4 应用程序中编码 url 的最佳实践是什么？

What is best practice for coding urls in an angular4 app used in multiple environments?

angular-http

angular