Ein Human Interface Device (HID) nimmt Eingaben von Menschen entgegen oder liefert sie an Menschen aus. Er bezieht sich auch auf das HID-Protokoll, einen Standard für die bidirektionale Kommunikation zwischen einem Host und einem Gerät, der den Installationsvorgang vereinfacht.
Auf dieser Seite werden Aspekte der API beschrieben, die sich speziell auf Erweiterungen beziehen. Ausführliche Informationen zur WebHID API finden Sie auf der MDN.
In unserem Beispiel-Repository finden Sie eine Beispiel-App für WebHID.
Verfügbarkeit in Erweiterungen
Chrome 117 oder höher.
Berechtigungen
Es sind keine Berechtigungen für Manifestdateien erforderlich. WebHID löst jedoch den Nutzerberechtigungsablauf des Browsers aus.
Manifest
Für diese API sind keine Manifestschlüssel erforderlich.
Unterstützende Kontexte
Diese API kann in nahezu jedem Kontext verwendet werden. Die Methode WebHID.requestDevice() kann nicht in Erweiterungsdienst-Workern verwendet werden. Einzelheiten finden Sie im nächsten Abschnitt.
Wenn diese API in einem Extension Service Worker verwendet wird, hält die Geräteverbindungssitzung den Service Worker aktiv.
Unterschiede bei Chrome-Erweiterungen
Obwohl WebHID für Erweiterungsdienst-Worker verfügbar ist, kann WebHID.requestDevice(), das ein Promise zurückgibt, das mit einer HIDDevice-Instanz aufgelöst wird, nicht in einem Erweiterungsdienst-Worker aufgerufen werden. Um dieses Problem zu umgehen, rufen Sie requestDevice() von einer Erweiterungsseite außer dem Erweiterungsdienst-Worker auf und senden Sie eine Nachricht an den Dienst-Worker der Erweiterung.
Der folgende Code folgt einem typischen Muster. Dabei wird requestDevice() im Rahmen eines Berechtigungsvorgangs aufgerufen, für den eine Nutzergeste erforderlich ist. Wenn das Gerät übernommen wird, sendet es eine Nachricht an den Service Worker, der das Gerät dann mit getDevices() abrufen kann.
popup.js:
myButton.addEventListener("click", async () => {
await navigator.hid.requestDevice({
filters: [{ vendorId: 0x1234, productId: 0x5678 }],
});
chrome.runtime.sendMessage("newDevice");
});
service-worker.js
chrome.runtime.onMessage.addListener(async (message) => {
if (message === "newDevice") {
const devices = await navigator.hid.getDevices();
for (const device of devices) {
// open device connection.
await device.open();
}
}
});