Obtenir le contenu actuel du presse-papiers? [fermé]


107

J'aimerais connaître un moyen de faire en sorte que mon script détecte le contenu du presse-papiers et le colle dans un champ de texte lorsque la page est ouverte, sans intervention de l'utilisateur. Comment ceci peut être fait?


Vous ne pouvez pas vraiment savoir ce qu'il y a dans le presse-papiers d'un utilisateur, sauf si vous avez utilisé une sorte de backend flash lors de la copie du texte. ------- Mise à jour: Une réponse plus correcte ici
Naftali aka Neal



Réponses:


73

window.clipboardData.getData('Text')fonctionnera dans certains navigateurs. Cependant, de nombreux navigateurs où cela fonctionne inviteront l'utilisateur à savoir s'il souhaite ou non que la page Web ait accès au presse-papiers.


17
Cela fonctionnera-t-il dans n'importe quel navigateur autre qu'Internet Explorer?
Anderson Green

6
Probablement pas. Voir cette question: stackoverflow.com/questions/400212/…
Dave

7
Vous pouvez vérifier la compatibilité ici caniuse.com/#search=clipboardData
Sergey Novikov

1
Une meilleure solution est d'obtenir par l'objet node, mais pas par l'objet window. Voir ici
rplaurindo

Je m'inquiète pour Keepass et sa sécurité. L'application me permet de copier mes mots de passe dans le presse-papiers.
René Winkler

69

Utilisez la nouvelle API de presse-papiers , via navigator.clipboard. Il peut être utilisé comme ceci:

navigator.clipboard.readText()
  .then(text => {
    console.log('Pasted content: ', text);
  })
  .catch(err => {
    console.error('Failed to read clipboard contents: ', err);
  });

Ou avec la syntaxe asynchrone:

const text = await navigator.clipboard.readText();

Gardez à l'esprit que cela invitera l'utilisateur avec une boîte de dialogue de demande d'autorisation, donc aucune activité amusante possible.

Le code ci-dessus ne fonctionnera pas s'il est appelé depuis la console. Cela ne fonctionne que lorsque vous exécutez le code dans un onglet actif. Pour exécuter le code depuis votre console, vous pouvez définir un délai d'expiration et cliquer rapidement dans la fenêtre du site Web:

setTimeout(async () => {
  const text = await navigator.clipboard.readText();
  console.log(text);
}, 2000);

En savoir plus sur l'API et son utilisation dans la documentation des développeurs Google .

Spec


18
Notez que cela entraîne toujours une erreur lorsqu'il est appelé depuis la console. Mais il fait le travail sur une action directe de l' utilisateur, comme lorsque vous appuyez sur un bouton sur la page.
Klesun

cela semble ne renvoyer que du texte brut ... même lorsque du texte enrichi est dans le presse-papiers. comment puis-je l'obtenir? \
Michael

@Michael, la prise en charge des images et autres vient d'être ajoutée dans la dernière version de Chrome (76)
iuliu.net

Vous pouvez tester dans la console en enveloppant dans un setTimeout, puis en cliquant à nouveau sur la page.
edbentley

18

Vous pouvez utiliser

window.clipboardData.getData('Text')

pour obtenir le contenu du presse-papiers de l'utilisateur dans IE. Cependant, dans un autre navigateur, vous devrez peut-être utiliser flash pour obtenir le contenu, car il n'y a pas d'interface standard pour accéder au presse-papiers. Peut-être pouvez-vous essayer ce plugin Zero Clipboard


1
le lien fonctionne bien (encore)
stephanos

5
ZeroClipboard vous permet uniquement de copier dans le presse-papiers, pas de lire à partir de celui-ci.
DSimon

4

La suite vous donnera le contenu sélectionné ainsi que la mise à jour du presse-papiers.

Liez l'ID d'élément avec l'événement de copie, puis obtenez le texte sélectionné. Vous pouvez remplacer ou modifier le texte. Obtenez le presse-papiers et définissez le nouveau texte. Pour obtenir la mise en forme exacte, vous devez définir le type sur "text / hmtl". Vous pouvez également le lier au document au lieu de l'élément.

document.querySelector('element').bind('copy', function(event) {
  var selectedText = window.getSelection().toString(); 
  selectedText = selectedText.replace(/\u200B/g, "");

  clipboardData = event.clipboardData || window.clipboardData || event.originalEvent.clipboardData;
  clipboardData.setData('text/html', selectedText);

  event.preventDefault();
});

21
Bienvenue sur ce site! Je suis heureux que vous contribuiez en répondant à une question. Mais sachez que votre réponse ne répond pas vraiment à la question du PO. La question consiste à récupérer le contenu du presse-papiers et à le coller quelque part lors de l'ouverture d'une page. De plus, comme la question n'a pas de balise jquery , les réponses avec jQuery doivent contenir une note indiquant qu'une bibliothèque (jQuery) est utilisée.
KarelG
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.