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
ClipboardContexte 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".
ClipboardEventContexte sécurisé-
Représente les évènements fournissant l'information relative à la modification du presse-papiers, qui peut être l'évènement
cut,copyoupaste. La spécification s'y réfère avec le terme "Clipboard Event API". ClipboardItemContexte 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