Почему мое расширение chrome возвращает пустой холст? - PullRequest
1 голос
/ 03 августа 2020

Скрипт содержимого довольно прост: отправьте все изображения и измените их источник из ответа фонового скрипта:

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-адрес холста - пустой холст). Есть идеи, что происходит?

1 Ответ

1 голос
/ 03 августа 2020

Как указал Майкл Радионов, мне пришлось сначала позволить изображениям загружаться, но этого было недостаточно, мне также пришлось изменить его на этот формат:

chrome.runtime.onMessage.addListener(
        function(request, sender, sendResponse) {
          all_of_the_async_logic(request,sendResponse);
          return true;
        });

таким образом я мог сказать соединению, чтобы он ждал ответ (используя return true и отбрасывая asyn c в слушателе)

...