webusb api允许网页在https、用户主动触发及设备声明webusb描述符前提下,与特定usb设备安全通信;需按open→selectconfiguration→claiminterface顺序操作,并通过controltransferout/transferin收发数据。
web usb api 允许网页在用户授权前提下与 usb 外设通信,但需满足严格条件:必须通过 https、用户主动触发(如点击按钮)、设备需有明确厂商/产品 id 或符合 webusb 协议的描述符。它不支持任意 usb 设备,仅限开发者明确声明并经用户授权的设备。
确保环境和设备兼容
Web USB 不是“即插即用”方案。浏览器支持有限(Chrome 61+、Edge 79+,Firefox 和 Safari 不支持)。设备端也需配合:要么内置 WebUSB 描述符(如某些 Arduino、STM32 开发板),要么通过固件声明 bInterfaceClass=0xFF 并提供 iInterface 字符串匹配网站 origin。普通 U 盘、键盘、打印机等标准 HID/MSD 设备默认不可访问。
- 检查当前浏览器是否支持:
if ('usb' in navigator) - 用 官方示例页 测试设备能否被识别
- 确认设备已正确配置 WebUSB descriptor(如使用
WebUSB Platform Capability Descriptor)
请求设备并获取连接权限
必须由用户手势(如 button click)触发 navigator.usb.requestDevice(),不能自动执行。需传入过滤条件,精准匹配目标设备,避免弹出过多选项。
- 按 vendorId/productId 精确匹配:
{ filters: [{ vendorId: 0x2341, productId: 0x0043 }] }(Arduino Uno) - 支持通配符或接口类过滤:
{ filters: [{ classCode: 0xFF }] }(自定义设备常用) - 调用后会弹出系统级选择框,用户手动确认——这是强制安全机制,无法绕过
打开设备、选择配置与接口
获得 USBDevice 实例后,需显式调用 open(),再选择 active configuration(通常为 0 或唯一项),最后 claim 接口才能读写数据。
-
await device.open()—— 建立底层连接(需权限且可能失败) -
await device.selectConfiguration(1)—— 选中配置(编号见设备描述符) -
await device.claimInterface(0)—— 占用接口(interface number 需与固件一致) - 若设备有多个接口或需切换 altSetting,需额外调用
selectAlternateInterface()
读写控制/中断/批量传输
Web USB 提供三种传输方式:控制传输(常用于初始化)、中断传输(传感器数据)、批量传输(大容量数据)。注意 endpoint 地址含方向位(0x80 表示 IN,0x00 表示 OUT)。
- 控制传输(如设置参数):
device.controlTransferIn(setup, length) - 中断读取(如实时传感器):
device.transferIn(endpointNumber, maxLength) - 批量发送(如固件升级):
device.transferOut(endpointNumber, data) - 所有传输返回
USBBulkTransferResult,需检查status === 'ok'和bytesWritten/data
不复杂但容易忽略:每次操作后记得释放接口(device.releaseInterface())和关闭设备(device.close()),尤其在页面卸载或异常时做清理,否则可能阻塞后续连接。
大量免费API接口:立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游,为数据API应用能力赋能!











