从 获取 byte[]

我有一个 html 画布，如下所示：

//output is a base64string of image data
var oldImage = new Image();
oldImage.onload = function () {
  var resizeRatio = oldImage.width / 500;
  var height = oldImage.height / 2;
};
oldImage.src = output;
var standardizedCanvas = document.createElement("canvas");
standardizedCanvas.setAttribute("width", "500px");
standardizedCanvas.setAttribute("height", height + "px");
standardizedCanvas.getContext("2d").drawImage(oldImage, 0, 0, frontCanvas.width, frontCanvas.height);

这样我就可以将图像读入画布，然后获取图像数据。但这真正给了我什么？我需要一个byte[]来自画布，其中包含图像数据，所以我真的想转换base64串成一个byte[]。我走在正确的道路上吗，或者……？

Calling getImageData返回一个ImageData object.

文档：

https://developer.mozilla.org/en-US/docs/Web/API/ImageData https://developer.mozilla.org/en-US/docs/Web/API/ImageData

https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/getImageData https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/getImageData

The data的财产ImageDataobject 是一个长度为 4*width*height 的字节数组。

像素从左上到右下一次排列为一行，每个像素由 4 个字节表示：红色、绿色、蓝色和 alpha。