Route 53 に登録されたカスタムドメインを使用した静的ウェブサイトの設定 - Amazon Simple Storage Service

Route 53 に登録されたカスタムドメインを使用した静的ウェブサイトの設定

Amazon S3 で静的ウェブサイトをホスティングするとします。ドメインは Amazon Route 53 に登録済みであり (例: example.com)、http://www.example.comhttp://example.com へのリクエストに対しては Amazon S3 からコンテンツを配信するようにします。このチュートリアルでは、静的ウェブサイトをホスティングし、Route 53 に登録されているカスタムドメイン名を持つウェブサイトのリダイレクトを Amazon S3 で作成する方法について説明します。Amazon S3 でホスティングする既存のウェブサイトを操作することも、このチュートリアルを使用して最初から開始することもできます。

このチュートリアルを完了したら、オプションで Amazon CloudFront を使用してウェブサイトのパフォーマンスを向上させることができます。詳細については、「Amazon CloudFront によるウェブサイトの高速化」を参照してください。

注記

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

詳細については、「CloudFront を使用して Amazon S3 でホストされている静的ウェブサイトを提供する方法」と「CloudFront と Amazon S3 オリジンとの間の通信で HTTPS を必須にする」を参照してください。

開始する前に

この例で実行するステップでは、以下のサービスを使用します。

Amazon Route 53 – Route 53 では、ドメインを登録し、ドメインのインターネットトラフィックをルーティングする先を定義します。以下の例では、Route 53 エイリアスレコードを作成して、ドメイン (example.com) とサブドメイン (www.example.com) のトラフィックを HTML ファイルが含まれている Amazon S3 バケットにルーティングする方法を示します。

Amazon S3 – Amazon S3 を使用して、バケットを作成したり、サンプルウェブサイトページをアップロードしたり、全員がコンテンツを表示できるようアクセス許可を設定したりします。また、ウェブサイトホスティング用にバケットを設定することもできます。

ステップ 1: カスタムドメインを Route 53 に登録する

登録済みドメイン名 (example.com など) が無い場合は、Route 53 でドメイン名を登録します。詳細については、Amazon Route 53 開発者ガイドの「新しいドメインの登録」を参照してください。ドメイン名を登録したら、Amazon S3 バケットを作成してウェブサイトのホスティング用に設定できます。

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

ルートドメインとサブドメインからの両方のリクエストをサポートするには、2 つのバケットを作成します。

  • ドメインバケットexample.com

  • サブドメインバケットwww.example.com

これらのバケット名はドメイン名と正確に一致する必要があります。この例では、ドメイン名は example.com です。コンテンツをルートドメインバケット (example.com) からホストします。サブドメインバケットのリダイレクトリクエストを作成します (www.example.com)。他のユーザーがブラウザに www.example.com を入力すると、example.com にリダイレクトされ、その名前で Amazon S3 バケットにホストされているコンテンツが表示されます。

バケットをウェブサイトホスティング用に作成するには

以下の手順では、ウェブサイトホスティングにバケットを作成する方法の概要を説明します。バケットを作成する詳細な手順については、『Amazon Simple Storage Service コンソールユーザーガイド』の「How Do I Create an S3 Bucket?」を参照してください。

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

  2. ルートドメインのバケットを作成します。

    1. [バケットを作成する] を選択します。

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

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

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

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

  3. サブドメインのバケットを作成します。

    1. [バケットを作成する] を選択します。

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

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

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

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

次のステップでは、ウェブサイトホスティング用に example.com を設定します。

ステップ 3: ウェブサイトホスティング用にルートドメインのバケットを設定する

