😆

S3の静的ウェブサイトホスティング設定

2022/01/04に公開

AWS

tech

はじめに

S3の公式ドキュメントに記載されているチュートリアルを確認しながら、S3を使用した静的ウェブサイトホスティングの設定を行っていきます。普段S3を静的ウェブサイトホスティングで利用することがないので、利用手順の確認をするのが目的です。

S3バケットの作成

まず初めに、静的コンテンツのホスティングに使用するS3バケットを作成していきます。

AWSマネジメントコンソールからS3サービスをクリックします。
ナビゲーションペインから「バケット」を選択し、バケットの作成をクリックします。
バケット名を入力し、他の設定は一旦デフォルトのままで作成します。
バケットができたことを確認します。

静的ウェブサイトホスティングを有効にする

作成したバケットを選択し、「プロパティ」から「静的ウェブサイトホスティング」の編集をクリックします。
静的ウェブサイトホスティングを「有効にする」を選択します。
ホスティングタイプを「静的ウェブサイトをホストする」を選択します。
インデックスドキュメント、エラードキュメントは、それぞれデフォルトの「index.html」、「error.html」を入力します。
今回はリダイレクトルールは入力しません。
変更の保存をクリックします。
再びプロパティから「静的ウェブサイトホスティング」を確認すると、1~6で設定した項目が反映されています。記載されているバケットウェブサイトエンドポイントにアクセスすると、ウェブサイトのエンドポイントして利用できます。（現状バケットにファイルをアップロードしていないため、確認できません。また、パブリックアクセスブロックがデフォルト設定だとブロックされているため、アクセスしても403 Forbiddenになります。）

S3ウェブサイトエンドポイントは使用しているリージョンに応じて以下の「ドット」か「ダッシュ」の形式になります。

パブリックアクセスブロック設定を編集する

デフォルトでバケットを作成したため、パブリックアクセスブロックが全てオンの状態になっています。現状のままだとウェブサイトホスティングとして機能しないため、「パブリックアクセスを全てブロック」をオフにします。

「アクセス許可」をクリックします。
ブロックパブリックアクセス（バケット設定）から「編集」をクリックします。
パブリックアクセスを全てブロックのオンをオフに変更し、「変更の保存」をクリックします。
「変更の保存」をクリックすると、以下のようなポップアップが表示されるので、確認と入力して「確認」をクリックする。パブリックアクセスブロックをオフにすると、インターネット上の誰でもバケットに対してアクセスすることが可能になるので、注意しましょう。

バケット内のリソースに対してアクセスを許可するバケットポリシーを設定する。

パブリックアクセスブロックを設定しても、まだS3のリソースに対してアクセスすることはできません。（AWSではデフォルトリソースへのアクセスは拒否）作成したS3バケットに対してバケットポリシーを設定することで、インターネット上の誰でもバケットに対してアクセスできるようになります。

「アクセス許可」をクリックします。
バケットポリシーの「編集」をクリックします。
自身のバケットへの読み取り権限を許可するバケットポリシーを設定します。

これで作成したS3バケットに対してアクセスすることができるようになりました。

インデックスドキュメントをアップロード

静的ウェブサイトホスティングの有効化で設定したインデックスドキュメントファイル名と同じ名前のファイルをアップロードします。

S3から、「example-test-hosting.com」をクリックします。
アップロードをクリックします。
アップロードするファイルをローカルから選択し、「アップロード」をクリックします。
ファイルがアップロードされたことを確認します。

ウェブサイトホスティングされたことを確認

必要なファイルがアップロードされたので、バケットウェブサイトエンドポイントにアクセスして、index.htmlが正しく表示されることを確認します。

正しくindex.htmlが表示されていることが確認できました。
S3では、httpsでのアクセスはサポートされていないので、httpsを使用したい場合は、CloudFrontを利用しなければいけません。

クリーンアップ

最後に、作成したS3バケットを削除します。