Как вставить изображения в веб-приложение?Какие решения доступны?HTML 5 Canvas?

Question

В настоящее время я создаю очень голое веб-приложение, в котором требовалось иметь возможность копировать изображение при просмотре в Интернете, а затем вставлять его на мою страницу.

Я знаю, что этот типфункциональности возможно - я вставил изображения в gmail при написании сообщений и в Tumblr (я думаю, что они используют TinyMCE в качестве редактора).

После долгих поисков - меня опечалило низкое качествообъяснения доступных решений.

Это то, что я собрал:

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

Изучая объект события, кажется, что данные включаются только при наличии текста (вChrome в любом случае).

Мне известно, что в IE есть объект clipboardData, который дает вам доступ к содержимому буфера обмена.

Я также слышал о возможных решениях с использованием Flash, Java-апплетов и HTML5 Холст, но я пока не смог найти хороших статей, объясняющих эти решения.

Кто-нибудь сделал это успешно, и может предложить лучшие практикицы?

Answer 1

Это прекрасно работает в Chrome. Вот живой пример, поддерживающий получение данных изображения в чистом JavaScript без участия серверов: http://strd6.com/2011/09/html5-javascript-pasting-image-data-in-chrome/

Answer 2

Вы можете использовать API буфера обмена: http://dev.w3.org/2006/webapi/clipops/clipops.html

Или вы можете использовать Zero ClipBoard .Он использует невидимый Flash-ролик и предоставляет интерфейс JavaScript для доступа к буферу обмена.