S3静的webサイトへのアクセスをCloudFront経由のみに制限する

CloudFrontのOrigin Custom HeaderとS3バケットポリシーを設定していきます。
CloudFront経由時のみに付加されるヘッダーを利用してバケットポリシーで制御する、という仕組みです。

#前提条件

今回の記事は、CloudFrontのOriginをS3の静的ホスティングエンドポイントに設定している場合について言及しておりますのでご注意ください。URLに「website」がついてる方です。

CloudFrontのOriginの指定先

○ http://bucket-name.s3-website.Region.amazonaws.com
× http://bucket-name.s3.Region.amazonaws.com

単なるS3オブジェクトの場合はこちらの記事が役に立つと思います。

#CloudFrontにOrigin Custom Headersを設定する

###該当DistributionでOrigins and Origin Groupsを選択

###Origin Custom Headersにヘッダー情報を入力

Header Name：Referer
Value：cf（任意の値）

#バケットポリシー
「パブリックアクセスをすべてブロック」がオフになっていることを確認してください。オフになっていないとバケットポリシーが適用されません。

###バケットポリシーの例
Refererヘッダーに"cf"が入っている場合のみアクセス許可

{
    "Version": "2008-10-17",
    "Id": "PolicyForCloudFrontPrivateContent",
    "Statement": [
        {
            "Sid": "Referer-Allow",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::（バケット名）/*",
            "Condition": {
                "StringLike": {
                    "aws:Referer": "cf"
                }
            }
        },
        {
            "Sid": "Referer-Deny",
            "Effect": "Deny",
            "Principal": "*",
            "Action": "s3:*",
            "Resource": "arn:aws:s3:::（バケット名）/*",
            "Condition": {
                "StringNotLike": {
                    "aws:Referer": "cf"
                }
            }
        }
    ]
}

この設定をしている状態で、各アクセスしてみると、

・bucket-name.s3-website.Region.amazonaws.com
→403エラー
・xxxxxxx.cloudfront.net
→アクセス可能

となるはずです。