Php 在Base64中传递html5画布值时出现问题

嗨，我正在创建优惠券生成器。。。 在本文中，我将通过html表格代码显示优惠券的预览。。 之后，我将在画布中转换为base64_编码

    var canvas = document.getElementById("canvas");
        var ctx = canvas.getContext("2d");
        var data = "data:image/svg+xml," +
           "<svg xmlns='http://www.w3.org/2000/svg' width='437' height='262'>" +
             "<foreignObject width='100%' height='100%'>" +
               "<div xmlns='http://www.w3.org/1999/xhtml' style='font-size:40px'>" +
                 "<div xmlns='http://www.w3.org/1999/xhtml' style='font-size:40px'>"+$("#coupon_td").html()+"</div>" +
               "</div>" +
             "</foreignObject>" +
           "</svg>";
        var img = new Image();
        img.src = data;
        img.id = "base64_img";
        img.onload = function() { ctx.drawImage(img, 0, 0); }

        $("form").append("<input type='hidden' id='base_64_img' name='base_64_img' value='"+canvas.toDataURL()+"' />");

var canvas=document.getElementById（“canvas”）；
var ctx=canvas.getContext（“2d”）；
var data=“data:image/svg+xml，”+
"" +
"" +
"" +
“+$（”优惠券“）.html（）+”+
"" +
"" +
"";
var img=新图像（）；
img.src=数据；
img.id=“base64\u img”；
img.onload=function（）{ctx.drawImage（img，0，0）；}
$（“表格”）。附加（“”）；

---

第一次画布会空白第二次之后就没事了。。为什么会发生这种情况？？请帮助我：（

我已经在这里运行了你的代码，一切都很好。因此，唯一可能破坏你的代码的是“image.onload”。请尝试在设置“image.src”之前将其放入

像这样：

var img    = new Image();
img.onload = function() { ctx.drawImage(img, 0, 0); }
img.src    = data;
img.id     = "base64_img";

这样，在设置图像的onload回调之前，图像不可能准备好