Amazon S3 images access denied when CORS policy set correctly

[richard10]

Hi there

I’ve set up an amazon s3 bucket for all our web resources and have worked out the hardest parts of configuring bubble to push data into and out of the the Amazon S3 API. This was non-trivial.

I have now reconfigured our s3 bucket not to be open to the world but instead to have a Cross Origin Resource Sharing policy allowing access to https://myapp.bubbleapps.io in my amazon CORS settings.

When I attempt to consume my S3 files in HTML or using any bubble components, the image files don’t show, and inspecting the results in Chrome shows that amazon is giving a 403 Access Denied.

I am pretty confident I have configured my S3 correctly to allow access to the files within the right part of my bucket to be read when the referring site is https://myapp.bubbleapps.io

I could open that part of my bucket up to public read but I only really want to be able to consume that content from within my bubble app.

has anyone faced this issue before and how did you resolve it?

Thanks
Richard

[simon7]

Not a direct answer to your question, but you could use signed urls instead. I would argue that would be safer as you could keep your bucket locked down.

[richard10]

Cheers, if I don’t get a true solution that’s where I’ll head next. Thanks.

[simon7]

Your welcome
Another solution that came to mind is to use cloudfront + S3. Cloudfront can cache the data, making each request cheaper and faster, plus your bucket will still be locked down completely.

For your original request, have you followed the steps provided here?: AWS S3 Cors