チュートリアル: Amazon S3 での静的ウェブサイトの設定 - Amazon Simple Storage Service
ステップ 1: バケットを作成するステップ 2: 静的ウェブサイトホスティングを有効にするステップ 3: パブリックアクセスブロック設定を編集するステップ 4: バケットの内容の公開を許可するバケットポリシーを追加するステップ 5: インデックスドキュメントを設定するステップ 6: エラードキュメントの設定ステップ 7: ウェブサイトエンドポイントをテストするステップ 8: クリーンアップする

チュートリアル: Amazon S3 での静的ウェブサイトの設定

重要

Amazon S3 では、Amazon S3 内のすべてのバケットの基本レベルの暗号化として、Amazon S3 が管理するキー (SSE-S3) によるサーバー側の暗号化が適用されるようになりました。2023 年 1 月 5 日以降、Amazon S3 にアップロードされるすべての新しいオブジェクトは、追加費用なしで、パフォーマンスに影響を与えずに自動的に暗号化されます。S3 バケットのデフォルト暗号化設定と新しいオブジェクトのアップロードのための自動暗号化ステータスは、AWS CloudTrail ログ、S3 インベントリ、S3 ストレージレンズ、Amazon S3 コンソール、および AWS Command Line Interface と AWS SDK の追加の Amazon S3 API レスポンスヘッダーとして利用できるようになりました。詳細については、「デフォルト暗号化に関するよくある質問」を参照してください。

Amazon S3 バケットは、ウェブサイトと同じように機能するように設定できます。この例では、Amazon S3 上でウェブサイトをホスティングするステップを説明します。

重要

次のチュートリアルでは、[パブリックアクセスをブロック] を無効にする必要があります。[パブリックアクセスをブロック] 設定は、有効にしておくことをお勧めします。4 つすべての [パブリックアクセスをブロック] 設定を有効にしたまま、静的ウェブサイトをホストする場合は、Amazon CloudFront のオリジンアクセスコントロール (OAC) を使用できます。Amazon CloudFront は、セキュアな静的ウェブサイトをセットアップするために必要な機能を提供します。Amazon S3 静的ウェブサイトは、HTTP エンドポイントのみをサポートしています。Amazon CloudFront は、耐久性に優れた Amazon S3 のあるストレージを使用し、HTTPS などの、追加のセキュリティヘッダーを提供します。HTTPS では、通常の HTTP リクエストを暗号化し、一般的なサイバー攻撃から保護することで、セキュリティが強化されます。詳細については、「Amazon CloudFront デベロッパーガイド」の「安全な静的ウェブサイトの使用開始」を参照してください。

ステップ 1: バケットを作成する

以下の手順では、ウェブサイトホスティングにバケットを作成する方法の概要を説明します。バケットの作成に関するステップバイステップの方法は、「バケットの作成」を参照してください。

