我如何从另一个网站“getImageData”？ SECURITY_ERR：DOM 异常 18答案

【问题标题】：How can i "getImageData" from another website? SECURITY_ERR: DOM Exception 18我如何从另一个网站“getImageData”？ SECURITY_ERR：DOM 异常 18
【发布时间】：2012-03-25 10:30:30
【问题描述】：

我正在开发一个在线应用程序来处理图像。使用本地文件（在服务器上）执行此操作时效果很好，但是一旦我尝试使用另一个源它就会中断。原因似乎是安全限制，来自whatwg：

每当使用其他正确参数调用原始清除标志设置为 false 的画布元素的 2D 上下文的 getImageData() 方法时，该方法必须引发 SECURITY_ERR 异常。

所以我想知道我能以某种方式解决这个问题吗？图片全部来自google API，如果可以的话，我真的很想跳过保存图片。

谢谢。

【问题讨论】：

HTML5 Canvas getImageData and Same Origin Policy的可能重复
不是真的重复，他正在尝试子域，我想要另一个域，并且我浏览了有关该主题的许多其他问题，但没有一个答案有帮助。

标签： javascript html canvas

【解决方案1】：

由于您可能无法访问从中提取源图像的服务器，因此最好的办法是通过您的服务器代理文件。

本质上，您向您的服务器发送一个 AJAX 请求，其中包含您想要从中获取数据的图像的 URL。您的服务器收到请求并代表您请求图像。当它获得文件时，它会 base64 对其进行编码并将数据发送回给您。由于图像数据只是一个字符串，您可以从中创建一个图像对象并通过canvas 对其进行操作，而无需担心原始域。

如果你愿意使用 jQuery，这里有一个很棒的插件可以做到这一点：http://www.maxnov.com/getimagedata/

我以前使用过这个特殊的插件，效果很好。我会注意到您应该（必须）在您自己的服务器上托管代理服务器代码。您可以使用作者的appspot 帐户，但它仅限于每天的一些查询次数，并且经常用完。作者在这里解释了如何自己托管代理代码：http://www.maxnov.com/getimagedata/#using-your-own-server

【讨论】：

谢谢，我之前遇到过，但还没来得及尝试，会研究一下。