Javascript：从字节数组加载图像答案

【问题标题】：Javascript: loading image from bytearrayJavascript：从字节数组加载图像
【发布时间】：2013-03-25 06:04:20
【问题描述】：

在 Javascript 中，您有 ByteArray 类型和一些关于它的视图，如下所述： https://developer.mozilla.org/en-US/docs/JavaScript/Typed_arrays

是否可以将图像数据存储在这样的字节中，如果可以，我如何显示这样的图像？ png 还是 jpg？

【问题讨论】：

Possible duplicate

标签： javascript jquery image png jpeg

【解决方案1】：

是的，您可以使用类型化数组存储图像。

我不确定你到底想要什么。如果您想从 ByteArray 创建 HTMLImageElement，您可以执行与 here 和 here 中引用的类似的操作。

如果您想从图像中获取字节，那将更加棘手。您可以将 ImageElement 绘制到 HTML 画布，然后他们使用 toDataURL 获取 URI。

我刚刚尝试使用画布获取数据，并且成功了。

var myCanvas = document.getElementById('my_canvas_id');
var ctx = myCanvas.getContext('2d');
var img = new Image;
img.onload = function(){
    myCanvas.width = img.width;
    myCanvas.height = img.height;
    ctx.drawImage(img,0,0); // Or at whatever offset you like
    alert(myCanvas.toDataURL());
};
img.src = "logo4w.png";

但是，如果您在画布上绘制的图像来自网站域之外，则 toDataURL() 方法不允许您执行此操作。

【讨论】：