I'm trying to get image from amazon s3 bucket using the following code:

const downloadImg = (imgurl, name) => {
      console.log(imgurl);
      fetch(imgurl, {
        method: 'GET',
        headers: {}
      })
        .then(response => {
          response.arrayBuffer().then(function(buffer) {
            const url = window.URL.createObjectURL(new Blob([buffer]));
            const link = document.createElement('a');
            link.href = url;
            link.setAttribute('download', `${name}.svg`);
            document.body.appendChild(link);
            link.click();
          });
        })
        .catch(err => {
          console.log(err);
        });
    };

This is the error that I'm getting: Access to fetch at 'https://***.amazonaws.com/withText/2022/punkhealth.svg' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

I have the following CORS config in s3 bucket:

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "GET",
            "HEAD"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": [
            "Access-Control-Allow-Origin"
        ]
    }
]

How can this error be fixed? Also, the url is accessible via postman.