javascript - 文件对象到 ImageData 的转换未产生正确的像素 (JavaScript)

Question

我正在尝试将上传的文件对象（jpg、png）转换为 JavaScript 中的 ImageData。到目前为止，我是这样做的：

var fileReaderObj = new FileReader();

fileReaderObj.onload = function (ev) {
    var fileDataURL = ev.target.result;
    var img = new Image();    

    img.onload = function(){
        var canvas = document.createElement('canvas');  
        var context = canvas.getContext("2d");
        context.drawImage(img, 0, 0, img.width, img.height);
        var imgData = context.getImageData(0, 0, img.width, img.height);
        console.log("IMGDATA PIXELS:" + imgData.data);
    }

    img.src = fileDataURL;
};

fileReaderObj.readAsDataURL(uploadedFile);

完成此操作后，我观察控制台输出以查看 imgData.data（它是图像像素值的数组）是否正确，以查看像素是否正确。但是，在观察像素之后，我意识到大约前半部分像素是正确的，而后半部分像素都是0。这很奇怪，我在想我做错了什么。任何帮助将不胜感激。谢谢你。