Ninext

Esempio con gli appunti

image.png

Questo esempio mostra come copiare del testo negli appunti. È tratto dall'esempio Copy / Paste data dell'applicazione di esempio Ninext.

function copyToClipboard(text : text) do
 #{:text navigator.clipboard.writeText(text);}#
end;

Restrizioni d'uso di navigator.clipboard.writeText()

L'API navigator.clipboard.writeText(text) è soggetta a restrizioni di sicurezza imposte dai browser. Deve essere attivata direttamente da un'interazione dell'utente (per esempio il clic su un pulsante).

Se tra l'interazione dell'utente e la chiamata a writeText() interviene un ritardo o un'elaborazione intermedia (per esempio un calcolo), il browser non considera più l'operazione come avviata dall'utente e blocca l'accesso agli appunti per prevenire abusi.

Buone pratiche:

  • Chiamate navigator.clipboard.writeText(text) direttamente all'interno di un gestore di evento utente (per esempio onclick).
  • Evitate di introdurre operazioni asincrone o ritardi tra l'azione dell'utente e la chiamata alla funzione.

Esempio corretto:

document.getElementById("copyButton").addEventListener("click", () => {
    navigator.clipboard.writeText("Copied text!")
        .then(() => console.log("Text copied successfully!"))
        .catch(err => console.error("Error copying text:", err));
});

Esempio errato (può non funzionare):

document.getElementById("copyButton").addEventListener("click", () => {
    setTimeout(() => { // Introducing a delay may prevent copying
        navigator.clipboard.writeText("Copied text!");
    }, 100);
});