JavaScript:在没有 Canvas 的情况下获取 ImageData

Question

是否有可能得到 ImageData来自不在 Canvas 上但在 DOM 树中其他位置的图像的对象作为正常 <img> ？

如果是，怎么办？

Answer 1

你必须在内存中创建一个 Canvas ，然后在这个 Canvas 上绘制图像:

var canvas = document.createElement('canvas');
var context = canvas.getContext('2d');
var img = document.getElementById('myimg');
canvas.width = img.width;
canvas.height = img.height;
context.drawImage(img, 0, 0 );
var myData = context.getImageData(0, 0, img.width, img.height);

但是如果图像来自另一个域，这将不起作用。如果您无法控制服务器，这是一个您无法绕过的安全限制(请注意，如果您使用 file://打开 html 文件，您将有很多额外的限制，请使用 http://)