WebUSB API允许HTTPS网页在用户授权下通过requestDevice、open、claimInterface三步连接USB设备，仅Chromium系浏览器支持，需用户手势触发并确认权限，数据收发依赖正确端点地址。
JavaScript 本身不能直接操作 USB 设备，但现代浏览器（Chrome、Edge、Opera 等）支持 WebUSB API，它允许网页在用户明确授权的前提下，与兼容的 USB 设备通信。关键前提是：设备必须符合 USB 协议规范，网页需运行在 HTTPS 环境下，且用户主动触发（比如点击按钮），不能自动连接。
WebUSB 使用前提和限制
不是所有设备都能用，也不是所有浏览器都支持：
- 仅 Chromium 内核浏览器支持（Chrome 61+、Edge 79+、Opera 48+），Firefox 和 Safari 暂不支持
- 页面必须通过 HTTPS（本地开发可用
localhost） - 调用必须由用户手势触发（如
click、touchstart），不能在页面加载时自动执行 - 用户会看到系统级权限弹窗，必须手动点“允许”，每次新设备或新网站首次连接都需要确认
- 设备需有明确的接口类（如 HID、CDC、Vendor-specific），且不能是系统关键设备（如键盘、鼠标、显示器）
基本连接流程：requestDevice + open + claimInterface
三步走：找设备 → 打开设备 → 占用接口。每一步都返回 Promise，需 await 或 .then() 处理：
-
navigator.usb.requestDevice({ filters: [...] })：弹出设备选择框，filters可按vendorId、productId或classCode精准匹配（避免列出所有设备） -
device.open()：建立与设备的连接（类似打开文件） -
device.claimInterface(interfaceNumber)：抢占指定接口（USB 设备常有多个接口，比如一个用于控制，一个用于数据）
示例片段：
立即学习“Java免费学习笔记（深入）”；
async function connectToMyDevice() {
try {
const device = await navigator.usb.requestDevice({
filters: [{ vendorId: 0x1234, productId: 0x5678 }]
});
await device.open();
await device.selectConfiguration(1); // 选配置（通常为1）
await device.claimInterface(0); // 占用接口0
console.log('已连接并占用接口0');
} catch (err) {
console.error('连接失败：', err.message);
}
}
读写数据：transferIn / transferOut
数据收发依赖端点（endpoint），需先查设备描述符确认端点地址（如 0x81 是 IN 端点，0x01 是 OUT 端点）：
-
device.transferIn(endpointNumber, length)：从设备读取数据，返回{ data: DataView, status: 'ok' } -
device.transferOut(endpointNumber, data)：向设备发送数据，data可为ArrayBuffer或Uint8Array - 注意端点方向和最大包长（maxPacketSize），超长需分包；IN/OUT 地址必须与设备描述符一致，否则报错
断开与清理：close + forget
用完记得释放资源，避免设备被锁死：
-
device.close()：关闭连接（但设备仍被网页“记住”） -
navigator.usb.getDevices()可获取已授权的设备列表，适合恢复上次连接 - 若要彻底清除授权记录，可调用
device.forget()（用户下次需重新授权） - 页面卸载前建议监听
beforeunload自动 close，防止异常断连
基本上就这些。WebUSB 不复杂但容易忽略权限和端点细节，调试时多看 Chrome 的 chrome://usb 页面和 DevTools 的 Application → USB 面板，能直观看到设备枚举和接口状态。
