Angular CLIでプロキシファイルを設定する方法

Angular CLIでプロキシファイルを設定する方法

Angular開発時にフロントエンドがAngularでAPIがJavaだったりするとそれぞれローカル開発環境が異なると思います。

Angular : http://localhost:4200/

java: http://localhost:8080/

こんな感じで開発することになるかと思います。

これだとポートが異なるためオリジンが違うので、クロスドメイン通信が出来ません。

こういう場合は、Angular CLIでCORSを有効にする必要があります。(じゃないとローカル環境で開発出来ません)

上記コマンドでオプションの一覧が表示されます。CORSを有効にするには--proxy-configオプションを使用します。

package.jsonと同じ位置にa.jsonファイルを置きます。(ファイル名はなんでもよいです)

ファイルは以下のようにします。

これで、app/localにリクエストがきた場合にtargetで指定したオリジンにフォワードすることができます。

先にサーバサイドを起動してから、ng serveすればOKです。

スポンサーリンク
  • このエントリーをはてなブックマークに追加
スポンサーリンク

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA