はじめに

最近、Route53でドメインを作成してみたので、試しに、S3の静的ホスティングを試してみようと思いました。　

方法

S3のバケットを静的ホスティング設定する

S3バケットの作成

まず、S3のバケットを作成します。

※バケット名は、ドメイン名と同じ名前でないと正しくルーティングされません。

作成時にパブリックアクセスをブロックするか聞かれますが、チェックを外して、ブロックしないように設定してください。

静的ホスティングの設定

作成が完了したら、当該バケットのプロパティページを開いて、Static website hostingを選択します。

このバケットを使用してウェブサイトをホスティングするを選択します。
そして、今回は「インデックスドキュメント」のみ設定します。
index.htmlと入力して、保存ボタンをクリックします。

バケットポリシーの作成

静的配信を行うために、設定を行う必要があります。
バケットのアクセス権限のタブを開いて下記の設定を行います。

設定するバケットポリシー

 {
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:GetObject"
            ],
            "Resource": [
                "arn:aws:s3:::ここにバケット名を記載/*"
            ]
        }
    ]
}

リソースの"arn:aws:s3:::ここにバケット名を記載/*"の部分は自分のバケット名に変更してください。

index.htmlの作成

アクセスされた際に表示される、「index.html」ファイルを作成します。

index.html

<!DOCTYPE html>
<html lang="ja">
<meta charset="utf-8">
<head>
    <title>ウェブサイトのホームページ</title>
</head>
<body>
  <h1>ようこそ！</h1>
  <p>S3で静的ホスティング!</p>
</body>
</html>

オブジェクトをアップしたら、正しく静的配信されているか確認してみましょう。
下記のように表示されていた場合は、正しく設定出来ています！

Route53でルーティングを設定

AWSマネジメントコンソールでRoute53のページを開き、左のメニューからホストゾーンを選択します。
ルーティングを行いたいドメイン名を選択します。

※ドメインを取得していない、場合は、取得してください。

レコードの作成

レコードの作成をクリックします。

今回は、シンプルルーティングを選択します。
その後、シンプルなレコードを定義をクリックします。

今回は、サブドメインを設定するわけでは無いので、レコード名は空白にします。

値/トラフィックのルーティング先は「S3ウェブサイトエンドポイントへのエイリアス」を選択します。
その次に、リージョンはS3のバケットを作成したリージョンを選択します。
選択できるバケットが存在する場合は、プルダウンに表示されるので、選択します。

レコードタイプは「A - IPv4アドレスと一部のAWSリソースにトラフィックをルーティングします。」を選択します。
今回、ターゲットのヘルスを評価は不要なので、チェックを外します。

レコードの情報を入力する事ができれば、右下のレコードを作成をクリックします。

最後に

設定が完了したら、先ほど登録したレコード名にアクセスしてみましょう！

S3のindex.htmlの内容が表示されると思います！

これで、S3で簡単にウェブページをホスティングする事ができました！