Un dispositif d'interface humain (HID) reçoit des entrées ou fournit une sortie à des humains. Il fait également référence au protocole HID, une norme de communication bidirectionnelle entre un hôte et un appareil conçue pour simplifier la procédure d'installation.
Cette page décrit les aspects de l'API spécifiques aux extensions. Consultez MDN pour en savoir plus sur l'API WebHID.
Vous trouverez un exemple d'application pour WebHID dans notre dépôt d'exemples.
Disponibilité dans les extensions
Chrome 117 ou version ultérieure.
Autorisations
Aucune autorisation n'est requise pour le fichier manifeste. Toutefois, WebHID déclenche le flux d'autorisations utilisateur du navigateur.
Manifest
Aucune clé de fichier manifeste n'est nécessaire pour cette API.
Contextes complémentaires
Cette API peut être utilisée dans presque tous les contextes. Impossible d'utiliser la méthode WebHID.requestDevice() dans les service workers d'extension. Reportez-vous à la section suivante pour plus d'informations.
Lorsque cette API est utilisée dans un service worker d'extension, la session de connexion des appareils maintient celui-ci actif.
Différences entre les extensions Chrome
Bien que WebHID soit disponible pour les service workers d'extension, WebHID.requestDevice(), qui renvoie une promesse qui se résout avec une instance HIDDevice, ne peut pas être appelé dans un service worker d'extension. Pour contourner ce problème, appelez requestDevice() depuis une page d'extension autre que le service worker de l'extension et envoyez un message à celui-ci.
Le code suivant suit un modèle typique en appelant requestDevice() dans le cadre d'un flux d'autorisations nécessitant un geste de l'utilisateur. Une fois l'appareil acquis, il envoie un message au service worker, qui peut ensuite le récupérer à l'aide de getDevices().
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();
}
}
});