Signatur
Beschreibung
Die Eigenschaft productId eines HIDDevice-Objekts enthält die Produkt-ID, die der Hersteller dem Gerät zugewiesen hat. Bei USB-Geräten ist das die idProduct aus dem Gerätedeskriptor, bei Bluetooth-HID-Geräten der entsprechende Wert aus dem Device-ID-Profil. Der Wert ist eine ganze Zahl zwischen 0 und 0xFFFF.
Zusammen mit vendorId kennzeichnet productId ein bestimmtes Gerätemodell eindeutig. Typische Anwendungsfälle sind das Filtern in navigator.hid.requestDevice(), die Erkennung bereits freigegebener Geräte über navigator.hid.getDevices() und die Auswahl des richtigen Protokolls, wenn eine Anwendung mehrere Modelle eines Herstellers unterstützt.
Die Eigenschaft ist schreibgeschützt und schon verfügbar, bevor das Gerät mit open() geöffnet wurde. Eine einzelne Produkt-ID steht für ein Modell, nicht für ein einzelnes Exemplar — für die Unterscheidung mehrerer gleicher Geräte ist sie also nicht geeignet.
Rückgabewert
0–65535) mit der Produkt-ID des Geräts. Hexadezimal dargestellt z. B. 0x05c4.Beispiele
Gerät auswählen und Produkt-ID ausgeben
// Muss in einer Nutzeraktion (z. B. Klick) aufgerufen werden
const button = document.querySelector('#connect');
button.addEventListener('click', async () => {
const [device] = await navigator.hid.requestDevice({
filters: [{ vendorId: 0x054c }] // Sony
});
if (!device) return;
const hex = device.productId.toString(16).padStart(4, '0');
console.log(`${device.productName}: PID 0x${hex}`);
});Gezielt nach Vendor- und Produkt-ID filtern
const DUALSHOCK4 = { vendorId: 0x054c, productId: 0x05c4 };
document.querySelector('#pair').addEventListener('click', async () => {
const devices = await navigator.hid.requestDevice({ filters: [DUALSHOCK4] });
console.log(`${devices.length} passende(s) Gerät(e) gewählt`);
});Freigegebene Geräte beim Start wiedererkennen
const SUPPORTED = new Map([
['054c:05c4', 'DualShock 4 (v1)'],
['054c:09cc', 'DualShock 4 (v2)'],
['054c:0ce6', 'DualSense']
]);
const key = (d) =>
`${d.vendorId.toString(16).padStart(4, '0')}:${d.productId.toString(16).padStart(4, '0')}`;
const devices = await navigator.hid.getDevices();
for (const device of devices) {
const model = SUPPORTED.get(key(device)) ?? 'unbekanntes Modell';
console.log(`${key(device)} → ${model}`);
}Auf neu angeschlossene Geräte reagieren
navigator.hid.addEventListener('connect', ({ device }) => {
if (device.vendorId === 0x054c && device.productId === 0x0ce6) {
console.log('DualSense verbunden');
}
});// Wichtig · Fallstricke
- Browser-Kompatibilität: Die WebHID-API gibt es nur in Chromium-basierten Desktop-Browsern (Chrome, Edge, Opera ab Version 89). Firefox und Safari unterstützen sie nicht. Prüfe die Verfügbarkeit vorher mit
'hid' in navigator. - Die API funktioniert nur in einem sicheren Kontext (HTTPS oder
localhost). In iframes muss die Permissions-Policyhiderlaubt sein. - Der Wert ist eine Dezimalzahl. Datenblätter und Tools wie
lsusbgeben IDs meist hexadezimal an – vergleiche deshalb mit Hex-Literalen (0x05c4) oder formatiere übertoString(16).padStart(4, '0'). - Ein Hersteller kann für Hardware-Revisionen unterschiedliche Produkt-IDs vergeben (z. B. DualShock 4 v1/v2). Pflege daher lieber eine Liste unterstützter IDs, statt nur auf einen Wert zu prüfen.
- Die Produkt-ID ist kein eindeutiger Geräte-Bezeichner: Mehrere identische Geräte haben dieselbe ID. Ein zusammengesetztes Gerät kann außerdem als mehrere
HIDDevice-Objekte mit gleicherproductIdauftauchen, eines pro HID-Schnittstelle. Diese unterscheidest du übercollections. - Bestimmte Geräteklassen (z. B. Tastaturen, FIDO-Sicherheitsschlüssel) blockiert der Browser. Sie tauchen unabhängig von der Produkt-ID nicht in der Auswahl auf.