0

我正在尝试设置我的 Angular 客户端应用程序与 API 服务器通信的应用程序。在这个 API 服务器中,我声明了各种环境变量以匹配它的不同环境(当前开发生产)。

Angular 客户端应该通过 HTTP 获取在 API 端点上提供的这些环境变量的一部分http://myserver.com/api/client-config。我知道这应该在应用程序启动之前发生,但我不明白我应该在哪里或如何包含 HTTP 调用。

app.module.ts

...
import firebaseConfig from './config/firebase.config'; 

@NgModule({
    declarations: [
        AppComponent,
        VrtVideoPlayer,
        VrtAppsComponent,
        SubtitlesComponent,
        RangeSliderComponent,
        listPipe
    ],
    imports: [
        BrowserModule, 
        FormsModule,
        NgbModule,
        VgCore, 
        VgControlsModule, 
        VgOverlayPlayModule, 
        VgBufferingModule,
        HttpModule,
        AngularFireModule.initializeApp( firebaseConfig() ),
        RouterModule.forRoot([
            { path: 'subtitles', component: SubtitlesComponent },
            { path: '', component: SubtitlesComponent },
        ]),
    ],
    providers: [ExtBrowserXhr],
    bootstrap: [AppComponent],
})
export class AppModule {}

app.component.ts

import {Component} from '@angular/core';

import '../node_modules/bootstrap/scss/bootstrap.scss';
import './common/styles/styles.scss';

@Component({
    selector: 'my-app',
    templateUrl: 'app.component.html',
})
export class AppComponent {
}

引导程序

import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {AppModule} from './app.module';

platformBrowserDynamic().bootstrapModule(AppModule);

更具体地说 ,以下导入:

从 './config/firebase.config' 导入 firebaseConfig

依赖于 API 服务器环境中声明的环境变量。我可以在这里简单地发出我的 HTTP GET 请求吗?如果我的应用程序需要其他地方提供的配置对象,这将不是一个理想的解决方案http://myserver.com/api/client-config。是否可以使用这些数据引导我的应用程序,如果是这样 - 关于此的最佳做法是什么?

4

1 回答 1

0

只是为了回答我自己的问题;在这种特殊情况下,我认为使用环境变量的客户端实现是解决我的问题的正确方法,而不是尝试导入在服务器环境中定义的那些。

我使用 Webpack 运行我的客户端。可以在此处找到实现客户端环境变量的可能方法的完美示例:

angular2-webpack-starter/wiki

于 2016-10-29T15:19:33.053 回答