このステップでは、ルートドメインのバケット (example.com) をウェブサイトとして設定します。このバケットには、ウェブサイトのコンテンツが含まれます。バケットをウェブサイトホスティング用に設定すると、そのウェブサイトには ウェブサイトエンドポイント を使用してアクセスできるようになります。

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

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

  2. [Bucket name (バケット名)] で、静的ウェブサイトに対して使用するバケットを選択します。

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

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

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

  6. インデックスドキュメントの名前を入力します。

    通常、インデックスドキュメント名は index.html です。インデックスドキュメント名の大文字と小文字は区別されます。この名前は、S3 バケットにアップロードする HTML インデックスドキュメントのファイル名と正確に一致する必要があります。詳細については、「インデックスドキュメントの設定」を参照してください。

  7. (オプション) カスタムエラードキュメントを追加する場合は、[エラードキュメント] ボックスにエラードキュメントのキー名 (error.html など) を入力します。

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

  8. (オプション) 高度なリダイレクトツールを指定する場合、[Edit redirection rules (リダイレクトルールを編集する)] に、XML を使用してルールを記述します。

    詳細については、「高度な条件付きリダイレクトの設定」を参照してください。

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

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

  10. [Save] を選択します。

次のステップで、リクエストをドメイン (example.com) にリダイレクトするように、サブドメイン (www.example.com) を設定します。

ステップ 4: ウェブサイトのリダイレクト用にサブドメインのバケットを設定する

ウェブサイトホスティング用にルートドメインのバケットを設定したら、このドメインにすべてのリクエストをリダイレクトするように、サブドメインのバケットを設定できます。この例では www.example.com のすべてのリクエストが example.com にリダイレクトされます。

リダイレクトリクエストを設定するには

  1. Amazon S3 コンソールの [バケット] リストで、サブドメインのバケット (この例では www.example.com) を選択します。

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

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

  4. [リクエストをリダイレクトする] を選択します。

  5. [ターゲットバケットまたはドメイン] ボックスに、ドメイン (example.com など) を入力します。

  6. [プロトコル] ボックスで http を入力します。

  7. [Save] を選択します。

ステップ 5: ウェブサイトトラフィックのログ記録を設定する

ウェブサイトにアクセスする閲覧者の数を追跡するには、オプションでルートドメインのバケットのログ記録を有効にできます。詳細については「Amazon S3 サーバーアクセスログ記録」を参照してください。Amazon CloudFront を使用してウェブサイトを高速化するには、CloudFront のログ記録を使用することもできます。

ルートドメインバケット用のサーバーアクセスのログ記録を有効にするには

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

  2. 静的ウェブサイトとして設定しているバケットを作成したのと同じリージョンで、ログ記録用のバケットを作成します (例: logs.example.com)。

  3. サーバアクセスのログを記録するログファイル用のフォルダを作成します (例: logs)。

  4. (オプション) CloudFront を使用してウェブサイトのパフォーマンスを向上させる場合は、CloudFront ログファイル用のフォルダを作成します (例: cdn)。

  5. [Bucket] リストで、ルートドメインのバケットを選択します。

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

  7. [Server access logging (サーバーアクセスのログ記録)] を選択します。

  8. [ログの有効化] を選択します。

  9. [ターゲットバケット] で、ログファイル用に作成したバケット (logs.example.com など) を選択します。

  10. [ターゲットプレフィックス] に、ログファイル用に作成したフォルダの名前に続けて区切り記号 (/) を入力します (例:logs/)。

    [ターゲットプレフィックス] を設定すると、フォルダ内のログデータファイルをグループ分けして見つけやすくすることができます。

  11. [Save] を選択します。

    これで、ログバケット内のログにアクセスできるようになりました。Amazon S3 は、2 時間ごとにウェブサイトのアクセスログをログバケットに書き込みます。

  12. ログを表示するには、[概要] を選択し、フォルダを選択します。

ステップ 6: インデックスとウェブサイトのコンテンツをアップロードする

このステップでは、インデックスドキュメントとオプションのウェブサイトコンテンツをルートドメインのバケットにアップロードします。

