CloudFrontのカスタムエラーレスポンスとWAFの組み合わせでメンテナンスページを設定

これはなに

AWS ClouFrontで公開されるサイトのメンテナンスページの表示方法について検討する際に迷ったことがあったので、実装方法や疑問点など紹介します。

背景

・CloudFrontの前段にはAWSWAFが配置されており、IP制限等で接続ユーザーを管理できるようにしてある。
・404エラーなどはカスタムエラーレスポンスでページを表示したい。
・不定期なメンテナンスに備え、任意のタイミングでメンテナンスページへ移行できるようにしておきたい。

構成図

構成のざっくりとした全体像は以下の通りです。

疑問点

調べてみると以下のような構成にすることで、メンテナンスページを簡単に作れると複数発見。
仕組みとしては以下のようになる。

1. AWS WAF側でIPアドレス制限をかける
2. 許可されてないユーザーがアクセスする
3. 許可されていないので403エラーが発生する
4. エラーコードに基づいてカスタムエラーレスポンスでメンテナンスページを返す

しかし、ん？でもCloudFrontの前段にWAFがあるから無理じゃない？？と思いました。
そもそもWAFでブロックされるんだからCloudFrontには到達しないよね？と。

なので、以下の図のような状態を私の中では想定。

試してみた

許可IPでの接続時

許可されたIPアドレスなので、そうていのコンテンツが表示される。

非許可IPでの接続時

WAFでブロックされているはずなのに設定したカスタムエラーレスポンスがちゃんと返ってくる。。

調べてみた

つまり、403エラーはWAFが返してるのではなく、
CloudFrontから返ってきていたのだ

実際の動き

上記の調べてみた前提をもとにAWS WAFでブロックされた際の処理フローを図解してみると以下のようになります。

1. AWS WAFがCloudFrontに403エラーを返却する
2. S3からカスタムエラーレスポンスに設定のコンテンツを取得する
3. 取得したコンテンツをユーザーに返す
   

まとめ

• CloudFrontのカスタムエラーレスポンスを使うと簡単にメンテナンスページが実現できるの皆さんもぜひ！！
• WAFでブロックされたときにはWAFからレスポンスを返すのではなく、CloudFrontに403を返している。

最後に注意点

①AWS WAF ルールを使用してカスタマイズした応答は、
CloudFront カスタムエラーページで定義した応答よりも優先されます。

②CloudFrontはオリジンによって返された403と、
AWS WAFによってブロック時に返された403を区別できないです。