Serial

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

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

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Hinweis: Diese Funktion ist in Dedicated Web Workers verfügbar.

Das Serial-Interface der Web Serial API bietet Attribute und Methoden zum Finden und Verbinden mit seriellen Anschlüssen von einer Webseite aus.

EventTarget Serial

Instanzmethoden

Serial.requestPort() Experimentell

Gibt ein Promise zurück, das mit einer Instanz von SerialPort aufgelöst wird, die das vom Benutzer gewählte Gerät darstellt. Diese Methode muss über eine transiente Aktivierung aufgerufen werden.

Serial.getPorts() Experimentell

Gibt ein Promise zurück, das mit einem Array von SerialPort-Objekten aufgelöst wird, die serielle Anschlüsse darstellen, die mit dem Host verbunden sind und auf die der Ursprung zugreifen darf.

Ereignisse

Die folgenden Ereignisse stehen Serial über Ereignis-Bubbling von SerialPort zur Verfügung:

SerialPort connect-Ereignis

Ein Ereignis, das ausgelöst wird, wenn ein Anschluss mit dem Gerät verbunden wurde.

SerialPort disconnect-Ereignis

Ein Ereignis, das ausgelöst wird, wenn ein Anschluss vom Gerät getrennt wurde.

Beispiele

Das folgende Beispiel zeigt, wie eine Webseite verfügbare Anschlüsse überprüfen und dem Benutzer die Erlaubnis erteilen lassen kann, auf zusätzliche Anschlüsse zuzugreifen.

Beim Laden der Seite werden Ereignis-Listener für die connect- und disconnect-Ereignisse hinzugefügt, damit die Webseite reagieren kann, wenn ein Gerät mit dem System verbunden oder davon getrennt wird. Die getPorts()-Methode wird dann aufgerufen, um festzustellen, welche Anschlüsse verbunden sind, auf die die Webseite bereits Zugriff hat.

Wenn die Webseite keinen Zugriff auf verbundene Anschlüsse hat, muss sie warten, bis sie eine Benutzeraktivierung hat, um fortzufahren. In diesem Beispiel verwenden wir einen click-Ereignis-Handler auf einem Button für diese Aufgabe. Ein Filter wird an requestPort() mit einer USB-Vendor-ID übergeben, um die Menge der Geräte, die dem Benutzer angezeigt werden, auf nur USB-Geräte eines bestimmten Herstellers zu beschränken.

js
navigator.serial.addEventListener("connect", (e) => {
  // Connect to `e.target` or add it to a list of available ports.
});

navigator.serial.addEventListener("disconnect", (e) => {
  // Remove `e.target` from the list of available ports.
});

navigator.serial.getPorts().then((ports) => {
  // Initialize the list of available ports with `ports` on page load.
});

button.addEventListener("click", () => {
  const usbVendorId = 0xabcd;
  navigator.serial
    .requestPort({ filters: [{ usbVendorId }] })
    .then((port) => {
      // Connect to `port` or add it to the list of available ports.
    })
    .catch((e) => {
      // The user didn't select a port.
    });
});

Spezifikationen

Specification
Web Serial API
# serial-interface

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Serial
Experimental
getPorts
Experimental
requestPort
Experimental
allowedBluetoothServiceClassIds option
Experimental
filters bluetoothServiceClassId property
Experimental

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support
Experimental. Expect behavior to change in the future.
See implementation notes.