AWS S3だけでウェブサイトを開設する

S3にHTMLを置くだけで、S3のみでウェブサイトが作成できます。お手軽サイト作成に便利。

AWS S3だけでウェブサイトを開設する

はじめに

Amazon AWSのS3サービスは、いわゆるオンライン上でのストレージを提供するサービスです。

基本的には自分のデータを保管したり、他のアプリなどから読み込むデータを置いたりといった使い方が多いと思いますが、その機能の一つに静的Webサービスを提供するというものがあります。

これを使うと、S3にHTMLファイルを置くだけで簡易的にウェブサイトが作成できます。

ちょっとウェブサイトを作って一時的に公開したり、テスト用途で作ったりといった使い方ができてとても便利なので解説します。

※CGIなどのスクリプトは設置できません。設置できるのは静的ウェブサイトのみです。

手順

バケットの作成

S3にログイン
「バケット」の画面から、「バケットを作成」をクリック
以下の項目を入力して、バケットを作成します。
- 「バケット名」を入力。
  - バケット名は今後一切変更できないので注意
  - この名前は作成するサイトのURLの一部にもなります
  - 独自ドメインを紐づけたい場合は、先に本記事下の「独自ドメインと紐づける」を参照してください
- 「ブロックパブリックアクセスのバケット設定」のチェックをすべてOFF
「パブリックアクセスのブロックをすべてオフにすると、このバケットとバケット内のオブジェクトがパブリックになる可能性があります。」の警告が出るが、チェックをONにして次に進む

バケットのアクセス設定

作成したバケット名をクリックし、「プロパティ」-「静的ウェブサイトホスティング」の設定で下記を設定し、変更を保存する
- 静的ウェブサイトホスティング「有効にする」
- ホスティングタイプ「静的ウェブサイトをホストする」
- インデックスドキュメント「index.html」
- エラードキュメント「error.html」
「アクセス許可」-「バケットポリシー」の設定で以下を入力し、変更を保存する（下記のexample.comの部分を最初の手順で作ったバケット名に書き換えてください）

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

ファイルの設置

作成したバケット名をクリックし、「オブジェクト」の画面で「アップロード」をクリックし、適当なindex.htmlをアップロードします。ついでにerror.htmlも何か作っておくといいかも。

動作確認

作成したバケット名をクリックし、「プロパティ」-「静的ウェブサイトホスティング」のところにURLが書かれており、これがサイトのURLとなります。クリックして、先ほどアップロードしたindex.htmlが表示されるか確認してみましょう。

独自ドメインと紐づける

独自ドメインをお持ちで、独自ドメインからS3で作ったサイトに転送したい場合は、以下の手順を実施してください。

事前設定

バケット名をドメイン名に設定する（例：example.comというドメイン名を使用する場合は、バケット名もexample.comにする）

設定

各DNSサービスのサイトに行き、DNSレコードの設定画面を開く
以下の設定でCNAMEレコードを追加する
- レコードタイプ：CNAME
- 値：S3で作成したサイトのURL（例：example.com.s3-website-ap-northeast-1.amazonaws.com）

これで独自ドメインにアクセスすると、S3のサイトが表示されるはずです。

まとめ

簡単な動作確認用のサイトならS3だけで構築できるため、ちょっとした動作確認用や内部向けサイトなどはこれでサクッと作ってしまいましょう。

参考URL

https://docs.aws.amazon.com/ja_jp/AmazonS3/latest/dev/HostingWebsiteOnS3Setup.html