4

我正在开发一个图像混搭网络应用程序。
我想避免 Flash 或其他客户端的麻烦,只做纯 HTML+javascript。

为了保持轻松,我想在客户端用 Javascript 完成这项工作,并让它只是将最终保存的图像推送到服务器。

在阅读了关于 HTML5 和 Canvas 的奇迹之后,我认为我可以使用它。

麻烦的是:

  1. 如果我使用 HTML5 的新拖放功能让用户将本地图像传递给应用程序,然后将其绘制到画布上,那么……
    画布变脏了,如果我尝试保存它会引发安全异常图像数据。

  2. 如果我使用像 Bing Image search 这样的 API 来为用户查找图像并将它们绘制到画布上,那么……
    画布会变脏,如果我尝试保存图像数据,则会引发安全异常。

我能想到的唯一解决方法是让服务器充当一种代理,并让它将处理的每个图像中继到客户端——但这违背了进入客户端的目的。

有没有我没有想到的其他方法,或者客户端的纯 HTML5 + JS 不是这个用例的选项?

4

1 回答 1

2

引发安全异常是因为您使用的是来自不同域(本地或 Bing 在您的情况下)的图像,您应该让用户能够将所选图像上传到您的服务器上,然后在画布中使用它们。对于来自互联网存储的图像,您可以制作类似代理的东西以在前端显示它们,应始终上传来自用户 PC 的图像。据我所知,没有其他方法可以避免 XSS 异常。

PS这里有一篇关于HTML5画布图像限制的好文章:http: //simonsarris.com/blog/480-understanding-the-html5-canvas-image-security-rules

于 2012-08-12T10:15:40.827 回答