バケットを作成するには

  1. AWS Management Console にサインインし、Amazon S3 コンソール (https://console.aws.amazon.com/s3/) を開きます。

  2. [Create bucket] (バケットの作成) をクリックします。

  3. [バケット名] (example.com など) を入力します。

  4. バケットを作成するリージョンを選択します。

    レイテンシーとコストを最小限に抑えるため、または規制要件に対処するために、最寄りのリージョンを選択します。選択したリージョンによって、Amazon S3 ウェブサイトエンドポイントが決まります。詳細については、「ウェブサイトエンドポイント」を参照してください。

  5. デフォルト設定をそのまま使用してバケットを作成するには、[作成] を選択します。

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

バケットを作成したら、バケットの静的ウェブサイトホスティングを有効にできます。新しいバケットを作成することも、既存のバケットを使用することもできます。

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

  1. AWS Management Console にサインインし、Amazon S3 コンソール (https://console.aws.amazon.com/s3/) を開きます。

  2. [バケット] リストで、静的ウェブサイトホスティングを有効にするバケットの名前を選択します。

  3. [プロパティ] を選択します。

  4. [静的ウェブサイトホスティング] で [編集] を選択します。

  5. [このバケットを使用してウェブサイトをホストする] を選択します。

  6. [静的ウェブサイトホスティング] で [有効化] を選択します。

  7. [インデックスドキュメント] に、インデックスドキュメントのファイル名 (通常は index.html) を入力します。

    インデックスドキュメント名の大文字と小文字は区別されます。この名前は、S3 バケットにアップロードする HTML インデックスドキュメントのファイル名と正確に一致する必要があります。バケットをウェブサイトホスティング用に設定するときは、インデックスドキュメントを指定する必要があります。Amazon S3 からこのインデックスドキュメントが返されるのは、ルートドメインまたはサブフォルダに対するリクエストが行われたときです。詳細については、「インデックスドキュメントの設定」を参照してください。

  8. 4XX クラスエラーに関する独自のカスタムエラードキュメントを指定する場合は、[エラードキュメント] にカスタムエラードキュメントのファイル名を入力します。

    エラードキュメント名の大文字と小文字は区別されます。この名前は、S3 バケットにアップロードする HTML エラードキュメントのファイル名と正確に一致する必要があります。カスタムエラードキュメントを指定しない場合、エラーが発生すると、Amazon S3 からデフォルトの HTML エラードキュメントが返されます。詳細については、「カスタムエラードキュメントの設定」を参照してください。

  9. (オプション) 高度なリダイレクトツールを指定する場合は、[Rredirection rules] (リダイレクトルール) に、JSON を入力してルールを記述します。

    例えば、条件に応じてリクエストのルーティング先を変えることができます。この条件として使用できるのは、リクエストの中の特定のオブジェクトキー名またはプレフィックスです。詳細については、「高度な条件付きリダイレクトを使用するようにリダイレクトルールを設定する」を参照してください。

  10. [Save changes] (変更の保存) をクリックします。

    Amazon S3 では、バケットの静的ウェブサイトホスティングを有効にします。ページの下部の [静的ウェブサイトホスティング] の下に、バケットのウェブサイトエンドポイントが表示されます。

  11. [静的 ウェブサイトホスティング] の下のエンドポイントを書き留めます。

    [Endpoint (エンドポイント)] は、バケットの Amazon S3 ウェブサイトエンドポイントです。バケットを静的ウェブサイトとして設定すると、このエンドポイントを使用してウェブサイトをテストできます。

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

デフォルトでは、Amazon S3 はアカウントとバケットへのパブリックアクセスをブロックします。バケットを使用して静的ウェブサイトをホストする場合は、以下のステップを使用して、パブリックアクセスブロック設定を編集できます。

警告

このステップを完了する前に「Amazon S3 ストレージへのパブリックアクセスのブロック」を読んで、パブリックアクセスを許可することに伴うリスクを理解し、了承してください。パブリックアクセスブロック設定をオフにしてバケットをパブリックにすると、インターネット上のだれでもバケットにアクセスできるようになります。バケットへのすべてのパブリックアクセスをブロックすることをお勧めします。

  1. https://console.aws.amazon.com/s3/ で Amazon S3 コンソールを開きます。

  2. 静的ウェブサイトとして設定されたバケットの名前を選択します。

  3. [Permissions (アクセス許可)] を選択します。

  4. [ブロックパブリックアクセス (バケット設定)] で [編集] を選択します。

  5. [Block all public access (すべてのパブリックアクセスをブロックする)] をクリアし、[Save changes (変更の保存)] を選択します。

    バケットのブロックパブリックアクセス設定を示す Amazon S3 コンソール。

    Amazon S3 で、バケットのブロックパブリックアクセス設定がオフになります。パブリックな静的ウェブサイトを作成するには、バケットポリシーを追加する前に、アカウントのブロックパブリックアクセス設定を編集する必要があります。アカウントのブロックパブリックアクセス設定が現在有効になっている場合は、[ブロックパブリックアクセス (バケット設定)] の下にメモが表示されます。

ステップ 4: バケットの内容の公開を許可するバケットポリシーを追加する

S3 のパブリックアクセスブロック設定を編集した後で、バケットへのパブリック読み取りアクセスを許可するバケットポリシーを追加できます。パブリック読み取りアクセスを許可すると、インターネット上のだれでもバケットにアクセスできるようになります。

重要

次のポリシーは、単なる例として、バケットのコンテンツへのフルアクセスを許可します。このステップに進む前に、「Amazon S3 バケット内のファイルを保護するにはどうすればよいですか?」を確認して、S3 バケット内のファイルを保護するためのベストプラクティスと、パブリックアクセスの許可に伴うリスクを理解してください。

  1. [バケット] で、バケットの名前を選択します。

  2. [Permissions (アクセス許可)] を選択します。

  3. [Bucket Policy (バケットポリシー)] で [編集] を選択します。

  4. ウェブサイトのパブリック読み取りアクセスを許可するには、次のバケットポリシーをコピーし、[Bucket policy editor (バケットポリシーエディター)] に貼り付けます。

    {
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:GetObject"
            ],
            "Resource": [
                "arn:aws:s3:::Bucket-Name/*"
            ]
        }
    ]
}

  5. Resource をバケット名に更新します。

    前述のバケットポリシーの例では、Bucket-Name はバケット名のプレースホルダーです。このバケットポリシーを独自のバケットで使用するには、バケット名に合わせてこの名前を更新する必要があります。

  6. [Save changes] (変更の保存) をクリックします。

    バケットポリシーが正常に追加されたことを示すメッセージが表示されます。

    Policy has invalid resource というエラーが表示された場合は、バケットポリシー内のバケット名がバケット名と一致していることを確認します。バケットポリシーの追加については、「S3 バケットポリシーを追加する方法」を参照してください。

    エラーメッセージが表示され、バケットポリシーを保存できない場合は、アカウントとバケットの [パブリックアクセスをブロックする] 設定をチェックして、バケットへのパブリックアクセスを許可していることを確認します。

