javascript - canvas.toDataURL 替代方案？

Question

我正在尝试将 HTML5 画布的内容转换为 png 图像。

问题是画布包含未在本地托管的图像，因此出现安全错误。

我没有在本地托管图像的选项，还有其他方法可以捕获画布元素内部的内容吗？

谢谢！

score 2 · Accepted Answer

除非您可以使您的图像资源 CORS 友好，否则不会。

尽管您可以在画布中使用未经 CORS 批准的图像，但这样做会污染画布。一旦画布被污染，您就不能再将数据拉出画布。例如，您不能再使用画布的 toBlob()、toDataURL() 或 getImageData() 方法；这样做会引发安全错误。

编辑：当然，如果您不限于纯 HTML5 方法，您可以使用一些 Flash/Crossdomain.xml 技巧，但这仍然假设您对提供图像的服务器有一定的控制权。

score 0 · Accepted Answer

猜猜在客户端没有办法解决这个问题，否则阻塞有什么意义toDataURL呢？

也许你可以有一个服务器端脚本将外部图像转发到客户端，这样浏览器就不会知道它来自另一个域。（无论如何都不需要，因为您不能从服务器端使用浏览器的凭据）

只需将图像 url 作为 get 参数发送，当然，根据图像文件修改 content-type 标头，然后将所有这些字节散布在响应内容上。

score 0 · Accepted Answer

0

如果你不反对使用 jQuery 这个插件，我会做的。

于 2012-10-16T00:13:25.693 回答

3 回答 3