Javascript toDataURL生成两个错误之一：canvas.toDataURL不是函数或无法读取属性'；toDataURL'；未定义的

我的网站中的用户上传一个配置文件图像，然后将其发送到服务器。裁剪完图像后，将其放入画布中，然后由ajax发送。要将画布转换为图像，我将使用toDataURL。问题是当我使用

convertCanvasToImage（imgData[0]）

我得到：

未捕获的TypeError:无法读取未定义的属性“toDataURL”

当我删除[0]

convertCanvasToImage（imgData）

我得到：

未捕获的TypeError:canvas.toDataURL不是函数

代码如下：

imgData = pCtx.getImageData(0, 0, 150, 100);

iEdit.callback(iEdit.processCan.toDataURL("image/" + iEdit.imageType, 
iEdit.imageQuality));

iEdit.close();
remove_profile_image = "False";
var image = $("#file-upload");
var data = imgData;
var csrftoken = jQuery("[name=csrfmiddlewaretoken]").val();
var my_canvas = document.getElementById("myCanvas");
var ctx = my_canvas.getContext("2d");
ctx.putImageData(imgData, 150, 100);
//this is either data = convertCanvasToImage(imgData[0]); or
data = convertCanvasToImage(imgData);
$.ajax({
    url: $(image).attr("data-url"),
    "csrfmiddlewaretoken": $(image).siblings("input[name='csrfmiddlewaretoken']").val(),
    type: 'POST',
    data: {
        "csrfmiddlewaretoken": CSRF_TOKEN,
        "profile_image": data
    },
    dataType: "json",
    headers: {
        "HTTP_X_CSRF_TOKEN": csrftoken
    },
    mimeType: "multipart/form-data",
    cache: false,
    success: function(data1) {
        console.log('success');
    }
});
}

这就是convertCanvasToImage函数

function convertCanvasToImage(canvas) {
var image = new Image();
image.src = canvas.toDataURL("image/png");
return image;
}

---

感谢您的帮助。

您正在将

ImageData

作为参数发送到

convertCanvasToImage

。并且没有

toDataUrl

，因为它包含原始像素

---

您需要将保存图像的原始画布作为param传递

pCtx

不是画布，而是2d上下文，您的问题不清楚如何访问画布。

尝试

var data=imgData.data

；我更喜欢一个有效的例子