調整base64圖像的大小在Firefox中不起作用

Question

我嘗試了許多不同的方法，但是在Firefox中，當我第一次調整大小時，它將返回空白圖像：

function imageToDataUri(img, width, height) {
 var canvas = document.createElement('canvas');
 ctx = canvas.getContext('2d');
 canvas.width = width;
 canvas.height = height;
 ctx.drawImage(img, 0, 0, width, height);
 setTimeout(function () {
   cursorimg = canvas.toDataURL();
 }, 500);
}

這是我的功能，我這樣稱呼它：

cursorImage.onload = function(){
  imageToDataUri(cursorImage, width, height);
}

Answer 1

我遇到了與您完全相同的問題，並且在“ onload”回調之外創建畫布時，該問題消失了，如下所示：

var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
canvas.width = width;
canvas.height = height;
cursorImage.onload = function(){
    ctx.drawImage(img, 0, 0, width, height);
    cursorimg = canvas.toDataURL();
}

我仍然是JavaScript的初學者，我無法解釋它為什么起作用...