无法获取 canvas.getContext('2d').getImageData(x,x,x,x)答案

【问题标题】：can not get canvas.getContext('2d').getImageData(x,x,x,x)无法获取 canvas.getContext('2d').getImageData(x,x,x,x)
【发布时间】：2012-04-08 17:51:08
【问题描述】：

无法获取图像数据

浏览器控制台“无法从画布获取图像数据，因为画布已被跨域数据污染。”

【问题讨论】：

我猜您在调用getImageData 之前已经从外部源中绘制了图像。你有吗？
如果您仍然遇到问题，请发布您的代码。这将有助于其他人发现问题

标签： javascript html canvas

【解决方案1】：

为了防止恶作剧，浏览器会跟踪图像数据。当您将来自不同域的图像放在画布上时，画布会“被污染”，浏览器将不再让您查看其像素。

这是防止各种 XSS/CSRF 攻击所必需的。

【讨论】：

无论来源如何，SVG 也会发生这种情况，以防止访问链接检测，但将来可能会改变。

【解决方案2】：

请参阅 Pointy 的答案以获取解释。从本地文件系统测试文件时，这可能是一个烦人的问题。在 Google Chrome / Chromium 上有一个解决方法：使用以下命令行选项调用它：

chromium-browser --allow-file-access-from-files

【讨论】：