WAF&CloudFrontでの503メンテナンスページ表示

要件

https://knowledge.hdora.tokyo/?p=988 でかなり苦戦したメンテナンスページ。
ただ503メンテページを出すだけでこんなに苦労する訳がないと思い、色々調べました。

今回実現しなければいけない要件は以下の通り。
①特定のipからは普通にコンテンツを見れる
②その他ipからのアクセスには503エラーを返す
③できるだけ簡単な方法(aws管理画面から1、2クリックでいけるのが理想)

作業記録

wafとcloudfrontのカスタムエラーページ表示機能で実現できました。

WAF

・除外するIPアドレスを登録

項目設定
IP set namesaitama
Description - optional[ ]
RegionGlobal(CloudFront)
IP versionIPv4
IP addresses※自宅IPアドレス

・Web ACL作成

項目設定
Namemaintenance
Description - optional[ ]
CloudWatch metric namemaintenance
Resource typeCloudFront distributions
RegionGlobal(CloudFront)
Associated AWS resources - optional[ ]
Add rulesAdd my own rules and rule groups
Rule typeIP set
Namesaitama
IP setsaitama
IP address to use as the originating addressSource IP address
ActionAllow
Default actionBlock
Set rule priority※デフォルト
Amazon CloudWatch metrics※デフォルト
Request sampling optionsEnable sampled requests

CloudFront

・オリジン追加

項目設定
Origin Domain Name※Sorryサーバのパブリック IPv4 DNS

・Behavior

項目設定
Path Pattern/maintenance.html
Origin or Origin Groupパブリック IPv4 DNS
Viewer Protocol PolicyHTTP and HTTPS
Allowed HTTP MethodsGET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE
Field-level Encryption Config[ ]
Cached HTTP MethodsGET, HEAD (Cached by default)
Cache and origin request settingsUse legacy cache settings
Cache Based on Selected Request HeadersAll
Forward CookiesAll
Query String Forwarding and CachingForward all, cache based on all
Smooth StreamingNo
Restrict Viewer AccessNo
Compress Objects AutomaticallyNo
Lambda Function Associations[ ]
Enable Real-time LogsNo

・Error Pages

設定項目
HTTP Error Code403: Forbidden
Error Caching Minimum TTL (seconds)0
Customize Error ResponseYes
Response Page Path/maintenance.html
HTTP Response Code503: Service Unavailable

メンテページ表示ONOFF

あとはメンテナンスページを出したい時間に、対象ディストリビューションを選んでWAF「maintenance」を適用するだけ。
メンテナンスページを取り下げる際は、対象ディストリビューションからWAFを外せばよいです。
楽ちん楽ちん♪

宿題

今回は以前作成したSorryサーバ(Apache初期設定&簡易メンテナンスページ設置済)があったのでそれを利用したが、S3でページ用意してしまったほうがよさそう。
時間があったらS3に置き換え予定。