没有画布的HTML5 getImageData [重复]答案

【问题标题】：HTML5 getImageData without canvas [duplicate]没有画布的HTML5 getImageData [重复]
【发布时间】：2012-09-18 06:58:34
【问题描述】：

有没有办法在没有画布的情况下使用图像的 getImageData ？我想在图像的鼠标位置获得像素颜色。

【问题讨论】：

标签： javascript jquery html

【解决方案1】：

不，你不能。

但是可以使用内存中的画布来获取 imageData，这既快速又简单：

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

您可以保留theData 变量，这样您就不必在每次点击时都构建它。

请注意，如果图像来自另一个域，这将不起作用（因此，如果您使用 file:// 而不是 http:// 打开 html 文件，它将不起作用）。

【讨论】：

有趣...他们有什么理由阻止从另一个域获取图像的图像数据？
这是为了防止XSS攻击。阅读this 和this。
但是在尝试检索整数数组时可能会发生什么？
所以...并不是说getImageData 可能容易受到攻击，而是防止非法 XSS 的安全措施更像是一把大锤而不是手术刀？
getImageData 也添加了漏洞。在那种情况下，我认为他们包含它是正确的。