如何将图像直接绘制到ImageData数组 - HTML5 / Javascript

时间:2012-02-16 04:40:11

标签: javascript image html5 canvas

我的问题:
我正在制作一个HTML5游戏,我试图通过一次绘制背景而不是每帧重绘一次来加快速度。
为此,我在画布上绘制了背景,然后尝试从中获取ImageData。不幸的是我被安全错误拦截了。无法,因为图像来自外部来源 我研究了这个,似乎这是阻止坏人窃取用户硬盘内容的“功能”。虽然我加载的这些图像不是来自硬盘驱动器。

我真的很想能够加速我的比赛。是否有解决方案绕过安全错误,甚至可能将图像直接加载到图像数据中,这样我就可以通过像素循环来绘制?

(注意:我不想弄乱用多个画布来完成工作)

谢谢,甘

1 个答案:

答案 0 :(得分:1)

没有办法解决这个问题,虽然你可以从另一个域中绘制图像,但在这种情况下使用getImageData总会引发安全错误。这是为了防止窃取敏感信息,因为网站可以生成包含基于cookie或IP地址的私人用户信息的动态图像。但是,您只需使用服务器端脚本来代理映像。

但老实说getImageDataputImageData相当慢,我不知道这会如何加速你的游戏。在我看来,您认为绘制图像数据比仅使用drawImage更快,而不是

如果你想让你的动画看起来很好看,你将不得不重新绘制所有内容,这就是动画的工作方式。