Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Getting S3 CORS Access-Control-Allow-Origin to dynamically echo requesting domain

Tags:

cors

amazon-s3

How can I set the S3 CORS AllowedOrigin configuration such that it dynamically echos the requesting domain in the Access-Control-Allow-Origin header?

In the post, "CORS with CloudFront, S3, and Multiple Domains", it is suggested that setting AllowedOrigin to <AllowedOrigin>*</AllowedOrigin> does this. However, S3 returns Access-Control-Allow-Origin: * instead.

Access-Control-Allow-Origin: * does not work in my case as I am using image.crossOrigin = "use-credentials" in a JavaScript app. With this option, S3 returns Access-Control-Allow-Credentials: true. Cross origin access to the image then fails because using wildcard as the allowed origin in conjunction with credentials is not permitted.

Background for why this is needed:

In my setup, access to images on S3 has to go through our domain, where authentication is required to restrict access and check if an account is authorized to access the images. If it is, the server returns a 302 redirect to an S3 URL.

For the authentication to work, image.crossOrigin = "use-credentials" has to be set so that the request hits my server with the required credentials. (Incidentally, when I tested on Firefox 30.0 and Chrome 35.0.1916.153, if crossOrigin is set to anonymous, credentials are still sent. But not on Safari 7.0.4. Consistent cross-browser behavior could only be obtained using use-credentials.).

Because browsers transparently redirects to the S3 URL, credentials are also sent.

like image 349
Jason Cheow Avatar asked Jun 26 '14 07:06

Jason Cheow


People also ask

How do you solve S3 CORS file error with Access-Control allow Origin header block?

In the new (2020) S3 interface/dashboard, you need to write the header as a JSON. This code will fix the S3 Access-Control-Allow-Origin Header, allowing for GET requests from any domain. This code is placed in the Cross-origin resource sharing (CORS) section of the permissions tab for your specific bucket.

How do I fix CORS header Access-Control allow Origin missing?

If the server is under your control, add the origin of the requesting site to the set of domains permitted access by adding it to the Access-Control-Allow-Origin header's value. You can also configure a site to allow any site to access it by using the * wildcard. You should only use this for public APIs.

How do I fix a CORS error in AWS?

Confirm the cause of the error There are two ways to confirm the cause of a CORS error from API Gateway: Create an HTTP Archive (HAR) file when you invoke your API. Then, confirm the cause of the error in the file by checking the headers in the parameters returned in the API response.


1 Answers

AWS's CORS documentation does not document this, but I managed to get the answer in a thread on AWS Developer Forums, where I found that AWS changed the original behavior of echoing the requesting domain if * is being used for AllowedOrigin.

To get S3 to dynamically echo the requesting domain, AllowedOrigin has to be set as such:

<AllowedOrigin>http://*</AllowedOrigin>
<AllowedOrigin>https://*</AllowedOrigin>
like image 159
Jason Cheow Avatar answered Sep 27 '22 20:09

Jason Cheow