通过 Web 访问硬件设备

选择合适的 API 与您选择的硬件设备通信。

François Beaufort
François Beaufort

本指南旨在帮助您选择最适合的 API, 网络上的硬件设备(例如摄像头、麦克风等)。按“最佳”我是说 只需极少的工作量即可为您提供所需的一切。换言之, 您知道想要解决的一般用例(例如访问视频),但 不知道使用什么 API,或者不知道是否有其他方法可以实现。

网络开发者经常会遇到一个问题 构建低级别的 API,而不必学习较容易 并提供更好的用户体验因此,本指南首先推荐 但也会提及较低级别的 API 确定更高级别的 API 无法满足您的需求。

🕹? 接收来自此设备的输入事件

尝试监听 键盘Pointer事件。此设备是否为游戏 控制器,请使用 Gamepad API 了解用户按下了哪些按钮并 移动了哪些轴

如果这些方法全都无效,低级别 API 可能是解决方案。 请参阅了解如何与您的设备通信以开启您的旅程。

🚌? 在此设备上访问音频和视频

使用 MediaDevices.getUserMedia() 从此处获取实时音频和视频流。 并了解如何捕获音频和视频。您还可以控制 摄像头的平移、倾斜和缩放功能以及亮度和 对比度,甚至可以拍摄静态图片网络音频可用于添加效果 音频、制作音频可视化或应用空间效果(例如 平移)。查看如何在 Chrome 中分析网络音频应用的性能

如果这些方法全都无效,低级别 API 可能是解决方案。 查看了解如何与您的设备通信以开启您的旅程。

🖨? 使用此设备进行打印

使用 window.print() 打开一个浏览器对话框,让用户选择此项 作为目标设备来打印当前文档。

如果这还行,低级别 API 可能是解决方案。结账 了解如何与您的设备通信以开启您的旅程。

😝? 使用此设备进行身份验证

使用 WebAuthn 创建强、经过认证且范围限定为源的公钥 凭据,用于验证用户身份。它支持 使用蓝牙、NFC 和 USB 漫游 U2F 或 FIDO2 身份验证器,还应 以及平台身份验证器,让用户 使用指纹或屏幕锁定凭据进行身份验证。请参阅构建您的 第一个 WebAuthn 应用

如果此设备是其他类型的硬件安全设备(例如 加密货币钱包),因此低层级 API 可能是解决方案。查看“探索”专区 如何与设备通信,开启您的旅程。

🗄? 访问此设备上的文件

使用 File System Access API 读取文件并将其直接保存到文件中 和文件夹。如果不可用,请使用 File API 来询问 用户从浏览器对话框中选择本地文件,然后读取内容 这些文件。

如果这些方法全都无效,低级别 API 可能是解决方案。 请参阅了解如何与您的设备通信以开启您的旅程。

🧲? 访问此设备上的传感器

使用通用传感器 API 从移动传感器(例如 加速度计或陀螺仪)和环境传感器(例如环境光、 磁力计)。如果不可用,请使用 DeviceMotion 和 DeviceOrientation 事件以在 Google Cloud 控制台中访问内置加速度计、陀螺仪和罗盘, 。

如果行不通,可以使用低级别的 API 来解决问题。结账 了解如何与您的设备通信以开启您的旅程。

🛰? 在此设备上访问 GPS 坐标

使用 Geolocation API 获取用户所在位置的 此设备上的当前位置。

如果行不通,可以使用低级别的 API 来解决问题。结账 了解如何与您的设备通信以开启您的旅程。

🔋? 检查这部设备的电池电量

使用 Battery API 可以获取关于电池电量和 在电池电量或充电状态发生变化时收到通知。

如果行不通,可以使用低级别的 API 来解决问题。结账 了解如何与您的设备通信以开启您的旅程。

🗓? 通过网络与此设备通信

在本地网络中,使用 Remote Playback API 广播音频和/或 远程播放设备(例如智能电视或无线音箱)上播放视频,或使用 Presentation API,用于在第二屏幕(例如辅助屏幕)上呈现网页 使用 HDMI 数据线连接的显示屏或无线连接的智能电视)。

如果此设备会公开网络服务器,请使用 Fetch API 和/或 WebSockets 通过访问适当的端点从此设备中提取一些数据。而 TCP 和 UDP 套接字在 Web 上不可用,请参阅 WebTransport 来处理 交互式、双向和多路复用网络连接。请注意, WebRTC 也可用于与其他浏览器实时通信数据 使用点对点协议

🧱? 探索如何与设备通信

应使用哪种低级别 API 取决于应用的性质 与设备的物理连接如果是无线设备,请查看 Web NFC 提供超短距离无线连接和网络蓝牙或网络串流服务,以供附近使用 无线设备。

  • 借助网络 NFC,从以下设备读取数据或向设备写入数据: 用户的设备(通常为 5–10 厘米、2–4 英寸)。NFC TagInfo by NXP 可让您浏览此设备的内容以进行逆向工程 目的。

  • 使用网络蓝牙,通过低功耗蓝牙连接到此设备 连接。它应该能够非常轻松地与 标准化的蓝牙 GATT 服务(例如电池服务),作为其 行为详细记录。如果没有,此时您必须找到 提供此设备的一些硬件文档,或者对设备进行逆向工程。您可以 使用 nRF Connect for Mobile 等外部工具和内置的浏览器工具 例如基于 Chromium 的内部网页 about://bluetooth-internals 。请参阅对蓝牙灯泡进行逆向工程 URI 震动了。请注意,蓝牙设备也可以读出 HID 或序列号 协议

  • 使用通过蓝牙串行功能,与已配对的 RFCOMM 服务进行通信 标准蓝牙设备,例如标准化串行端口配置文件 (SPP)。对于 基于 RFCOMM 的自定义服务,则需要咨询设备的 有关要传递给 requestPort() 的服务 UUID 的供应商文档。

如果是以线方式连接,请按照以下特定顺序查看这些 API:

  1. 借助 WebHID,您可以通过 集合是您理解此设备的关键。可以是 。工具,例如 Wireshark 能帮你对其进行逆向工程。您还可以使用 HID Explorer Web 应用,用于将 HID 设备信息转储为人类可读的格式。

  2. 使用网络串行,但未提供此设备的供应商文档以及具体内容 但并不容易,但幸运的是 猜测。可以通过捕获原始 USB 对此设备进行逆向工程 Wireshark 等工具跟踪流量。您也可以使用串行终端 Web 应用来尝试此设备(如果它使用人类可读的协议)。

  3. 使用 WebUSB,但未清除此设备的相关文档以及 USB 但并不容易,但幸运的是 猜测。观看 Suz 的探索 WebUSB 及其令人兴奋的潜力 Hinton。您也可以通过捕获原始 USB 来对此设备进行逆向工程 以及使用 Wireshark 等外部工具检查 USB 描述符 和内置的浏览器工具,例如内部页面 about://usb-internals

致谢

感谢 Reilly GrantThomas SteinerKayce Basques 阅读本文。

照片由 Darya tryfanava 拍摄于 Unstone