ステップ 5: インデックスドキュメントを設定する

バケットに対して静的ウェブサイトホスティングを有効にする場合は、インデックスドキュメントの名前 (index.html など) を入力します。バケットに対して静的ウェブサイトホスティングを有効にした後、インデックスドキュメント名を含む HTML ファイルをバケットにアップロードします。

インデックスドキュメントを設定するには

  1. index.html ファイルを作成します。

    index.html ファイルがない場合は、以下の HTML を使用して作成できます。

    <html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>My Website Home Page</title>
</head>
<body>
  <h1>Welcome to my website</h1>
  <p>Now hosted on Amazon S3!</p>
</body>
</html>

  2. インデックスファイルをローカルに保存します。

    インデックスドキュメントファイル名は、[静的ウェブサイトホスティング] ダイアログボックスで入力したインデックスドキュメント名と正確に一致する必要があります。インデックスドキュメント名では、大文字と小文字が区別されます。例えば、[静的ウェブサイトホスティング] ダイアログボックスの [インデックスドキュメント] 名に「index.html」と入力する場合、インデックスドキュメントファイル名も index.html ではなく Index.html である必要があります。

  3. AWS Management Console にサインインし、Amazon S3 コンソール (https://console.aws.amazon.com/s3/) を開きます。

  4. [バケット] リストで、静的ウェブサイトホスティングに使用するバケットの名前を選択します。

  5. バケットに対して静的ウェブサイトホスティングを有効にし、インデックスドキュメントの正確な名前 (index.html など) を入力します。詳細については、「ウェブサイトのホスティングの有効化」を参照してください。

    静的ウェブサイトホスティングを有効にしたら、ステップ 6 に進みます。

  6. インデックスドキュメントをバケットにアップロードするには、以下のいずれかを実行します。

    • インデックスファイルをコンソールバケットのリストにドラッグアンドドロップします。

    • [Upload] を選択し、プロンプトに従ってインデックスファイルを選択してアップロードします。

    手順については、「オブジェクトのアップロード」を参照してください。

  7. (オプション) 他のウェブサイトコンテンツをバケットにアップロードします。

ステップ 6: エラードキュメントの設定

バケットに対して静的ウェブサイトホスティングを有効にするときは、エラードキュメントの名前 (例: 404.html) を入力します。バケットに対して静的ウェブサイトホスティングを有効にしたら、エラードキュメント名を含む HTML ファイルをバケットにアップロードします。

エラードキュメントを設定するには

  1. エラードキュメント (例: 404.html) を作成します。

  2. エラードキュメントのファイルをローカルに保存します。

    エラードキュメントの名前は、大文字と小文字を区別し、静的ウェブサイトホスティングを有効にする際に入力した名前と厳密に一致している必要があります。たとえば、[Static website hosting] (静的ウェブサイトホスティング) ダイアログボックスの [Error document] (エラードキュメント) 名に 404.html と入力する場合、エラードキュメントのファイル名も 404.html である必要があります。

  3. AWS Management Console にサインインし、Amazon S3 コンソール (https://console.aws.amazon.com/s3/) を開きます。

  4. [バケット] リストで、静的ウェブサイトホスティングに使用するバケットの名前を選択します。

  5. バケットに対して静的ウェブサイトホスティングを有効にし、エラードキュメントの正確な名前 (例: 404.html) を入力します。詳細については、ウェブサイトのホスティングの有効化およびカスタムエラードキュメントの設定を参照してください。

    静的ウェブサイトホスティングを有効にしたら、ステップ 6 に進みます。

  6. エラードキュメントをバケットにアップロードするには、以下のいずれかを実行します。

    • エラードキュメントファイルをコンソールバケットのリストにドラッグアンドドロップします。

    • [Upload] を選択し、プロンプトに従ってインデックスファイルを選択してアップロードします。

    手順については、「オブジェクトのアップロード」を参照してください。

ステップ 7: ウェブサイトエンドポイントをテストする

バケットに静的ウェブサイトホスティングを設定したら、ウェブサイトエンドポイントをテストできます。

注記

Amazon S3 は、ウェブサイトへの HTTPS アクセスをサポートしていません。HTTPS を使用する場合は、Amazon CloudFront を使用して Amazon S3 でホストされている静的ウェブサイトを提供できます。

詳細については、「CloudFront を使用して、Amazon S3 でホストされた静的ウェブサイトを公開するにはどうすればよいですか?」と「ビューワーと CloudFront との通信で HTTPS を必須にする」を参照してください。

  1. [バケット] で、バケットの名前を選択します。

  2. [プロパティ] を選択します。

  3. ページの下部の [静的ウェブサイトホスティング] で、[Bucket website endpoint (バケットウェブサイトエンドポイント)] を選択します。

    インデックスドキュメントが別のブラウザウィンドウで開きます。

これで、Amazon S3 でウェブサイトがホスティングされるようになりました。このウェブサイトには、Amazon S3 ウェブサイトエンドポイントの URL を指定してアクセスできます。ただし、作成したウェブサイトのコンテンツを配信するのに、example.com などのドメインを使用することもできます。また、Amazon S3 のルートドメインサポートを利用すると、http://www.example.com と http://example.com のどちらのリクエストでも処理できるようになります。このようにするには、追加のステップが必要です。例については、「チュートリアル: Route 53 に登録されたカスタムドメインを使用した静的ウェブサイトの設定」を参照してください。

ステップ 8: クリーンアップする

学習のためだけに静的ウェブサイトを作成した場合は、割り当てた AWS リソースを削除して、料金が発生しないようにします。AWS リソースを削除すると、ウェブサイトは使用できなくなります。詳細については、「バケットの削除」を参照してください。