Clipboard API
Die Clipboard-API bietet die Möglichkeit, auf Zwischenablagebefehle (Ausschneiden, Kopieren und Einfügen) zu reagieren und asynchron Texte in die Systemzwischenablage zu lesen und zu schreiben.
Hinweis:
Verwenden Sie diese API bevorzugt gegenüber der veralteten Methode document.execCommand()
für den Zugriff auf die Zwischenablage.
Hinweis:
Diese API ist nicht verfügbar in Web Workers (nicht zugänglich über WorkerNavigator
).
Konzepte und Verwendung
Die Systemzwischenspeicher ist ein Datenpuffer, der zum Betriebssystem gehört, auf dem der Browser läuft. Er wird zur kurzfristigen Datenspeicherung und/oder zum Datentransfer zwischen Dokumenten oder Anwendungen verwendet. Er wird üblicherweise als anonymer, temporärer Datenpuffer implementiert, manchmal als Einfüge-Puffer bezeichnet, der von den meisten oder allen Programmen innerhalb der Umgebung über definierte Programmierschnittstellen zugänglich ist.
Die Clipboard-API ermöglicht es Benutzern, programmatisch Text und andere Arten von Daten in sicheren Kontexten](/de/docs/Web/Security/Secure_Contexts) in die Systemzwischenablage zu lesen und zu schreiben, sofern die Benutzer die im Abschnitt Sicherheitsaspekte aufgeführten Kriterien erfüllt haben.
Ereignisse werden infolge von cut
, copy
und paste
Operationen, die die Zwischenablage ändern, ausgelöst.
Die Ereignisse haben eine Standardaktion, beispielsweise kopiert die copy
-Aktion standardmäßig die aktuelle Auswahl in die Systemzwischenablage.
Die Standardaktion kann vom Ereignishandler überschrieben werden – weitere Informationen finden Sie in den jeweiligen Ereignissen.
Schnittstellen
Clipboard
Sicherer Kontext-
Bietet eine Schnittstelle zum Lesen und Schreiben von Text und Daten in die oder aus der Systemzwischenablage. Die Spezifikation bezeichnet dies als die 'Async Clipboard API'.
ClipboardEvent
-
Repräsentiert Ereignisse, die Informationen in Bezug auf die Änderung der Zwischenablage bereitstellen, also
cut
,copy
undpaste
Ereignisse. Die Spezifikation bezeichnet dies als die 'Clipboard Event API'. ClipboardItem
Sicherer Kontext-
Repräsentiert ein einzelnes Datenformat, das beim Lesen oder Schreiben von Daten verwendet wird.
Erweiterungen zu anderen Schnittstellen
Die Clipboard-API erweitert die folgenden APIs und fügt die aufgelisteten Funktionen hinzu.
-
Gibt ein
Clipboard
Objekt zurück, das Lese- und Schreibzugriff auf die Systemzwischenablage bietet. Element
copy
Ereignis-
Ein Ereignis, das ausgelöst wird, wenn der Benutzer eine Kopieraktion initiiert.
Element
cut
Ereignis-
Ein Ereignis, das ausgelöst wird, wenn der Benutzer eine Ausschneideaktion initiiert.
Element
paste
Ereignis-
Ein Ereignis, das ausgelöst wird, wenn der Benutzer eine Einfügeaktion initiiert.
Sicherheitsaspekte
Die Clipboard-API erlaubt Benutzern, programmatisch Text und andere Datenarten in sicheren Kontexten](/de/docs/Web/Security/Secure_Contexts) in die oder aus der Systemzwischenablage zu lesen und zu schreiben.
Die Spezifikation erfordert, dass ein Benutzer kürzlich mit der Seite interagiert hat, um von der Zwischenablage zu lesen (vorübergehende Benutzeraktivierung ist erforderlich).
Wenn die Leseoperation durch Benutzerinteraktion mit einem Browser- oder Betriebssystem-"Einfügeelement" (wie ein Kontextmenü) verursacht wird, wird erwartet, dass der Browser den Benutzer um Bestätigung bittet.
Zum Schreiben in die Zwischenablage erwartet die Spezifikation, dass der Seite die Berechtigungs-API clipboard-write
Berechtigung erteilt wurde, und der Browser kann auch vorübergehende Benutzeraktivierung erfordern.
Browser können zusätzliche Einschränkungen für die Verwendung der Methoden zum Zugriff auf die Zwischenablage auferlegen.
Browserimplementierungen haben von der Spezifikation abgewichen. Die Unterschiede sind im Abschnitt Browser-Kompatibilität erfasst, und der aktuelle Stand ist unten zusammengefasst:
Chromium-Browser:
- Lesen erfordert die Berechtigungs-API
clipboard-read
Berechtigung. Vorübergehende Aktivierung ist nicht erforderlich. - Schreiben erfordert entweder die
clipboard-read
Berechtigung oder eine vorübergehende Aktivierung. Wenn die Berechtigung erteilt wird, bleibt sie erhalten, und weitere vorübergehende Aktivierung ist nicht erforderlich. - Die HTTP Berechtigungs-Policy Berechtigungen
clipboard-read
undclipboard-write
müssen für<iframe>
Elemente, die auf die Zwischenablage zugreifen, erlaubt sein. - Kein persistentes Einfügeaufforderungsfenster wird angezeigt, wenn eine Leseoperation durch ein Browser- oder Betriebssystem-"Einfügeelement" verursacht wird.
Firefox & Safari:
- Lesen und Schreiben erfordern eine vorübergehende Aktivierung.
- Das Einfügeaufforderungsfenster wird unterdrückt, wenn Inhalte aus derselben Quelle gelesen werden, jedoch nicht für fremde Inhalte.
- Die
clipboard-read
undclipboard-write
Berechtigungen werden von Firefox oder Safari nicht unterstützt (und sind nicht geplant, unterstützt zu werden).
Firefox Web-Erweiterungen:
- Das Lesen von Text ist nur für Erweiterungen mit der Web-Erweiterung
clipboardRead
Berechtigung verfügbar. Mit dieser Berechtigung benötigt die Erweiterung weder eine vorübergehende Aktivierung noch eine Einfügeaufforderung. - Schreiben von Text ist im sicheren Kontext und mit vorübergehender Aktivierung verfügbar. Mit der Web-Erweiterung
clipboardWrite
Berechtigung ist keine vorübergehende Aktivierung erforderlich.
Beispiele
Zugriff auf die Zwischenablage
Auf die Systemzwischenablage wird über das globale Navigator.clipboard
zugegriffen.
Dieses Snippet holt den Text aus der Zwischenablage und fügt ihn dem ersten Element hinzu, das mit der Klasse editor
gefunden wird.
Da readText()
einen leeren String zurückgibt, wenn die Zwischenablage kein Text ist, ist dieser Code sicher.
navigator.clipboard
.readText()
.then(
(clipText) => (document.querySelector(".editor").innerText += clipText),
);
Spezifikationen
Specification |
---|
Clipboard API and events # clipboard-interface |
Clipboard API and events # clipboard-event-interfaces |
Clipboard API and events # clipboarditem |
Browser-Kompatibilität
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