Local pictures are fine. Online pictures will prompt the canvas to be contaminated. If you see what they say, setting crossOrigin will prompt the picture to cross-domain.
canvas = this.mycanvas;
ctx = canvas.getContext("2d");
const img = new Image();
img.src = backgroundImg;
img.onload = function () {
//...
}
//
//canvas.toDataURL("image/png");:
//Failed to execute "toDataURL" on "HTMLCanvasElement": Tainted canvases may not be exported.
canvas = this.mycanvas;
ctx = canvas.getContext("2d");
const img = new Image();
//img.crossOrigin = "";
// img.crossOrigin = "Anonymous"
// img.setAttribute("crossOrigin","anonymous");
img.setAttribute("crossOrigin", "Anonymous");
img.src = backgroundImg;
// img.src = "./sees.png";//
img.onload = function () {
//...
}
//setAttribute:
//Access to image at "http://....png" from origin "http://localhost:8080" has been blocked by CORS policy: No "Access-Control-Allow-Origin" header is present on the requested resource.