S3をWebサーバーにして静的コンテンツを公開する方法を紹介します。

  1. S3パブリック編　←コレ！
  2. S3署名付きURL編
  3. CloudFrontパブリック編
  4. CloudFront署名付きURL編　
  5. CloudFront署名付きCookie編

手順

バケットの作成

まずはバケットを作成しましょう。

マネジメントコンソールでS3のページを開きます。 バケットを作成をクリックします。

s3.console.aws.amazon.com_s3_home_region=ap-northeast-1(iPad).png

バケットの名前を入れて、リージョンを選択します。 バケット名は世界中のS3で一意である必要があります。

s3.console.aws.amazon.com_s3_home_region=ap-northeast-1(iPad) (1).png

一般公開するので、パブリックアクセスを許可する必要があるため、「パブリックアクセスをすべてブロック」のチェックを外し、「現在の設定により、・・・」にチェックを入れます。

s3.console.aws.amazon.com_s3_home_region=ap-northeast-1(iPad) (2).png

これでバケット作成は完了です。

HTMLの格納

作成したバケットを選択します。 そして、HTMLファイルをドラッグアンドドロップします。

s3.console.aws.amazon.com_s3_home_region=ap-northeast-1(iPad) (3).png

設定が色々ありますが、画面最下部のアップロードを実行します。

s3.console.aws.amazon.com_s3_home_region=ap-northeast-1(iPad) (4).png

複数ファイルやフォルダーまるごとアップロードすることも可能です。

公開する

公開する方法は2種類あります。

  • ウェブサイトエンドポイントとして公開
  • REST API エンドポイント

ウェブサイトエンドポイントと REST API エンドポイントの主な違い https://docs.aws.amazon.com/ja_jp/AmazonS3/latest/userguide/WebsiteEndpoints.html#WebsiteRestEndpointDiff

公開する（ウェブサイトエンドポイント）

バケットの設定画面の「プロパティ」タブを選択します。

s3.console.aws.amazon.com_s3_home_region=ap-northeast-1(iPad) (5).png

プロパティタブの一番下の「静的ウェブサイトホスティング」の「編集する」をクリックします。

s3.console.aws.amazon.com_s3_home_region=ap-northeast-1(iPad) (6).png

静的ウェブサイトホスティングを有効にし、インデックスドキュメントを指定します。

s3.console.aws.amazon.com_s3_home_region=ap-northeast-1(iPad) (7).png

続いて、バケットの設定画面の「アクセス許可」タブを選択し、バケットポリシーに以下のJSONを指定します。（何故かコピペが使えず、一つ一つ手入力しました。。）

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::website-2721ae93/*"
        }
    ]
}

s3.console.aws.amazon.com_s3_buckets_website-2721ae93_region=ap-northeast-3&tab=objects(iPad).png

これで設定完了です。

アクセスURLは以下となります。 http://[バケット名].s3-website.[リージョン名].amazonaws.com/

公開する（REST API エンドポイント）

こちらは方法が２つあって、

  • バケットポリシーで設定
  • アクセスコントロールリスト（ACL）で設定

バケットポリシーで設定する方法は、先程のウェブサイトエンドポイントの手順で説明した、アクセス許可の設定だけすればOKです。

アクセスコントロールリスト（ACL）する方法は、公開したいオブジェクトを選択して、「アクション」の「公開する」を選択します。

s3.console.aws.amazon.com_s3_buckets_website-2721ae93_region=ap-northeast-3&tab=objects(iPad) (1).png

アクセスURLは以下となります。 https://[バケット名].s3.[リージョン名].amazonaws.com/index.html