从base64 JPEG图像创建canvas imageData，而不使用图像对象

Question

我在将JPEG base64图像读入canvas imageData时遇到问题。生成的画布图像使用黑白像素（垃圾图像）乱码。

我想在不使用图像对象或任何其他BLOB的情况下实现此目的。

通过fileReader读取base64 JPEG图像数据并尝试创建画布图像。

var img, bytes, arr, bytes, binary_string,i, uri = base64String;
img = context.createImageData(400, 300);                
binary_string =  window.atob(uri.slice(uri.indexOf(',')+1));
arr = binary_string.split('').map(function (e) {return e.charCodeAt(0);});
bytes = new Uint8ClampedArray(arr);
for (i=0; i<bytes.length; i+=1) {
   img.data[i] = bytes1[i];
}

请分享您的想法和经验。

提前致谢。