Amazon CloudFront, S3, Route 53 を利用して、独自ドメインで静的ウェブサイトを公開する方法をご紹介します。
Amazon S3 に静的ウェブサイトをホスティングする | CodeNote
で書きましたが、S3 だけでも静的ウェブサイトをホスティングすることはできます。
しかし、S3 だけで運用すると S3 bucket に大量アクセスがきたときに高額請求になるリスクがあるので、本記事では CloudFront と S3 を組み合わせて使います。
『構成 1. CloudFront のオリジンに、 S3 バケットそのものを指定する構成』 - CloudFront + S3 で静的サイトを運用する際の注意点 - Qiita
の設定していきます。
リージョン 米国西部 (オレゴン) が $0.023 で最安価なのでこれを利用します。
特に何も選択しません。
<h4アクセス許可の設定
パブリックアクセスをすべてブロック
オリジンアクセスアイデンティティを使用して Amazon S3 コンテンツへのアクセスを制限する - Amazon CloudFront
HTTP リクエストは HTTPS リクエストへ redirect させたいので Redirect HTTP to HTTPS を選択します。
参考: ビューワーと CloudFront との通信で HTTPS を必須にする - Amazon CloudFront
参考: CloudFront と Amazon S3 オリジンとの間の通信で HTTPS を必須にする - Amazon CloudFront
CloudFront に gzip 圧縮して配信してもらいたいので Compress Objects Automatically は Yes にします。転送量が減るので、高速化と転送料金の節約で一石二鳥になります。
SSL 証明書を未だ作成してない場合は、[Request or Import a Certificate with ACM] から SSL 証明書を発行しましょう。
最後に Route 53 で DNS を設定すれば、独自ドメインで CloudFront + S3 で静的ウェブサイトをホスティングに必要な作業は全て完了です。
以上、Amazon CloudFront と S3 で静的ウェブサイトを公開した、現場からお送りしました。