ClipboardItem: supports() statische Methode

Baseline 2025
Newly available

Since March 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Die supports() statische Methode des ClipboardItem-Interfaces gibt true zurück, wenn der angegebene MIME-Typ von der Zwischenablage unterstützt wird, und false andernfalls.

Beachten Sie, dass die Clipboard API die Unterstützung für Klartext, HTML und PNG-Dateien vorschreibt. Die supports()-Methode wird für diese MIME-Typen immer true zurückgeben, sodass deren Prüfung unnötig ist.

Syntax

js
supports(type)

Parameter

type

Ein String, der den zu testenden MIME-Typ angibt.

Diese MIME-Typen werden immer unterstützt:

  • text/plain
  • text/html
  • image/png

Diese MIME-Typen können unterstützt werden:

  • image/svg+xml
  • Benutzerdefinierte MIME-Typ-Formate, die mit "web " beginnen. Der benutzerdefinierte Typ (ohne das Präfix "web ") muss das korrekte Format für einen MIME-Typ haben.

Rückgabewert

true, wenn der angegebene MIME-Typ von der Zwischenablage unterstützt wird, false andernfalls.

Beispiele

Ein Bild in die Zwischenablage schreiben

Das folgende Beispiel ruft ein SVG-Bild ab, stellt es als Blob dar und schreibt es dann in die Zwischenablage.

Wir verwenden supports(), um zu prüfen, ob der MIME-Typ "image/svg+xml" von der Zwischenablage unterstützt wird, bevor wir das Bild abrufen und es mit clipboard.write() schreiben. Wir umhüllen den gesamten Funktionskörper auch in eine try...catch-Anweisung, um mögliche andere Fehler abzufangen, wie zum Beispiel, dass ClipboardItem selbst nicht unterstützt wird.

js
async function writeClipImg() {
  try {
    if (ClipboardItem.supports("image/svg+xml")) {
      const imgURL = "/my-image.svg";
      const data = await fetch(imgURL);
      const blob = await data.blob();
      await navigator.clipboard.write([
        new ClipboardItem({
          [blob.type]: blob,
        }),
      ]);
      console.log("Fetched image copied to clipboard.");
    } else {
      console.log("SVG image not supported by clipboard");
    }
  } catch (err) {
    console.error(err.name, err.message);
  }
}

Spezifikationen

Specification
Clipboard API and events
# dom-clipboarditem-supports

Browser-Kompatibilität

Siehe auch