i have the code shown below and it show the promise was rejected, how do i fix this issue?

async function toDataURL(url) {
    const blob = await fetch(url).then(res => res.blob());
    return URL.createObjectURL(blob);
}
console.log(dl('https://static1.e621.net/data/d4/07/d40742e2ec797eb810e9e40ad3afd523.png?login=rssaromeo&api_key=${mykey}'))

async function dl(u) {
    const a = document.createElement("a");
    a.href = await toDataURL(u);
    a.download = "myImage.png";
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
}

If you're using this in a browser, you're probably running into a CORS issue.

I might be wrong, but I don't think you actually need to authenticate to download the image either, only for the API itself.

faucet said:
If you're using this in a browser, you're probably running into a CORS issue.

I might be wrong, but I don't think you actually need to authenticate to download the image either, only for the API itself.

would there be any way for me to fix the CORS problem. also i've had no problem with creating an image element on my page which displays that image, why does that not also run into a CORS issue?

kora_viridian said:
When your code fails, what does the Network tab in your browser console say? It should at least show the outgoing request for the fetch(). If e621 is returning a HTTP 5xx error for the request, you should be able to see that there too.

See if there are any errors or warnings in the browser console. Most pages have a few warnings but errors should be rarer. See if any of them seem to be related to your code.

Does your code work if you try a rated "safe" image, like https://static1.e621.net/data/b5/90/b590959363fc38fda82a52dc3fc1fed9.jpg , or do you have the same problem?

If you open a new private tab in your browser, and go to https://static1.e621.net/data/d4/07/d40742e2ec797eb810e9e40ad3afd523.png in that tab, does the image load? If so, you know that e621 is willing to serve that image to you, under some set of conditions. If not, then the problem isn't your code.

it loads just fine in private mode, but the safe image also has the same error
also i can't use devtools rn because i am currently on mobile.
error looks like this:

Promise
[[PromiseStatus]]:rejected
[[PromiseValue]]:TypeError
stack: "TypeError: Failed to fetch
    at toDataURL (http://localhost:8158/imgdltest.html:25:24)
    at dl (http://localhost:8158/imgdltest.html:32:20)
    at http://localhost:8158/imgdltest.html:28:13"
message: "Failed to fetch"
__proto__:TypeError
constructor:(){...}
name:TypeError
message:""