
CloudFrontのCustom Error Responseを利用して、S3上にあるSorryページを表示する
この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。
こんにちは、ゴールデンウィークの10連休が終わってしまい、社会復帰ができていない岩本です。
さて、早速ですが
やりたい事
- CloudFrontで指定した、オリジンサーバーの障害時に、オリジンがSorryサーバーに自動的に切り替わるようにしたい。
備考
- Cloudfront - オリジン間はHTTP/HTTPSが混在しており、
 クライアントからのHTTPS通信の際は- Cloudfront - オリジン間の通信もHTTPS化したい。
想定した構成

問題(オリジンサーバーがS3へフェイルオーバー時)
上記の構成では、このような問題が考えられます。(オリジンへの通信はMatch Viewerを指定する)
- HTTP通信の場合は、S3に割り当てたドメイン名origin.hoge.comを利用できる
- HTTPS通信の場合は、S3に割り当てたドメイン名origin.hoge.comだと
 (S3ウェブホスティングにSSL証明書は割り当てられないので)SSL証明書のエラーとなる。
Route53 を利用した上記の構成では、SSLにて問題が出ることがわかりました。
そこで、CloudFrontのCustom Error Responseを利用して、(SSL通信を維持しつつ)S3上にあるSorryページを表示させます。
やったこと
S3
- Sorry用のコンテンツを設置するバケットを作成
- バケットに/sorry/sorry.htmlを設置
CloudFront
Origins
- Sorryサーバー用のS3バケットをオリジンとして追加
Behaviors
- sorry/*を追加し、オリジンを(Sorry用の)S3バケットに指定
Error Pages
- Create Custom Error Responseにて- 503指定
- Customize Error Responseを- Yes
- Response Page Pathを- /sorry/sorry.html
- HTTP Response Codeを- 503に指定
実際の構成

解説
通常であれば、オリジンで発生したエラーをCloudFrontはそのままクライアントへと送信しますが、
Custom Error Responseを利用することで、エラーレスポンスのカスタマイズが行えます。
その際、Response Page Path(エラー時に表示させるページ)を指定可能です。
ただし、外部のサーバーを指定することはできず、同一ドメイン以下のパスの指定が必要となります。
そこでSorryを表示する用のBehaviorsを作成し、オリジンをS3バケットと指定しました。
Custom Error Responseでは、
- 400- 403- 404- 405- 414- 416
- 500- 501- 502- 503- 504
のステータスコードの変更が可能です。
今回オリジンはELBは以下にある想定とし、ELBのステイタスチェックにてインスタンスの原因により
エラーが発生した場合には503のレスポンスコードとなるため、Custom Error Responseにて指定をしています。
Classic Load Balancer のトラブルシューティングを行う: HTTP エラー
まとめ
この構成により、Route53のヘルスチェックも不要になり、障害時には状況に適したレスポンスコードも返せるようになります。
今日のわさび様
ゴールデンウィーク中のわさびさんのご様子です。











