如何将图像粘贴到 Web 应用程序中？有哪些可用的解决方案？HTML 5 画布？

Question

我目前正在构建一个非常简单的网络应用程序，它需要能够在浏览网络时复制图像，然后将其粘贴到我的页面上。

我知道这种类型的功能是可能的 - 因为我在写消息时将图像粘贴到 gmail 中，并粘贴到 Tumblr 中（我相信他们使用 TinyMCE 作为编辑器）。

经过长时间的搜索 - 我对现有解决方案的解释质量很差感到难过。

这是我收集到的：

$(document).bind('paste', function(e){
console.log(e);
})

检查事件对象，似乎只有在有文本时才包含数据（无论如何在 Chrome 中）。

我知道 IE 有一个 ClipboardData 对象，可以让您访问剪贴板内容。

我还听说过使用 Flash、Java Applet 和 HTML 5 Canvas 的可能解决方案 - 但我还没有找到很好的文章来解释这些解决方案。

有人成功地做到了这一点，并且可以建议最佳实践吗？

Answer 1

您可以使用剪贴板 API： http://dev.w3.org/2006/webapi/clipops/clipops.html

或者你可以做的是使用 零剪贴板. 。它使用不可见的 Flash 影片并提供 JavaScript 接口来访问剪贴板。

Answer 2

这在 Chrome 中运行良好。这是一个支持在不涉及服务器的情况下以纯 JavaScript 获取图像数据的实例： http://strd6.com/2011/09/html5-javascript-pasting-image-data-in-chrome/