How to serve AWS S3 file with Access-Control-Allow-Origin: * header

Question

I have a JS file in S3, which gets picked up by Cloudflare CDN, before it finally gets served on the front end. Now some of the end users have CORS error. So I want to add the Access-Control-Allow-Origin: * to this file. As far as I am aware, cloudflare will automatically pass the headers it is getting, so I am trying to figure out a way to add the header while it gets picked from S3.

https://docs.aws.amazon.com/AmazonS3/latest/userguide/cors.html#how-do-i-enable-cors

Found this guide, but I am not exactly sure how to use the JSON in it.

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "GET"
        ],
        "AllowedOrigins": [
            "http://mydoman.com"
        ],
        "MaxAgeSeconds": 3000
    }
]

Does this look right? Has anyone ever added custom headers like this while serving files from s3? Can someone suggest the correct JSON? Or something else that is needed with it?

Answer 1

Assuming the other setup pieces are correct, you want:

[
  {
    "AllowedHeaders": [
        "*"
    ],
    "AllowedMethods": [
        "GET"
    ],
    "AllowedOrigins": [
        "*"
    ],
    "MaxAgeSeconds": 3000
  }
]

This will ultimately produce the Access-Control-Allow-Origin: * header when added to the "Permissions" tab of the S3 bucket properties, in the CORS field at the very bottom.