React×Spring Bootな構成をAWS Fargateで動かす(7) ~ Fargateのデプロイ(実装・デプロイ編)

CDKでFargateをデプロイする(実装・デプロイ編)

さて!今回で最終回となります。前回の記事はコチラ。

これまでReactとSpring BootでCognito認証・認可付きのWebアプリケーションを作ってきました。
それらのアプリケーションを1つのALBから振り分けるためのIaCをCDKを使ってデプロイしていきたいと思います。
ちょっとしたコンストラクトも作成します。

プロジェクトの作成

まずはCDKプロジェクトを作成していきます。
これまで読んできた方にはおなじみのコマンドです。

プロジェクトの作成が終わったら、環境変数を保存する.env系のファイルをGitに含めないようにしましょう。

次に.envから設定を読み込みようにbinの下のmiso-application.tsを編集します。

miso-applicationの下にlambdaというフォルダを作成し、第5回で使用したJWT検証URLアクセス用のLambaのコードlambda_function.pyを配置しておきます。
まずはプロジェクトの準備が整いました。
ここまで作ってきたプロジェクトのフォルダ構成はこのようになっているはずです。

コンストラクトの作成

コードの保守性を高めるため、2つほどコンストラクト化します。
1つはVPC部分、もう1つはFargate部分です。
libの下にconstructsフォルダを作成し、そこにコンストラクトのソースを作っていきます。
まずはVPC部分のコンストラクトです。
他にもパラメータ化できますが、そこはお好きなように。

プライベートサブネットだけのVPCとFargateの実行に必要なVPCエンドポイントを作成しています。

次にFargateにサービスを作成するコンストラクトを作ります。
今回フロントエンドとバックエンドのサービスを作るのですが、それをこのコンストラクトで共通的に作れるようにしています。

コードの内容を簡単に説明します。

ECRリポジトリ作成(createEcrRepository)

  • ECR リポジトリを作成。削除時にはリポジトリも削除され、暗号化(KMS)される設定がされています。
  • cdk-docker-image-deploymentを使って、指定されたディレクトリからDockerイメージをビルドし、ECRにプッシュします(タグは “latest”)。

Fargateサービス作成(createFargateService)

  • IAMロールの作成
    • タスクが実行するためのタスクロールと、ECRやCloudWatch Logsにアクセスするための実行ロールを作成しています。実行ロールには必要なポリシー(ECRからのイメージ取得、ログの書き込み)が付与されています。
  • ロググループの作成
    • CloudWatch Logsのロググループを作成し、ログの保持期間や削除ポリシーを設定しています。
  • タスク定義の作成
    • Fargate用のタスク定義を作成し、タスクに必要なリソース(メモリ、CPU、ロール)を設定します。また、コンテナ定義を追加し、ECRからビルドしたイメージを使用、環境変数、ログ ドライバ(AwsLogDriver)とポートマッピングを設定しています。
  • ECS Fargateサービスの作成
    • 作成したタスク定義およびその他のパラメータ(クラスター、サービス名、デザイアカウント数、対象サブネットなど)を利用して、Fargateサービスを作成します。ここでは、デプロイメントコントローラーのタイプとして ECSを指定しています。

スタックの作成

メインとなるロジックを作成します。
miso-application-stack.tsを編集して次のようにします。

コードが長いので、ポイントを絞って説明します。

VPCの作成

  • 作成しておいたコンストラクトを使用してVPCを作成しています。
  • 環境変数から渡されたVPCのCIDRを使用しています。

ECSクラスターの生成

  • 作成したVPCにECSクラスターを作成しています。
  • Container Insightsもここで有効にしています。

ロードバランサの作成

  • ロードバランサに割り当てるセキュリティグループとロードバランサを作成しています。
  • プライベートサブネット名を指定し、Internet FacingをOFFにすることによって、プライベートなロードバランサとしています。

フロントエンドサービスの作成

  • 作成しておいたコンストラクトを使用して、フロントエンドサービスを作成しています。
  • ビルドのときの引数に必要な環境変数を渡しています。

バックエンドサービスの作成

  • 同様に作成しておいたコンストラクトを使用して、バックエンドサービスを作成しています。
  • こちらはコンテナ実行時の環境変数に値を渡し、ロードバランサのJWT検証URL取得のパスを指定しています。

Lambdaの作成

  • JWT検証URL取得用Lambdaを作成しています。

ロードバランサの設定

  • 環境変数から渡されたACM証明書のARNを使用して、リスナーを作成しています。
  • 作成したリスナーにパスルーティングで複数のターゲットグループを設定しています。

最後に.env.devを作成します。設定値は記載しませんが、以下のような値を設定してください。

コードがすべて揃いました!デプロイしましょう!

デプロイが完了したら最後にやることがあります。
Cognitoのアプリケーションクライアントに設定されている「許可されているコールバックURL」および「許可されているサインアウトURL」にALBのアドレスを追加してください。
こう考えるとカスタムドメインでやったほうが圧倒的に楽ですね・・・

まとめ

無事に想定していたWebアプリケーションをデプロイ・実行することができました!
これまで、SIerが携わることの多いプライベートな社内向けシステムを想定して、ReactとSpring Bootで作成したアプリケーションをCDKを使用してCognitoを作成するところからFargateにデプロイできるところまで連載してきました。
CDKは一度書いてしまえば、アプリケーションの開発者にとってもメンテナンスできそうなくらいわかりやすいコードになっていると思います。
今後もAWS案件に関わることになったら、積極的に使用していきたい大好きなサービスです。
今回の記事がどなたかのお役に立てれば幸いです。

それでは、またどこかの記事で👋


シリーズ記事

 

お問い合わせ先

執筆者プロフィール

Hayakawa Masafumi
Hayakawa Masafumitdi デジタルイノベーション技術部
昔も今も新しいものが大好き!
インフラからアプリまで縦横無尽にトータルサポートや新技術の探求を行っています。
週末はときどきキャンプ場に出没します。

関連記事