バケットに対して静的ウェブサイトホスティングを有効にする場合は、インデックスドキュメントの名前 (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 ではなく index.html である必要があります。

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

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

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

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

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

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

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

    手順については、Amazon Simple Storage Service コンソールユーザーガイド の「Amazon S3 バケットにファイルとフォルダをアップロードする方法」を参照してください。

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

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

この例では、ドメインバケット (example.com) のパブリックアクセスブロック設定を編集して、パブリックアクセスを許可します。

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

警告

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

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

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

  3. [Permissions] を選択します。

  4. [Edit] を選択します。

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

    警告

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

  6. 確認ボックスで、confirm, を入力し、[確認] を選択します。

    [S3 バケット] で、バケットの [アクセス] が [Objects can be public (オブジェクトは公開可能)] に更新されます。これで、バケットポリシーを追加して、バケット内のオブジェクトをパブリックに読み取り可能にすることができます。アクセス がまだ Bucket and objects not public (バケットとオブジェクトはパブリックではありません) と表示される場合は、バケットポリシーを追加する前に、アカウントのパブリックアクセスブロックの設定を編集する必要があります。

ステップ 8: バケットポリシーをアタッチする

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

重要

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

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

  2. [Permissions] を選択します。

  3. [バケットポリシー] を選択します。

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

    { "Version": "2012-10-17", "Statement": [ { "Sid": "PublicReadGetObject", "Effect": "Allow", "Principal": "*", "Action": [ "s3:GetObject" ], "Resource": [ "arn:aws:s3:::example.com/*" ] } ] }
  5. Resource を更新してバケット名を含めます。

    前のバケットポリシーの例では、example.com がバケット名です。このバケットポリシーを独自のバケットで使用するには、バケット名に合わせてこの名前を更新する必要があります。

  6. [Save] を選択します。

    バケットにパブリックアクセスが許可されていることを示す警告が表示されます。[バケットポリシー] に、パブリックラベルが表示されます。

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

    [Error - Access denied (エラー - アクセスが拒否されました)] という警告が表示され、バケットポリシーエディターでバケットポリシーの保存が許可されていない場合は、アカウントレベルおよびバケットレベルのパブリックアクセスブロック設定をチェックして、バケットへのパブリックアクセスを許可していることを確認します。

次のステップでは、ウェブサイトのエンドポイントを判別し、ドメインエンドポイントをテストできます。

ステップ 9: ドメインエンドポイントをテストする

パブリックウェブサイトをホストするようにドメインバケットを設定したら、エンドポイントをテストできます。詳細については、「ウェブサイトエンドポイント」を参照してください。サブドメインバケットは静的ウェブサイトホスティングではなく、ウェブサイトリダイレクト用に設定されているため、ドメインバケットのエンドポイントのみをテストできます。

注記

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

詳細については、「CloudFront を使用して Amazon S3 でホストされている静的ウェブサイトを提供する方法」と「CloudFront と Amazon S3 オリジンとの間の通信で HTTPS を必須にする」を参照してください。

ウェブサイトエンドポイントをテストするには

静的ウェブサイトホスティングを有効にしたときにウェブサイトエンドポイントを書き留めている場合は、ウェブサイトをテストするために、そのウェブサイトエンドポイントをブラウザに入力します。ブラウザに index.html ページが表示されれば、ウェブサイトのデプロイが成功しています。詳細については、「Amazon S3 ウェブサイトエンドポイント」を参照してください。

テストする前にウェブサイトエンドポイントを取得する必要がある場合は、次の手順に従います。

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

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

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

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

  5. ウェブサイトエンドポイントをテストするには、[エンドポイント] の横でウェブサイトエンドポイントを選択します。

    ブラウザに index.html ページが表示されれば、ウェブサイトのデプロイが成功しています。

次のステップでは、顧客が両方のカスタム URL を使用してサイトにアクセスできるように、Amazon Route 53 を使用します。

ステップ 10: ドメインとサブドメインのエイリアスレコードを追加する

このステップでは、ドメインマップ example.comwww.example.com のホストゾーンに追加するエイリアスレコードを作成します。エイリアスレコードでは、IP アドレスを使用する代わりに、Amazon S3 ウェブサイトエンドポイントを使用します。Amazon Route 53 によって、エイリアスレコードと、Amazon S3 バケットが存在する IP アドレスとのマッピングが維持されます。ルートドメイン用とサブドメイン用の 2 つのエイリアスレコードを作成します。

ルートドメインのエイリアスレコードを追加するには (example.com)

  1. https://console.aws.amazon.com/route53/ にある Route 53 コンソールを開きます。

    注記

    まだ Route 53 を使用していない場合、『Amazon Route 53 開発者ガイド』の「ステップ1: ドメインを登録する」を参照してください。セットアップが完了したら、指示を再開できます。

  2. [Hosted Zones (ホストゾーン)] を選択します。

  3. ホストゾーンのリストで、ドメイン名に一致するホストゾーンの名前を選択します。

  4. [Create Record Set (レコードセットの作成)] を選択します。

  5. 次の値を指定します。

    名前

    ホストゾーンとドメインの名前であるデフォルト値を受け入れます。

    ルートドメインの場合、[Name (名前)] フィールドに追加情報を入力する必要はありません。

    タイプ

    [A – IPv4 アドレス] を選択します。

    エイリアス

    [Yes] を選択します。

    エイリアス先

    リストの [S3 website endpoints (S3 ウェブサイトエンドポイント)] セクションで、バケット名を選択します。

    バケット名は、[Name (名前)] ボックスに表示されている名前と一致する必要があります。[Alias Target (エイリアス先)] リストでは、バケット名の後に、バケットが作成されたリージョンの Amazon S3 ウェブサイトエンドポイント (example.com (s3-website-us-west-2) など) が続きます。以下の場合は、[Alias Target] にバケットが表示されます。

    • バケットを静的ウェブサイトとして設定した場合。

    • バケットの名前が、作成するレコードの名前と同じである場合。

    • 現在の AWS アカウントでバケットを作成した場合。

    バケットが [Alias Target (エイリアス先)] リストに表示されない場合は、バケットが作成されたリージョンの Amazon S3 ウェブサイトエンドポイント (s3-website-us-west-2 など) を入力します。Amazon S3 ウェブサイトエンドポイントの詳細なリストについては、「Amazon S3 ウェブサイトエンドポイント」を参照してください。エイリアス先の詳細については、Amazon Route 53 開発者ガイド の「エイリアス先」を参照してください。

    ルーティングポリシー

    デフォルト値の [Simple] をそのまま使用します。

    ターゲットの正常性の評価

    デフォルト値の [No] をそのまま使用します。

  6. [Create] を選択します。

サブドメインのエイリアスレコードを追加するには (www.example.com)

  1. ルートドメイン (example.com) のホストゾーンで、[Create Record Set (レコードセットの作成)] を選択します。

  2. 次の値を指定します。

    名前

    サブドメインの場合、ボックスに www と入力します。

    タイプ

    [A – IPv4 アドレス] を選択します。

    エイリアス

    [Yes] を選択します。

    エイリアス先

    リストの [S3 website endpoints (S3 ウェブサイトエンドポイント)] セクションで、[Name (名前)] フィールドに表示される名前と同じバケット名 (www.example.com (s3-website-us-west-2) など) を選択します。

    ルーティングポリシー

    デフォルト値の [Simple] をそのまま使用します。

    ターゲットの正常性の評価

    デフォルト値の [No] をそのまま使用します。

  3. [Create (作成)] を選択します。

注記

通常、変更は 60 秒以内にすべての Route 53 サーバーに伝達されます。伝達が完了すると、この手順で作成したエイリアスレコードの名前を使用して、トラフィックを Amazon S3 バケットにルーティングできます。

ステップ 11: ウェブサイトをテストする

ウェブサイトとリダイレクトが正しく機能することを確認します。ブラウザで、URL を入力します。この例では、次の URL を試すことができます。

  • ドメイン (http://example.com) – example.com バケット内のインデックスドキュメントを表示します。

  • サブドメイン (http://www.example.com) – リクエストを http://example.com にリダイレクトします。example.com バケット内のインデックスドキュメントが表示されます。

状況によっては、期待される動作を実現するために、ウェブブラウザのキャッシュの消去が必要になる場合があります。

ウェブサイトのパフォーマンスを向上させるために Amazon CloudFront ディストリビューションを設定し、ウェブサイトのトラフィックを確認するために使用できるログを提供することができます。詳細については、「Amazon CloudFront によるウェブサイトの高速化」を参照してください。