Angular 2アプリケーションのバックエンドAPI URLの実行時設定に関する推奨事項

Question

これは私を悩ませていましたが、隔週では別の賛否両論を思いついたようです。

その要点は、良いSPAが2つの異なる部分に分割されていることです。フロントエンドとバックエンド。フロントエンドは静的ファイル（javascript、css、htmlなど）に関するものでなければなりませんが、バックエンドは実際のデータを提供し、動的です。 しかし、私は常にフロントエンドでダイナミックにしたいと思うワンピースは、バックエンドURLです。

私は、通常、自分のアプリをオフにすることを意味します。http://server:123/と私のAPIはhttp://other:456/apiです。多くの場合、otherとserverは同じでポートは変更されますが、拡大縮小しても必ずしもそうではありません。

質問：Angular 2アプリケーションに構成データを提供するためのベストプラクティスは何ですか？

プロキシ

ほとんどのWebサーバーで、でもほとんどが静的コンテンツ指向のもの、プロキシ構成のいくつかの並べ替えを提供します（nginxの、角度-CLI：ここ

は、私はすでにと考えたものですサービスなど）。 プロキシの問題は、要求がダブルホップを実行することです。最初にサーバに送信する必要があります。その後、そのサーバは振り向いて本物の要求を行う必要があります。 私はこのアーキテクチャーのファンではありませんが、過去に他のアプリケーションで使っていましたが、

設定ファイルこれは、現在、私のお気に入りです。 1つ以上のURLや他の重要ではない情報が含まれている静的コンテンツ・サーバーから静的ファイル（多くの場合、/config.jsonとしましょう）を提供しています。 プロキシを使用できるので、ではなく、というように私はこのアプローチが好きです。それはあなた次第です。 ほとんどの場合、URLに基​​づいて静的ファイルを返すようにWebサーバーを設定するのはかなり簡単です（/configとしましょう）。

コード構成

これは私の最も好きです。この方法では、構成はコードファイル（たとえばconfig.ts）に直接書き込まれ、環境ごとに変更する必要があります。私はコードと構成を2つの異なるタスクと見なしています。私が扱っているほとんどの企業では、2つの異なるチームによって処理されています。 コードを再コンパイルしてバックエンドURLを変更するだけで再頒布する必要があるのは愚かなことです。

Answer 1

設定ファイルを使用しましたが、DevOpsツールで環境変数を設定することをお勧めします。

より簡単な設定のために、私は環境変数を使用します。さもなければ、私はRedisのようなバックエンド設定ストアの設定を渡すか、今はKube Secretsの日（より使いやすい）を渡します。