Canvas is tainted due to CORS

Question

I am using an image I have downloaded which is in the same folder with the rest of my files, I view the page offline, I'm not using a server, and for some reason I get security error when I try to use getImageData(), how do I fix it?

Answer 1

Set image crossOrigin property to "Anonymous" to bypass cors.

Eg.
var img = new Image();
img.crossOrigin = "Anonymous"; // to bypass cors for imgur image link

img.src = "https://i.imgur.com/3oKRio9_d.jpg";

https://code.sololearn.com/WsyBinW9Bpa8/?ref=app