CloudFrontとS3でHTTPSな独自ドメイン

CloudFrontを使う理由

S3が独自ドメインのhttpsに対応していないようなので、CloudFrontを挟んでhttpsとして扱えるようにする。

S3の設定

静的ウェブサイトホスティングを次のように設定しましょう。

ウェブサイトのホスティングを有効にする
インデックスドキュメント: index.html
エラードキュメント: error.html

CloudFrontの設定

基本的には流れ通りにやりましょう。注意点は次の通りです。

Alternate Domain Names(CNAMEs)

CNAMEsを設定しましょう。
例: media.yoneapp.com

SSL Certificate

Request an ACM certificateで*.yoneapp.comのようなワイルドカード証明書をリクエストして使うと良いでしょう。

Viewer Protocol Policy

Redirect HTTP to HTTPSかHTTPS Onlyでいいんじゃないでしょうか。

Whitelist Headers

Whitelist HeadersにOriginを設定しましょう。設定しない場合media.yoneapp.comアクセス時にmedia.yoneapp.com.s3-website-ap-northeast-1.amazonaws.comにリダイレクトされてしまいました。

Status

CloudFrontも新規作成時や設定変更時には一定の時間がかかります。
StatusがInProgressからDeployedに変わるまで待ちましょう。

Route 53の設定

Route 53でなくてもいいのですが、ドメインとCloudFrontを結びつける必要があるので設定しましょう。