Choisissez l'API appropriée pour communiquer avec le dispositif matériel de votre choix.
L'objectif de ce guide est de vous aider à choisir la meilleure API pour communiquer avec un périphérique matériel (par exemple, webcam, micro, etc.) sur le Web. Par « meilleur », je veux dire que cela vous donne tout ce dont vous avez besoin avec le moins de travail possible. En d'autres termes, vous connaissez le cas d'utilisation général que vous souhaitez résoudre (par exemple, l'accès à des vidéos), mais vous ne savez pas quelle API utiliser ou vous vous demandez s'il existe une autre façon d'y parvenir.
Les développeurs Web rencontrent souvent un problème : passer aux API de bas niveau sans connaître les API de niveau supérieur qui sont plus faciles à implémenter et offrent une meilleure expérience utilisateur. Par conséquent, ce guide commence par recommander des API de niveau supérieur, mais mentionne également des API de niveau inférieur au cas où vous auriez déterminé que l'API de niveau supérieur ne répondait pas à vos besoins.
🕹 Recevez des événements d'entrée depuis cet appareil.
Essayez d'écouter les événements Clavier et Pointeur. Si cet appareil est une manette de jeu, utilisez l'API Gamepad pour savoir sur quels boutons l'utilisateur appuie et quels axes se déplacent.
Si aucune de ces options ne fonctionne, une API de bas niveau peut être la solution. Consultez Découvrez comment communiquer avec votre appareil pour commencer.
📸 Accédez aux contenus audio et vidéo depuis cet appareil.
Utilisez MediaDevices.getUserMedia() pour obtenir des flux audio et vidéo en direct depuis cet appareil, et découvrez comment enregistrer des contenus audio et vidéo. Vous pouvez également contrôler le panoramique, l'inclinaison et le zoom, ainsi que d'autres paramètres tels que la luminosité et le contraste, et même prendre des images fixes. L'option Audio Web permet d'ajouter des effets à des contenus audio, de créer des visualisations audio ou d'appliquer des effets spatiaux (tels qu'un panoramique). Découvrez également comment profiler les performances des applications Web Audio dans Chrome.
Si aucune de ces options ne fonctionne, une API de bas niveau peut être la solution. Consultez Découvrez comment communiquer avec votre appareil pour commencer.
🖨 Imprimer sur cet appareil
Utilisez window.print() pour ouvrir une boîte de dialogue de navigateur permettant à l'utilisateur de choisir cet appareil comme destination pour imprimer le document actuel.
Si cela ne fonctionne pas, une API de bas niveau peut être la solution. Pour commencer, découvrez comment communiquer avec votre appareil.
🔐 S'authentifier sur cet appareil
Utilisez WebAuthn pour créer un identifiant de clé publique fort, certifié et limité à l'origine avec cet appareil de sécurité matérielle afin d'authentifier les utilisateurs. Il accepte l'utilisation du Bluetooth, du NFC et d'authentificateurs U2F ou FIDO2 itinérants via USB (également appelés clés de sécurité), ainsi qu'un authentificateur de plate-forme, qui permet aux utilisateurs de s'authentifier à l'aide de leurs empreintes digitales ou de leur verrouillage de l'écran. Découvrez comment créer votre première application WebAuthn.
Si cet appareil est un autre type de dispositif de sécurité matériel (par exemple, un portefeuille de cryptomonnaie), une API de bas niveau peut être la solution. Pour commencer, découvrez comment communiquer avec votre appareil.
🗄 Accédez aux fichiers sur cet appareil
Utilisez l'API File System Access pour lire et enregistrer les modifications directement dans les fichiers et les dossiers de l'appareil de l'utilisateur. Si ce n'est pas le cas, utilisez l'API File pour demander à l'utilisateur de sélectionner des fichiers locaux dans une boîte de dialogue de navigateur, puis de lire le contenu de ces fichiers.
Si aucune de ces options ne fonctionne, une API de bas niveau peut être la solution. Consultez Découvrez comment communiquer avec votre appareil pour commencer.
🧲 Accédez aux capteurs sur cet appareil
Utilisez l'API Generic Sensor pour lire les valeurs brutes des capteurs de mouvement (accéléromètre ou gyroscope, par exemple) et d'environnement (lumière ambiante, magnétomètre, par exemple). S'ils ne sont pas disponibles, utilisez les événements DeviceMotion et DeviceOrientation pour accéder à l'accéléromètre, au gyroscope et à la boussole intégrés aux appareils mobiles.
Si cela ne fonctionne pas, une API de bas niveau peut être la solution. Pour commencer, découvrez comment communiquer avec votre appareil.
🛰 Accédez aux coordonnées GPS sur cet appareil
Utilisez l'API Geolocation pour obtenir la latitude et la longitude de la position actuelle de l'utilisateur sur cet appareil.
Si cela ne fonctionne pas, une API de bas niveau peut être la solution. Pour commencer, découvrez comment communiquer avec votre appareil.
🔋 Vérifiez la batterie de cet appareil
Utilisez l'API Battery pour obtenir des informations sur l'hôte sur le niveau de charge de la batterie et être averti lorsque l'état ou l'état de la batterie changent.
Si cela ne fonctionne pas, une API de bas niveau peut être la solution. Pour commencer, découvrez comment communiquer avec votre appareil.
⋅ Communiquer avec cet appareil via le réseau
Sur le réseau local, utilisez l'API Remote Playback pour diffuser du contenu audio et/ou vidéo sur un appareil de lecture à distance (par exemple, une smart TV ou une enceinte sans fil) ou l'API Presentation pour afficher une page Web sur un deuxième écran (par exemple, un écran secondaire connecté avec un câble HDMI ou une smart TV connectée sans fil).
Si cet appareil expose un serveur Web, utilisez l'API Fetch et/ou les WebSockets pour récupérer certaines données de cet appareil en accédant aux points de terminaison appropriés. Bien que les sockets TCP et UDP ne soient pas disponibles sur le Web, consultez WebTransport pour gérer les connexions réseau interactives, bidirectionnelles et multiplexées. Notez que WebRTC permet également de communiquer des données en temps réel avec d'autres navigateurs à l'aide d'un protocole peer-to-peer.
🧱 Découvrez comment communiquer avec votre appareil
Le choix de l'API de bas niveau à utiliser dépend de la nature de votre connexion physique à l'appareil. S'il s'agit d'un réseau sans fil, utilisez Web NFC pour les connexions sans fil à très courte portée et Web Bluetooth pour les appareils sans fil à proximité.
Avec le NFC Web, lisez et écrivez sur cet appareil lorsqu'il se trouve à proximité de l'appareil de l'utilisateur (généralement entre 5 et 10 cm ou 2 à 4 pouces). Des outils tels que NFC TagInfo de NXP vous permettent de parcourir le contenu de cet appareil à des fins de rétro-ingénierie.
Avec le Bluetooth Web, connectez-vous à cet appareil via une connexion Bluetooth à basse consommation. Il devrait être assez facile de communiquer avec ce type de service lorsqu'il utilise des services GATT standardisés Bluetooth (tels que le service de batterie), car leur comportement est bien documenté. Si ce n'est pas le cas, à ce stade, vous devez trouver de la documentation matérielle pour cet appareil ou procéder à une rétro-ingénierie. Pour ce faire, vous pouvez utiliser des outils externes tels que nRF Connect pour mobile et des outils de navigateur intégrés tels que la page interne
about://bluetooth-internalsdans les navigateurs Chromium. Découvrez l'ingénierie inverse d'une ampoule Bluetooth d'Uri Shaked. Notez que les appareils Bluetooth peuvent également communiquer les protocoles HID ou série.
En cas de connexion filaire, consultez ces API dans cet ordre spécifique:
Avec WebHID, comprendre les rapports HID et les descripteurs de rapports à l'aide de collections est essentiel pour comprendre cet appareil. Cela peut être difficile sans la documentation du fournisseur pour cet appareil. Des outils tels que Wireshark peuvent vous aider à effectuer des opérations de rétro-ingénierie. Vous pouvez également utiliser l'application Web HID Explorer pour transférer les informations sur les appareils HID dans un format lisible.
Avec Web Serial, sans documentation du fournisseur pour cet appareil et sans les commandes compatibles avec cet appareil, c'est difficile, mais possible malgré tout. La rétro-ingénierie de cet appareil peut être effectuée en capturant le trafic USB brut à l'aide d'outils tels que Wireshark. Vous pouvez également utiliser l'application Web Serial Terminal pour tester cet appareil s'il utilise un protocole lisible.
Avec WebUSB, sans documentation claire pour cet appareil et sans les commandes USB compatibles avec cet appareil, c'est difficile, mais possible malgré tout. Regardez la vidéo Exploring WebUSB and its prenne potentielle de Suz Hinton. Vous pouvez également procéder à la rétro-ingénierie de cet appareil en capturant le trafic USB brut et en inspectant les descripteurs USB à l'aide d'outils externes tels que Wireshark et d'outils de navigateur intégrés tels que la page interne
about://usb-internalsdans les navigateurs basés sur Chromium.
Remerciements
Merci à Reilly Grant, Thomas Steiner et Kayce Basques pour avoir lu cet article.
Photo de Darya Tryfanava sur Unsplash.