movee(モビー) オノデラのブログ

(株)movee代表。週末は自社サービスを作っています。

S3で簡易な静的ホスティングをする

htmlやcssなどの静的サイトの場合はインスタンスを使うことなく、S3とcloudfrontだけで構築できる。

実質S3のみでサイトのopenはできるが、httpsがたしかできなかったのでcloudfrontも使う必要がある。

cloudfrontのURLのみ access可にするためS3URLは access不可にする設定をする。

ざっくりメモ程度の手順を書く。

1.S3バケットを作成する

バケット名はドメイン名にしておく リージョンはap-northeast-1 ブロックパブリックアクセスをOFF 現在の設定により、このバケットバケット内のオブジェクトが公開される可能性があることを承認します。にcheck

2.default設定でバケットを作成する

3.HTMLやCSSをuploadする

4.作成後にS3bucketの設定

property tabを押すと静的ウェブサイトホスティングがあるので、有効にする インデックスドキュメントにindex.htmlなどトップページファイル名を設定 access tabを押してbucket policyの編集を押して以下を設定(ResouceのBacket-Nameは実際に作成したS3bucket名を書く

S3bucket policy

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

}

これでS3の設定はとりあえず完了だがcloudfront設定後に再度bucketPolicyなどを変更することになる。