Il blog che non c’è

Vediamo come è possibile implementare una funzione per la copia automatica in clipboard del contenuto di una stringa, la cosa può tornare utile per far selezionare direttamente all’utente delle parti di testo e copiarlo senza dover usare la combinazione CTRL-C. A me è servita solo per aggiornare il mio userscript che inserisce il codice HTML valido nelle pagine di Youtube, in questo modo basta selezionare il box dove si trova il codice ed incollarlo sul proprio editor HTML , any suggestions about errors in my poor english are greatly appreciated

Usando Javascript la cosa non è possibile, molti browser infatti, impediscono, per ragioni di sicurezza, l’accesso alla clipboard via Javascript. Se ci si limitasse ad IE invece, sarebbe possibile ottenere la cosa utilizzando il solo Javascript, se si vuole invece fare una cosa cross-browser è necessario utilizzare uno script in Flash. Tutto sommato Flash è i plugin più popolare, molto probabilmente la maggioranza degli utenti lo ha installato e quindi non ci dovrebbero essere grossi problemi.

Qui di seguito riporto la tecnica da usare per implementare la funzione copyToClipboard e il metodo di utilizzo, la funzione è leggermente modificata rispetto all’originale, queste sono le modifiche che ho apportato:

• rimossa la parte di codice relativa a IE (che permette di suo di inviare testo alla clipboard), dovrebbe comunque funzionare se il plugin Flash è installato (io non ho il plugin di Flash in IE, quindi servirebbe verificarlo );
• l’originale permetteva solo la copia di testo inserito all’interno di tag INPUT (accettava l’oggetto come parametro), la mia versione invece accetta una stringa come input ;

La funzione originale è possibile l’abbiate vista all’opera su Photobucket o su Urltea (prima di capire che sfruttava Flash avevo una mezza idea di aprire un bug su Bugzilla ), quella modificata la potete vedere all’opera su questa pagina selezionando il codice della funzione inserito nel tag PRE (ho preparato una pagina a parte perchè non voglio caricare lo script sulla pagina del post).

Innanzitutto, bisogna scaricare il file _clipboard.swf, che potete trovare al link inserito a fine post. Il file è distribuito con licenza GPL (non da me ma dall’autore), quindi lo potete usare come meglio credete .

I’ve uploaded the SWF file that you can use in your own webpage.

This software is licensed under the GPL so you can take this solution, change it, whatever, free.

Una volta uploadato il file _clipboard.swf sul vostro spazio Web (non usate quello caricato sul mio server, grazie!) inserite il percorso del file nella variabile clipboardswfpath e richiamate la funzione all’interno della pagina in cui desiderate utilizzarla passandogli come argomento una stringa che verrà copiata nella clipboard del visitatore.

copyToClipboard(document.getElementById('input_id').value);

per un tag PRE (e probabilmente per quasi tutti gli altri):

oggetto=document.getElementById('id_tag_pre');
range = document.createRange();
range.selectNodeContents(oggetto);
copyToClipboard(range);

per IE usate getElementById(’mypre_id’).innerText.
Ecco la funzione:

function copyToClipboard(texttocopy)
{
	  var clipboardswfpath="indirizzo_file_SWF";
	var flashcopier = 'flashcopier';
	if(!document.getElementById(flashcopier)) {
		var divholder = document.createElement('div');
		divholder.id = flashcopier;
			document.body.appendChild(divholder);
    }
	document.getElementById(flashcopier).innerHTML = '';
	var divinfo = '<embed src="'+clipboardswfpath+'"  FlashVars="clipboard='+encodeURIComponent(texttocopy)+'" width="0" height="0"></embed>';
	document.getElementById(flashcopier).innerHTML = divinfo;
}

Purtroppo non è possibile, come da suggerimento che ho avuto su userscript.org inserire il file SWF come stringa di caratteri usando un data link, al momento i browser non supportano.

Come piccola considerazione finale, vorrei far notare a tutti quanto possa influenzare la “sicurezza” di un browser l’utilizzo di un plugin. Se, escludendo IE, nessun altro browser si fida a dare accesso in scrittura alla clipboard un motivo deve pur esserci, il fatto che avendo il plugin Flash installato si possa “raggirare” questa restrizione dovrebbe far riflettere. Certo, poter accedere alla clipboard permette alle applicazioni Web maggiori funzionalità ma a discapito, forse, della sicurezza. Rassicuro tutti, dicendo che nemmeno Flash dà accesso alla clipboard in lettura .

Ringrazio ssjx/Engelium che mi ha fatto interessare all’argomento

Fonte: Clipboard Copy.

Technorati Tags: javascript, browser, clipboard, flash