将环境变量传递给Angular2应用程序？

发布时间：2020-12-17 07:46:36 所属栏目：安全来源：网络整理

导读：我需要将后端网址传递给我的Angular2应用程序,因为生产和开发服务器托管在不同的位置. 我知道我可以在外部的config.json中存储这些东西,并在启动时加载.然而,这似乎是在应用程序启动之前不必要的额外调用服务器. 或者,我现在做的是创建一个单一的全局变量,我

我需要将后端网址传递给我的Angular2应用程序,因为生产和开发服务器托管在不同的位置.

我知道我可以在外部的config.json中存储这些东西,并在启动时加载.然而,这似乎是在应用程序启动之前不必要的额外调用服务器.

或者,我现在做的是创建一个单一的全局变量,我根据构建在gulp中注入.我的应用程序不是一个需要重复使用的lib,我不相信我应该碰到意外的全局名称冲突.但这不是一个好习惯.

我想知道是否有更好的解决方案？

我会看到两种方法：

>利用文件中的JSON配置.这个文件将在加载应用程序之前被加载：

var app = platform(BROWSER_PROVIDERS)
   .application([BROWSER_APP_PROVIDERS,appProviders]);

var http = app.injector.get(Http);
http.get('config.json').subscribe((config) => {
  return app.bootstrap(AppComponent,[
    provide('config',{ useValue: config })
  ]);
}).toPromise();

这是一个对应的plunkr描述全局方法：https://plnkr.co/edit/ooMNzEw2ptWrumwAX5zP?p=preview.
>利用配置模块：

export const CONFIG = {
  (...)
};

在引导应用程序时将导入并包含在提供程序中：

import {CONFIG} from './config';

  bootstrap(AppComponent,{ useValue: CONFIG })
  ]);

通过这两种方法,可以在打包应用程序时为每个环境定义配置.

这个问题也可以提供如何打包Angular2应用程序的提示：

> How do I actually deploy an Angular 2 + Typescript + systemjs app?

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!