Access image from aws result in a CORS error

[pepeloper]

👋 Hey! I've been getting a cors error when try to load a imagen from aws. I found a related issue with a proper solution on the croppie library itself Foliotek/Croppie#516 but I don't know how to make it fit here.

If we can find out any workaround I will try to help with a PR

[jofftiquez]

Hello @pepeloper thanks for the issue. I'll look into this, no promises tho. I've been super busy with work lately. I'd appreciate if you could come up with a PR. Thank you so much! Stay safe.

[roenfeldt]

In case anybody needs a solution to this problem: it's not related to the library, but rather to how AWS is handling the incoming HTTP requests to the stored images. You need to set up the CORS policy at the bucket level on your AWS S3 Management Console. Choose your bucket, click the Permissions tab, and then scroll all the way down to the Cross-origin resource sharing (CORS) panel.

In there, click the Edit button to the right, and create your JSON configuration. Here's an example of how I'm handling such a scenario. YMMV

[ { "AllowedHeaders": [ "*" ], "AllowedMethods": [ "GET", "PUT", "POST", "DELETE" ], "AllowedOrigins": [ "http://dev.test", "https://example.com" ], "ExposeHeaders": [] }, { "AllowedHeaders": [ "*" ], "AllowedMethods": [ "GET" ], "AllowedOrigins": [ "http://dev.test", "https://example.com", "https://www.example.com" ], "ExposeHeaders": [] } ]

It should go without saying, but I'll point it out nevertheless. This won't work unless your bucket has public access enabled.

Hope this helps.