ぎょりの魚醤日記ʚ( ˙ ꒳ ˙ )ɞ

ITを中心に営業・技術・マーケティング・広報を学ぶヤツのブログ、というよりメモ帳。

Amazon S3を使って独自ドメインでWebサイトをホストする

梅雨っぽくなってきました。

シャワーを浴びてもすぐに汗ばむ...雨は好きですがこんだけ降るとちょっと萎えるぎょりです。

 

さて、今日はAWSのサービスの中でも私が一番好きなAmazon S3を利用してWebサイトをホストする、をテーマにします。

S3の説明はさておき、手順としては簡単と思いきやちゃんと下調べしてからじゃないとはまりそう。。

 

まずはホストしたいWebサイトのドメインを決めます。

※()内は例

(S3はルートドメインでもホストできるので大丈夫です!!)

今回はサブドメイン有りのWebサイト(www.example.com)をホストする手順を説明します。

 

まず、対象のドメイン(www.example.com)と同じ名前のバケット(www.example.com)を用意します。

 

バケットの「Properties」の「Static Website Hosting」をクリック

初期では「Do not enable website hosting」が選択されていますので、「Enable website hosting」を選択します。

「Index Document」はサイトにアクセスしたときに最初に表示させる画面となりますのでWebサイトのトップページなどを指定すると良いです。

今回は「index.html」を指定しました。

f:id:Nagafuchi:20130616135406p:plain

 指定できたら右下の「Save」をクリックして保存します。

 

次に、このままでは自分しか対象のS3バケットにアクセスできる権限を持っていないので、誰でもアクセスできるように"Permissions"を修正します。

バケット内のファイル1つずつにポリシーを設定することもできますが、大量ファイルにいちいちポリシーを設定するのは面倒です。

BucketのPolicyに権限設定をしておけば、そのBucket内のファイルは全て同様のポリシーが適用されるようになりますのでこちらを利用するのが吉。

Propertiesの上部の「Permissions」を選択します。

f:id:Nagafuchi:20130616135632p:plain

「Edit bucket policy」をクリックするとバケットポリシーを入力する画面がピョッと表示されますので下記のポリシーを記載します。

{
  "Version":"2008-10-17",
  "Statement":[{
	"Sid":"PublicReadForGetBucketObjects",
        "Effect":"Allow",
	  "Principal": {
            "AWS": "*"
         },
      "Action":["s3:GetObject"],
      "Resource":["arn:aws:s3:::example-bucket(※ここに自分のbucket名を入力)/*"
      ]
    }
  ]
}

はい、誰でもアクセスできるようになりました。良かったね。

 

次はDNSの設定です。

まず、いろいろ設定したS3の「Properties」の「Static Website Hosting」を再度開きます。ここに書かれている「Endpoint」(www.example.com.s3-website〜とか書いてあるやつ)をコピります。

f:id:Nagafuchi:20130616134519p:plain

Route53のページに遷移します。

自分のドメイン(example.com)の「Hosted Zone」を作成し、詳細設定画面に遷移します。

「Create Recort Set」をクリックして、下記のように設定します。

Name: サブドメインを入力(www)

Type: Aレコードを指定

Alias: Yesをオン

Alias Targetにカーソルを持って行くと先ほど自分で作成したs3のbucket(www.example.com)のEndpointがターゲットに表示されますのでそれを指定

f:id:Nagafuchi:20130623174445p:plain

指定し終わったら「Save Record Set」をクリックして保存。

 

ここまでできたらブラウザで自分のドメイン(http(s)://www.example.com)にアクセス!!

f:id:Nagafuchi:20130616135055p:plain

もう少しマシな画面を用意しろ、というツッコミは無しでお願いします。

ちゃんと表示されましたね。

ポイントは「バケット名とドメイン名は同じにすること」です。

 

次はルートドメイン(example.com)でのWebサイトホストの方法を投稿します。