CORS problem

[komitoff]

Hello there, I am not sure if my issue is a real issue or more like a discussion question. I read a lot of open/closed issues, but didn't really find an answer. I am using the library in order to create screenshot of my webpage. I am running into the well known issue with CORS.

Here is my code:

domtoimage.toJpeg(document.body, { cacheBust: true } )
    .then(function (dataUrl) {
        console.log(dataUrl);
        var link = document.createElement('a');
        link.download = 'my-image-name.jpeg';
        link.href = dataUrl;
        link.click();
    link.remove();
});

When I run this simple code, in the console I am getting a lot of errors like: Access to XMLHttpRequest at 'https://some-url/blue.png?1659515343717' from origin 'http://localhost:8044' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

dom-to-image.min.js:2 cannot fetch resource: https://some-url/blue.png?1659515343717, status: 0

So I added the written option parameter cacheBust and nothing changed. I saw a lot of people are suggesting using a proxy server in order to avoid this error. But I didn't really understand what this server is supposed to do. I found some predefined proxy servers, but how can I provide a proxy server to my code ?

Thanks in advance!

[JounQin]

You should learn how CORS or proxy server works by yourself? 😅

[armaccs]

Hello. I just solved the same problem. In my case working with AWS s3. I should have only placed this configuration in the permissions (Cors)

[ { "AllowedHeaders": [ "" ], "AllowedMethods": [ "GET" ], "AllowedOrigins": [ "" ], "ExposeHeaders": [ "x-amz-server-side-encryption", "x-amz-request-id", "x-amz-id-2" ], "MaxAgeSeconds": 3000 } ]