0

Angular クライアント アプリが API サーバーと通信するアプリケーションをセットアップしようとしています。この API サーバーでは、さまざまな環境 (現在はdevelopmentとproduction ) に一致するように宣言されたさまざまな環境変数があります。

Angular クライアントは、API エンドポイントで提供されているこれらの env 変数の一部を HTTP 取得する必要があります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 {
}

ブートストラップ.ts

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 に答える