Скрипт содержимого довольно прост: отправьте все изображения и измените их источник из ответа фонового скрипта:
let imgs = document.getElementsByTagName('img');
for(let img of imgs){
chrome.runtime.sendMessage({imgsrc:img.src,imgw:img.width,imgh:img.height}, function(response) {
img.src = response.canvasurl;
});
}
Фоновый скрипт тоже прост:
chrome.runtime.onMessage.addListener(
async function(request, sender, sendResponse) {
let tmp_img = document.createElement("img");
tmp_img.width = request.imgw;
tmp_img.height = request.imgh;
tmp_img.src = request.imgsrc;
let canvas = document.createElement("CANVAS");
let ctx = canvas.getContext("2d");
canvas.width = request.imgw;
canvas.height = request.imgh;
ctx.drawImage(tmp_img, 0, 0);
sendResponse({canvasurl: canvas.toDataURL()});
});
Но просто очистите все изображения (возвращаемый URL-адрес холста - пустой холст). Есть идеи, что происходит?