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, bevor Sie diese produktiv verwenden.
Hinweis: Dieses Feature ist verfügbar in Dedicated Web Workers.
Das Serial
-Interface der Web Serial API bietet Attribute und Methoden zum Finden und Verbinden mit seriellen Anschlüssen von einer Webseite aus.
Instanzmethoden
Serial.requestPort()
Experimentell-
Gibt ein
Promise
zurück, das mit einer Instanz vonSerialPort
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 vonSerialPort
-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.
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
BCD tables only load in the browser