AWS S3: CORS configuration not implementing

Viewed 101

I'm trying to download a webpage as a PDF. But images are not coming in PDF, because of this issue:

Access to image at 'https://server.s3-us-west-2.amazonaws.com/images/icon.png' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

For resolving this issue, I did the following things:

In S3 bucket CORS configuration, I've added this code-

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

In (react) frontend, I've added a attribute crossorigin="anonymous" into tag:

<img src={process.env.REACT_APP_AWS_S3_PATH + `icons/${data.displayIcon}`} crossorigin="anonymous" alt="icon"/>

Can anyone please tell me, where I'm doing wrong?

1 Answers

Did you make sure the bucket is set as public? Also S3 returns cors errors when the file you are requiring is not found

Related