使用chrome扩展在画布上显示base64图像

Question

所以我正在使用Google Chrome扩展程序，它会截取当前标签的屏幕截图，并将屏幕截图的base64字符串发送到内容脚本。下面的代码是内容脚本的来源。我的问题是，当我尝试在画布上显示屏幕截图时，没有任何显示。 response变量是base64字符串的位置。出于调试目的，我将字符串记录到控制台以确保其正常工作，并确实返回字符串。

控制台

内容脚本

    $("body").append('<canvas id="myCanvas" width="315" height="205" style="border:1px solid #d3d3d3;">');
    chrome.runtime.sendMessage({actions: "screenshot"}, function(response) {
        console.log(response);

        var canvas = document.getElementById("myCanvas");
        var context = canvas.getContext("2d");

        var img = new Image();
        img.onload = function () {
            context.drawImage(img, 0, 0, canvas.width, canvas.height);
        }
        img.src = response;
    });