Applicationの構築CloudFrontとS3、ELB(ALB)を使うと簡単にSPAなサービスを構築することができます。CloudFrontの設定CloudFrontにはパスによってどのバックエンドにリクエストを流すか複数設定することができます。一般的な設定でいくと、APIのプリフィックスに/apiをつけて、APIに関するリクエストはALBに流すようにして、それ以外のリクエストはS3に流すようにするだけです。設定はまずOriginを追加します。Originにはhtmlなどを配信するS3とAPIを提供するALBを設定します。プルダウンから各リソースを選択するだけなので簡単に設定できます。S3のBehaviorの設定Originを作成したら次はBehaviorを設定します。Patternがデフォルト設定になるようにしてください。HTTPSを選択してください。HeadersはNodeを選択することでキャッシュ機能を有効化できます。ALBのBehaviorの設定パスを設定する場合は/api/*のようにすると/api/user、/api/user/1などのパスに対して対応することができます。HeadersはALLを選択することでAPIの結果をキャッシュしなくなります。ALLを選択するとTTLが自動で0になります。この画像の場合は自分で0を入力しているので0と表記されていますが。まとめこれであとは設定が反映されればCloudFrontのドメインからhtmlとAPIの両方にリクエストを割り振ることができ同じドメインでSPAを構築することができます。WAFを設定してアクセス制限等もできるのでぜひ試してみてください。WAFでCloudFrontにIP制限をかける方法おすすめ書籍AWSをこれから使う初心者の方から現在使っている中級者の方までおすすめできる書籍です。内容はVPC、セキュリティグループ、IAMなどの基本的なことからWEBサービスを作るのに欠かせない、EC2、RDS、Route53などの扱い方が丁寧に説明されています。Watchを使ったモニタリング方法、セキュリティ等について解説されています。手元において困ったときに読むのにちょうどいい一冊になると思います。スマホゲームを作る子会社に所属し、サーバーサイドのエンジニアを担当。2年目の終わりから新規子会社の立ち上げに参加し、サーバーサイドのエンジニアリーダーとしてサービースのリリースから運用までを担当。Incにブロックチェーンエンジニアとして入社。コメントをキャンセルメールアドレスが公開されることはありません。WAFでCloudFrontにIP制限をかける方法RECOMMENDこちらの記事も人気です。