notebook

都内でWEB系エンジニアやってます。

angular-cliでバックエンドへプロキシする

Angularでバックエンドが必要な開発をしていて、最初モックサーバなどを立てて先にフロント側に着手したいといった場合

普通にポートを別で指定してリクエストを送るとCORSで怒られます

そこでng serveのproxyオプションを使用してバックエンド側にプロキシするということができます

設定

プロキシの設定を書きます

最低限ならこれだけで良さそう

{
  "/api": {
    "target": "http://192.168.30.93:3000",
    "secure": false
  }
}

起動

ng serce --proxy-config proxy.conf.json

この設定で http://192.168.30.93:4200/api/以下への通信は3000番へプロキシしてくれます

まず動くものを出したい場合とかいにいいですね

大体docker(nginx)立ててバックエンドとangularへのプロキシ設定してーとやっていくと

そもそも本番どういう構成にしようとか

そしたら構成合わせてこうしたほうがいいよなーとか

やることが増えていってしまうので先に動くものを見せるまで時間がかかってしまいます

そんなときにプロキシでサクッと実装!ができます