S3で静的Webページ配信

July 27, 2020

静的WebページのホスティングにS3を利用する方法。

S3で新しいバケットを作成 #

作成するS3バケット名を入力し、オプションの設定は今時点で何も手を入れず作成。

Static website hosting の有効化 #

Properties > Static website hosting > Use this bucket to host a website にチェックを入れる。

パブリックアクセスブロック設定の編集 #

Permissions > Block public access > Edit を選択し Block all public access のチェックを外す。

バケットポリシーの追加 #

Permissions > Bucket Policy を選択しエディタ領域に以下内容を記述して Save 。

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

ファイルのアップロード #

Upload からファイル群をアップロードする。

ブラウザでアクセスして確認 #

Properties > Static website hosting に End point の URL が記載されているのでアクセスする。