プロジェクト

全般

プロフィール

S3+CloudFrontで静的Webサイトを公開してみる

前の手順で作成した target の方のS3バケットをオリジンとしてCloudFrontでWebリソースを公開してみます。

CloudFrontはCDNのサービスで、エッジロケーションでコンテンツをキャッシュすることで通信のレイテンシを減らせます。
リージョン単位ではなくグローバルなサービスです(DNSのサービスであるRoute53なども同じくグローバルなサービスです)。
主にデータ通信量に対して課金されます(同じリージョン内でのAWSサービス内との通信は無料です)。
Amazon CloudFront

CloudFrontディストリビューションの作成

  • CloudFrontのコンソール画面を開く
  • CloudFrontのディストリビューションの作成
  • オリジンドメイン: 前の手順で作成した target の方のS3バケットを選択
  • S3 バケットアクセス: 「はい、OAI を使用します 」を選択
    • オリジンアクセスアイデンティティ: 新しいOAIを作成
    • バケットポリシー: はい、バケットポリシーを自動で更新します
  • ビューワープロトコルポリシー: Redirect HTTP to HTTPS
  • デフォルトルートオブジェクト: "index.html"を設定
  • ディストリビューションの作成

動作確認

  • targetの方のバケットに index.html をアプロード
  • CloudFrontの公開ドメイン名を「一般」タブの詳細 > ディストリビューションドメイン名 から確認
  • 反映されるまでしばし待つ...
  • Webブラウザで確認

参考リンク

CloudFront を使用して、Amazon S3 でホストされた静的ウェブサイトを公開するにはどうすればよいですか?