Загрузите приложение с угловым 2 с удаленными данными

Question

Я пытаюсь настроить приложение, в котором мое клиентское приложение AngularJS взаимодействует с сервером API. На этом сервере API у меня есть различные переменные среды, объявленные в соответствии с другими средами (в настоящее время разработка и производство).

Угловой клиент должен HTTP-получить часть этих переменных env, которые обслуживаются в конечной точке API http://myserver.com/api/client-config. Я понимаю, что это должно произойти до того, как приложение будет загружено, но я не понимаю, где и как включить HTTP-вызов.

app.module.ts

imports... 
    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 { 
} 

bootstrap.ts

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

platformBrowserDynamic().bootstrapModule(AppModule); 

Более конкретно Следующий импорт:

импорт firebaseConfig из '' ./config/firebase.config

зависит от переменных окружения, объявленных в среде сервера API. Могу ли я просто сделать свой HTTP-запрос GET здесь? Это не было бы идеальным решением, если моему приложению требуется объект конфигурации, обслуживаемый http://myserver.com/api/client-config в другом месте. Можно ли загружать мое приложение с этими данными, и если да - что лучше всего подходит для этого?

Answer 1

Просто, чтобы ответить на мой собственный вопрос; В этом конкретном случае я решил, что использование реализации переменных среды на стороне клиента является правильным способом решения моей проблемы, а не попыткой импортировать те, которые определены в среде сервера.

Я запускаю своего клиента с помощью Webpack. Прекрасный пример возможного способа реализации переменной среды на сторону клиента можно найти здесь:

angular2-webpack-starter/wiki