Come si può incollare le immagini in una Web App? Quali soluzioni sono disponibili? HTML 5 Canvas?

Question

Al momento sto costruendo un'applicazione web ossa molto nude, che ha avuto il requisito di essere in grado di copiare un'immagine mentre broswing il web, e poi incollarla sulla mia pagina.

So che questo tipo di funzionalità è possibile - come ho incollato le immagini in Gmail durante la scrittura dei messaggi, e in Tumblr (credo che usano TinyMCE come editor)

.

Dopo una lunga ricerca -. Sono stato rattristato dalla scarsa qualità di spiegazione per le soluzioni disponibili là fuori

Questo è quello che ho raccolto:

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

Verifica l'oggetto evento, sembra che i dati è incluso solo quando v'è un testo (in Chrome comunque).

Sono consapevole del fatto che IE ha un oggetto clipboardData che consente di accedere ai contenuti degli appunti.

Ho sentito anche di possibili soluzioni che utilizzano Flash, applet Java e HTML 5 Canvas -. Ma io non sono ancora stati in grado di trovare buone scrivere up che spiegano quelle soluzioni

Chiunque fatto questo con successo, e in grado di suggerire le migliori pratiche?

Answer 1

È possibile utilizzare l'API Appunti: http://dev.w3.org /2006/webapi/clipops/clipops.html

Oppure si può fare è quella di utilizzare Zero ClipBoard . Si avvale di un film invisibile Flash e fornisce un'interfaccia JavaScript per l'accesso negli Appunti.

Answer 2

Questo funziona bene in Chrome. Ecco un esempio vivo di supporto ottenere i dati delle immagini in puro JavaScript senza server coinvolti: http://strd6.com/2011/09/html5-javascript-pasting-image-data-in-chrome/