7

I am uploading files from my react app to S3 using Pre Signed URLs the Bucket it self is private and only enabled CORS for all domains (for the dev env).

How ever when the axios post tries to upload a file i am seeing the No "Access-Control-Allow-Origin" header present Error. The pre-flight options request is throwing this error.

I am trying this from my local machine.

Here is the CORS Configuration i have. I have tried the wild card '*' for AllowedOrigin with no luck.

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>http://localhost:3000</AllowedOrigin>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <MaxAgeSeconds>300000</MaxAgeSeconds>
    <AllowedHeader>authorization</AllowedHeader>
</CORSRule>
</CORSConfiguration>

Appreciate any help.

Sateesh K
  • 1,071
  • 3
  • 19
  • 45

2 Answers2

0

There is a chance that the service that is creating the pre-signed url isn't valid. In my scenario the bucket was on eu-centar-1 but the pre-signed-key had us-east-1 in the url. I fixed my service for creating the pre-signed-key and it worked. It wasn't connected to origin. Check if this is ok in your scenario

Marko Stojkov
  • 16
  • 1
-1

I was running into this issue and added an explicit Content-Type header with a value of application/octet-stream. I got this solution from referencing this post on uploading to s3 with a presigned url using axios.

Ryan Jackson
  • 1