不特定多数のアクセス許可していたS3がCORSでアクセスできなかった話

Javaの勉強の合間にUnity製ゲームのWebGL公開の検証をやっていたのですが、その際にS3の設定で詰まっていた話です。

起きた現象

EC2でホスティングしていた自サイト側からS3のファイルをGETリクエストしようとすると失敗する。
- エラーメッセージにはCORS header 'Access-Control-Allow-Origin' missingと表示される。
S3は以下の設定である
- アクセス許可: 公開
- ブロックパブリックアクセス: パブリックアクセスをすべてブロック＝オフ
- バケットポリシー: 以下の通り

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

原因

Cross-Origin Resource Sharing (CORS)でOriginに制限がかかっていた。

S3では特定ドメインを指定してアクセス制御が可能になっており、かなり前に記述した設定が残っていた為、CORSのエラーが発生していました。

実際のS3のCORS設定値

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "GET"
        ],
        "AllowedOrigins": [
            "http://localhost*",
        ],
        "ExposeHeaders": [],
        "MaxAgeSeconds": 3000
    }
]

↑の記述だとAllowedOriginsにlocalhostが指定されているので、Originがlocalhostの場合しかアクセス許可されません。その為、EC2でホスティングされた状態のWebサイトからアクセスできなかった訳ですね。

AllowedOriginsにワイルドカード(*)を指定するのはホビー用途とはいえセキュリティ的に宜しくないので、EC2用のドメインを指定して解決しました。

なお、CORSで指定できる各種パラメータの詳細は下記AWSドキュメントを参照下さい。

https://docs.aws.amazon.com/ja_jp/AmazonS3/latest/userguide/ManageCorsUsing.html#cors-max-age