i have seen this answer: Uncaught (in promise) DOMException: Failed to execute 'texImage2D' on 'WebGL2RenderingContext': Tainted canvases may not be loaded
it does help on local made server but i am trying to make an extension/addon so i run the script on different server and if i try to set the crossOrigin attribute to 'anonymous' it says:
Access to image at 'https://dl5zpyw5k3jeb.cloudfront.net/photos/pets/48663430/1/?bust=1596323497&width=560' from origin 'https://www.petfinder.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
my manifest:
{
"manifest_version" : 2,
"name" : "tf",
"description": "tf",
"version" : "0.2",
"content_scripts" : [
{
"matches" : [ "<all_urls>"],
"js" : ["tfjs.js", "coco-ssd.js", "content.js"]
}
]
}
my code:
const img = document.getElementByTagName('img');
img.setAttribute('crossOrigin', 'anonymous');
cocoSsd.load().then(model => {
let canvas = document.createElement("CANVAS");
let ctx = canvas.getContext("2d");
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage(img, 0, 0);
model.detect(img).then(predictions => {
ctx.strokeRect(predictions[0].bbox[0], predictions[0].bbox[1], predictions[0].bbox[2], predictions[0].bbox[3]);
}
let dataURL = canvas.toDataURL();
img.src = dataURL;
});
}
});
Ty in advance
wOxxOm said the answer:
The thing is, content scripts can't make cross-origin requests in new Chrome so you'll have to use an extension page. For example you can add an iframe to the web page, pointing to an html file inside your extension directory exposed via web_accessible_resources. That iframe will have a chrome-extension:// URL and will be able to make cross-origin requests for URLs listed in permissions