Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

Clipboard API

Die Clipboard-API bietet die Möglichkeit, auf Zwischenablagebefehle (Ausschneiden, Kopieren und Einfügen) zu reagieren sowie asynchron von und in die Systemzwischenablage zu lesen und zu schreiben.

Hinweis: Verwenden Sie diese API bevorzugt gegenüber der veralteten Methode document.execCommand(), um auf die Zwischenablage zuzugreifen.

Hinweis: Diese API ist nicht verfügbar in Web Workers (nicht über WorkerNavigator verfügbar).

Konzepte und Verwendung

Die Systemzwischenablage ist ein von dem Betriebssystem, das den Browser hostet, bereitgestellter Datenpuffer, der für die kurzfristige Datenspeicherung und/oder den Datenaustausch zwischen Dokumenten oder Anwendungen verwendet wird. Sie wird normalerweise als anonymer, temporärer Datenpuffer implementiert, manchmal als Paste-Buffer bezeichnet, der über definierte Programmierschnittstellen von den meisten oder allen Programmen innerhalb der Umgebung zugänglich ist.

Die Clipboard-API ermöglicht es Benutzern, programmgesteuert Text und andere Datenarten in und aus der Systemzwischenablage in sicheren Kontexten zu lesen und zu schreiben, sofern der Benutzer die im Abschnitt Sicherheitsüberlegungen beschriebenen Kriterien erfüllt hat.

Ereignisse werden als Ergebnis von cut-, copy- und paste-Operationen ausgelöst, die die Zwischenablage verändern. Die Ereignisse haben eine Standardaktion, zum Beispiel kopiert die copy-Aktion standardmäßig die aktuelle Auswahl in die Systemzwischenablage. Die Standardaktion kann vom Ereignishandler überschrieben werden — siehe die einzelnen Ereignisse für weitere Informationen.

Schnittstellen

Clipboard Sicherer Kontext

Bietet eine Schnittstelle zum Lesen und Schreiben von Text und Daten in oder aus der Systemzwischenablage. Die Spezifikation bezeichnet dies als 'Async Clipboard API'.

ClipboardEvent

Repräsentiert Ereignisse, die Informationen über die Modifikation der Zwischenablage bereitstellen, das sind die cut-, copy- und paste-Ereignisse. Die Spezifikation bezeichnet dies als '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 aufgeführten Funktionen hinzu.

Gibt ein Clipboard-Objekt zurück, das Lese- und Schreibzugriff auf die Systemzwischenablage bietet.

Element copy Ereignis

Ein Ereignis, das immer dann ausgelöst wird, wenn der Benutzer eine Kopieraktion initiiert.

Element cut Ereignis

Ein Ereignis, das immer dann ausgelöst wird, wenn der Benutzer eine Ausschneidaktion initiiert.

Element paste Ereignis

Ein Ereignis, das immer dann ausgelöst wird, wenn der Benutzer eine Einfügeaktion initiiert.

Sicherheitsüberlegungen

Die Clipboard-API ermöglicht es Benutzern, programmgesteuert Text und andere Datenarten in und aus der Systemzwischenablage in sicheren Kontexten zu lesen und zu schreiben.

Beim Lesen von der Zwischenablage erfordert die Spezifikation, dass der Benutzer kürzlich mit der Seite interagiert hat (transiente Benutzeraktivierung) und dass der Aufruf als Ergebnis der Interaktion des Benutzers mit einem Browser- oder OS-„Paste-Element“ (wie das Auswählen von „Einfügen“ in einem nativen Kontextmenü) erfolgt. In der Praxis erlauben Browser oft Lesevorgänge, die diese Anforderungen nicht erfüllen, während sie andere Anforderungen stellen (wie eine Berechtigung oder eine Abfrage pro Vorgang). Zum Schreiben in die Zwischenablage erwartet die Spezifikation, dass der Seite die Permissions API clipboard-write Berechtigung erteilt wurde, und der Browser kann auch transiente Benutzeraktivierung erfordern. Browser können zusätzliche Einschränkungen für die Nutzung der Methoden zur Zugriffssteuerung der Zwischenablage festlegen.

Die Implementierungen der Browser haben sich von der Spezifikation entfernt. Die Unterschiede werden im Abschnitt Browser-Kompatibilität erfasst und der aktuelle Stand wird unten zusammengefasst:

Chromium-Browser:

  • Wenn ein Lesen laut Spezifikation nicht erlaubt ist und das Dokument den Fokus hat, wird eine Anfrage zur Nutzung der Berechtigung clipboard-read ausgelöst und erfolgreich, wenn die Berechtigung erteilt wird (entweder weil der Benutzer die Aufforderung akzeptiert hat oder weil die Berechtigung bereits erteilt wurde).
  • Schreiben erfordert entweder die Berechtigung clipboard-write oder eine transiente Aktivierung. Ist die Berechtigung erteilt, bleibt sie bestehen, und weitere transiente Aktivierungen sind nicht erforderlich.
  • Die HTTP Permissions-Policy Berechtigungen clipboard-read und clipboard-write müssen für <iframe> Elemente, die auf die Zwischenablage zugreifen, erlaubt sein.

Firefox & Safari:

  • Wird ein Lesen von der Spezifikation nicht erlaubt, aber die transiente Benutzeraktivierung wird immer noch erfüllt, wird eine Benutzeraufforderung in Form eines flüchtigen Kontextmenüs mit einer einzigen Option „Einfügen“ ausgelöst (die nach 1 Sekunde aktiviert wird) und ist erfolgreich, wenn der Benutzer die Option wählt.
  • Schreiben erfordert eine transiente Aktivierung.
  • Die Einfügeaufforderung wird unterdrückt, wenn auf Inhalte der selben Herkunft in der Zwischenablage zugegriffen wird, jedoch nicht bei fremden Inhalten.
  • Die clipboard-read und clipboard-write Berechtigungen werden von Firefox oder Safari nicht unterstützt (und es ist nicht geplant, sie zu unterstützen).

Firefox Web-Erweiterungen:

  • Das Lesen von Text ist nur für Erweiterungen mit der Web-Erweiterung clipboardRead Berechtigung verfügbar. Mit dieser Berechtigung erfordert die Erweiterung keine transiente Aktivierung oder Einfügeaufforderung.
  • Das Schreiben von Text ist im sicheren Kontext und mit transiente Aktivierung verfügbar. Mit der Web-Erweiterung clipboardWrite Berechtigung ist keine transiente Aktivierung erforderlich.

Beispiele

Zugriff auf die Zwischenablage

Auf die Systemzwischenablage wird über das globale Navigator.clipboard zugegriffen.

Dieses Beispiel holt den Text von 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 keinen Text enthält, ist dieser Code sicher.

js
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

api.ClipboardEvent

api.ClipboardItem

Siehe auch