Golang : AWS CORS issue while using Presigned URL on Frontend UI even though bucket policy is set

Question

Hi Team We are facing similar issue . Issue: Even though CORS policy is set . When we use the generated Presigned URL in frontend  we ended up with CORS error We already did the below:

CORS policy is set for S3 bucket as below:
```
rule := types.CORSRule{
		AllowedHeaders: []string{"*"},
		AllowedOrigins: []string{"*"},
		AllowedMethods: []string{"GET", "HEAD"},
		ExposeHeaders:  []string{"Access-Control-Allow-Origin"},
	}
	_, err := c.s3.PutBucketCors(ctx, &s3.PutBucketCorsInput{
		Bucket: aws.String(name),
		CORSConfiguration: &types.CORSConfiguration{
			CORSRules: []types.CORSRule{rule},
		},
	})
```
We are generating Pre-signed URL which for our images . It also seems to be working fine . Because when we put the presigned url in browser , it downloads the image .
We are able to see the presigned images on frontend but while downloading it ended up with CORS error.
Can you please guide us , what can be the issue here?

Answer

Wow, it sounds frustrating.
There are additional things that I would check on CORS usage.

* CORS Policy Propagation Delay: After setting or updating a CORS policy on an S3 bucket, there might be a short delay before the new settings take effect. If you've just updated the CORS policy, it may be worth waiting a few minutes and then trying again.
* 
* Browser Cache: Browsers often cache CORS policies for efficiency. If you've recently changed the CORS policy for your S3 bucket, the browser might still be using the cached policy. Try clearing your browser's cache or testing the request in a private/incognito window to see if the issue persists.
* 
* HTTP vs HTTPS: Ensure that the scheme (http or https) of the presigned URL matches the scheme of your application's frontend. Mismatches here can lead to CORS errors.
* 
* Presigned URL Generation: When generating the presigned URL, make sure that the HTTP method specified matches the method used in the frontend request. For example, if you're generating a presigned URL for a GET request, the frontend should also use a GET request to fetch the resource.
* 
* Content-Disposition Header: If your application involves downloading the file (as opposed to displaying it in the browser), ensure that the Content-Disposition header is set correctly in the S3 object metadata to indicate that the browser should download the file rather than displaying it. You can set this either when you upload the file to S3 or by updating the metadata of an existing object.
* 
* Check the Actual Error Message: The actual CORS error message in the browser's console can provide clues. For instance, if the error mentions a missing Access-Control-Allow-Origin header, the issue is likely with the CORS policy. If it mentions a disallowed method, the issue could be with the presigned URL's HTTP method.
* 
* Inspect Network Requests: Use the browser's developer tools to inspect the network request that's failing. Check the request headers, especially the Origin header, and ensure it matches one of the allowed origins in your S3 bucket's CORS policy (in your case, it's a wildcard *, so this should not be the issue).
* 
* Verify the Request Method: Ensure that the request method used in your frontend matches the allowed methods in your CORS policy. For example, if your frontend is making a POST request with the presigned URL, it will fail because your CORS policy only allows GET and HEAD.

Golang : AWS CORS issue while using Presigned URL on Frontend UI even though bucket policy is set

Relevant content