有没有办法在HTML 5和javascript中进行客户端图像混搭

时间:2012-08-12 09:32:53

标签: javascript html5 canvas

我正在开发一个图片mashup网络应用 我想避免闪存或其他客户端麻烦,只需要纯HTML + javascript。

为了保持清晰,我想在Javascript中在客户端进行工作,并将其最终保存的图像推送到服务器。

在阅读了HTML5和Canvas的奇迹后,我想能够使用它。

麻烦的是:

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

  2. 如果我使用像Bing Image搜索这样的API来为用户查找图像并将它们绘制到画布上,那么......如果我尝试保存图像,画布会变脏并引发安全性异常数据。
  3. 我能想到的唯一工作就是让服务器充当一种代理,让它将每个与之合作的图像转发给客户端 - 但这会破坏客户端的目的。

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

1 个答案:

答案 0 :(得分:2)

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

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