API Clipboard
L'API Clipboard (en français : API Presse-papiers) fournit la possibilité de répondre aux commandes du presse-papiers (couper, copier et coller) ainsi que de lire et écrire sur le presse-papiers système de façon asynchrone. L'accès aux contenus du presse-papiers est protégé par l'API Permissions : la permission clipboard-write
est donnée automatiquement aux pages lorsqu'elles sont dans l'onglet actif. La permission clipboard-read
doit quant à elle être demandée, ce que vous pouvez faire en tentant de lire les données du presse-papiers.
Note : Cette API n'est pas disponible dans les Web Workers (elle n'est pas exposée via WorkerNavigator
).
Cette API est conçue pour remplacer l'accès au presse-papiers précédemment proposé via document.execCommand()
.
Accéder au presse-papier
Au lieu de créer un objet Clipboard
lors de l'instanciation, vous pouvez accéder au presse-papier du système avec la globale Navigator.clipboard
:
navigator.clipboard
.readText()
.then(
(clipText) => (document.querySelector(".editor").innerText += clipText),
);
Ce bout de code analyse le texte à partir du presse-papiers et l'insère après le premier élément trouvé comportant la classe editor
. Puisque readText()
(sans oublier read()
) retournent une chaîne vide si le contenu du presse-papier n'est pas textuel, ce code est sécurisé.
Interfaces
Clipboard
Contexte sécurisé-
Fournit une interface pour la lecture et l'écriture de texte et de données sur le presse-papiers du système. La spécification s'y réfère avec le terme "Async Clipboard API".
ClipboardEvent
Contexte sécurisé-
Représente les évènements fournissant l'information relative à la modification du presse-papiers, qui peut être l'évènement
cut
,copy
oupaste
. La spécification s'y réfère avec le terme "Clipboard Event API". ClipboardItem
Contexte sécurisé-
Représente un format de terme unique utilisé pour lire ou écrire des données.
Spécifications
Specification |
---|
Clipboard API and events # clipboard-interface |
Clipboard API and events # clipboard-event-interfaces |
Clipboard API and events # clipboarditem |
Compatibilité des navigateurs
api.Clipboard
BCD tables only load in the browser
api.ClipboardEvent
BCD tables only load in the browser
api.ClipboardItem
BCD tables only load in the browser
Voir aussi
-
Démonstration de l'API Async Clipboard sur Glitch (en anglais)
-
Image support for Async Clipboard article