webUsb初识

何小豆儿在此  金牌会员 | 2025-1-6 19:22:41 | 显示全部楼层 | 阅读模式
打印 上一主题 下一主题
楼主

主题 853|帖子 853|积分 2559

webUSB初识 --派大星的开发日记

个人开发纪录笔记，仅个人明白，有错误还请指出
概述

WebUSB API 提供了一种将非标准化通用串行总线（USB）兼容设备服务暴露到Web的方法，使USB设备更安全、更易于使用。这项技术目前是实验性的，而且仅在支持的欣赏器的安全上下文中（HTTPS）可用。
概念和用法



  • USB是连接到盘算机的有线外设的究竟标准，包括键盘、鼠标、视频设备等。
  • 除了标准化设备外，还有许多需要自定义驱动程序的非标准化设备，这些设备之前无法从Web访问。
  • WebUSB允许这些非标准化USB设备在Web中可用，无需下载和安装驱动程序。
接口



  • USB：提供从网页中查找和连接USB设备的属性和方法。
  • USBConnectionEvent：传递给USB的connect或disconnect事件的事件类型。
  • USBDevice：提供对已配对的USB设备的元数据的访问以及控制方法。
  • USBInTransferResult和USBOutTransferResult：体现数据传输的结果。
  • USBIsochronousInTransferPacket和USBIsochronousOutTransferPacket：体现同步端点上数据传输的单个包的状态。
  • USBIsochronousInTransferResult和USBIsochronousOutTransferResult：体现同步端点上数据传输的结果。
  • USBConfiguration：提供有关USB设备的特定设置及其支持的接口的信息。
  • USBInterface和USBAlternateInterface：提供USB设备所提供的接口信息。
  • USBEndPoint：提供有关USB设备所提供的端点的信息。
设备获取 --需要用户授权

连接设备

  1. let fetchDevices = async () => {
  2.     let devices = await navigator.usb.requestDevice({
  3.         filters: [
  4.             //可以添加`在这里插入代码片`显示条件
  5.         ]
  6.     })
  7.     console.log(devices);
  8. };
  9. let btn = document.getElementById('btn');
  10. btn.onclick = fetchDevices;
复制代码
查找已连接的设备

  1. navigator.usb.getDevices().then((devices) => {
  2.   devices.forEach((device) => {
  3.     console.log(device.productName);
  4.     console.log(device.manufacturerName);
  5.   });
  6. });
复制代码
返回的数据均是USBdevice实例

实例属性



  • USBDevice.configuration：只读，当前选择的配对USB设备的接口的USBConfiguration对象。
  • USBDevice.configurations：只读，设备特定接口的数组，用于控制配对的USB设备。
  • USBDevice.deviceClass：只读，用于加载与设备兼容的USB驱动程序的三个属性之一。
  • USBDevice.deviceProtocol：只读，用于加载与设备兼容的USB驱动程序的三个属性之一。
  • USBDevice.deviceSubclass：只读，用于加载与设备兼容的USB驱动程序的三个属性之一。
  • USBDevice.deviceVersionMajor：只读，设备在语义版本控制方案中的主要版本号。
  • USBDevice.deviceVersionMinor：只读，设备在语义版本控制方案中的次要版本号。
  • USBDevice.deviceVersionSubminor：只读，设备在语义版本控制方案中的修订版本号。
  • USBDevice.manufacturerName：只读，USB设备的制造商名称。
  • USBDevice.opened：只读，体现是否已与配对的USB设备开始会话。
  • USBDevice.productId：只读，制造商定义的辨认USB设备的代码。
  • USBDevice.productName：只读，制造商定义的辨认USB设备的名称。
  • USBDevice.serialNumber：只读，制造商定义的特定USB设备的序列号。
  • USBDevice.usbVersionMajor：只读，设备支持的USB协议版本的主要部分。
  • USBDevice.usbVersionMinor：只读，设备支持的USB协议版本的次要部分。
  • USBDevice.usbVersionSubminor：只读，设备支持的USB协议版本的修订部分。
  • USBDevice.vendorId：只读，usb.org官方分配的供应商ID。
实例方法，在次只先容常用的几个



  • transferIn(endpointNumber)

    • 参数：endpointNumber（必需）- 要从中接收数据的端点的编号。
    • 返回值：Promise<USBInTransferResult> - 剖析为包罗传输结果的对象。

  • transferOut(endpointNumber, data)

    • 参数：endpointNumber（必需）- 要发送数据到的端点的编号；
    • data（必需）- 要发送的数据。
    • 返回值：Promise<USBOutTransferResult> - 剖析为包罗传输结果的对象。

  • selectConfiguration(configurationValue)

    • 参数：configurationValue（必需）- 要选择的设置的编号。
    • 返回值：Promise<void> - 当设置被成功选择时办理。

  • open()

    • 参数：无
    • 返回值：Promise<void> - 当设备会话成功开始时办理。

  • claimInterface(interfaceNumber)

    • 参数：interfaceNumber（必需）- 要声明独占访问的接口编号。
    • 返回值：Promise<void> - 当接口被成功声明为独占时办理。

  • controlTransferIn(setup)

    • 参数：setup（必需）- 控制传输的参数，包括哀求类型、哀求、值、索引和长度。
    • 返回值：Promise<USBInTransferResult> - 剖析为包罗控制传输结果的对象。

  • controlTransferOut(setup)

    • 参数：setup（必需）- 控制传输的参数，包括哀求类型、哀求、值、索引和长度。
    • 返回值：Promise<USBOutTransferResult> - 剖析为包罗控制传输结果的对象。

  • close()

    • 参数：无
    • 返回值：Promise<void> - 当全部打开的接口被释放而且设备会话竣事时办理。

  • selectAlternateInterface(interfaceNumber, alternateSetting)

    • 参数：interfaceNumber（必需）- 接口编号；alternateSetting（必需）- 选择的替换接口设置。
    • 返回值：Promise<void> - 当指定的替换接口被成功选择时办理。

大致流程

  1. /**
  2. * 请求用户选择USB设备
  3. * @returns {Promise<USBDevice>} 选中的USB设备对象
  4. */
  5. let fetchDevices = async () => {
  6.     try {
  7.         // 根据条件过滤设备
  8.         // filters: [
  9.         //   { vendorId: 0x2341 }, // 供应商ID，用于匹配特定供应商的设备
  10.         //   { productId: 0x1234 }, // 产品ID，用于匹配特定产品的设备
  11.         //   { classCode: 0x02 }, // 设备类代码，用于匹配特定类别的设备
  12.         //   { subclass: 0x01 }, // 子类代码，用于匹配特定子类的设备
  13.         //   { protocolCode: 0x01 } // 协议代码，用于匹配特定协议的设备
  14.         // ]
  15.         let device = await navigator.usb.requestDevice({
  16.             filters: [
  17.                 { vendorId: 0x2341 } // 示例vendorId，需要替换成实际值
  18.             ]
  19.         });
  20.         console.log('选中的设备:', device);
  21.         return device;
  22.     } catch (error) {
  23.         console.error('选择设备失败:', error);
  24.     }
  25. };
  27. /**
  28. * 打开USB设备会话
  29. * @param {USBDevice} device - USB设备对象
  30. * @returns {Promise<void>}
  31. */
  32. let openDevice = async (device) => {
  33.     try {
  34.         await device.open();
  35.         console.log('设备会话已打开');
  36.     } catch (error) {
  37.         console.error('打开设备会话失败:', error);
  38.     }
  39. };
  41. /**
  42. * 声明USB设备的接口
  43. * @param {USBDevice} device - USB设备对象
  44. * @param {number} interfaceNumber - 接口编号
  45. * @returns {Promise<void>}
  46. */
  47. let claimInterface = async (device, interfaceNumber) => {
  48.     try {
  49.         await device.claimInterface(interfaceNumber);
  50.         console.log('接口已声明');
  51.     } catch (error) {
  52.         console.error('声明接口失败:', error);
  53.     }
  54. };
  56. /**
  57. * 向USB设备发送控制传输数据
  58. * @param {USBDevice} device - USB设备对象
  59. * @param {number} endpointNumber - 端点编号
  60. * @param {Uint8Array} data - 要发送的数据
  61. * @returns {Promise<void>}
  62. */
  63. let sendControlTransferOut = async (device, endpointNumber, data) => {
  64.     try {
  65.         // controlTransferOut参数说明：
  66.         // requestType: 'standard' | 'class' | 'vendor' - 控制传输的类型
  67.         //   - 'standard': 标准请求，用于基本控制操作
  68.         //   - 'class': 类请求，针对特定USB设备类
  69.         //   - 'vendor': 供应商请求，供应商自定义的请求
  70.         // recipient: 'device' | 'interface' | 'endpoint' | 'other' - 控制传输的接收者
  71.         //   - 'device': 接收者为USB设备
  72.         //   - 'interface': 接收者为USB设备的特定接口
  73.         //   - 'endpoint': 接收者为USB设备的特定端点
  74.         //   - 'other': 其他类型的接收者
  75.         const result = await device.controlTransferOut({
  76.             requestType: 'vendor', // 供应商定义的控制传输
  77.             recipient: 'device', // 控制传输的接收者为设备
  78.             request: 0x01, // 请求码，供应商定义
  79.             value: 0x00, // 值，供应商定义
  80.             index: 0x00, // 索引，供应商定义
  81.             length: data.byteLength
  82.         }, data);
  83.         console.log('控制传输输出成功', result);
  84.     } catch (error) {
  85.         console.error('控制传输输出失败:', error);
  86.     }
  87. };
  89. /**
  90. * 关闭USB设备会话
  91. * @param {USBDevice} device - USB设备对象
  92. * @returns {Promise<void>}
  93. */
  94. let closeDevice = async (device) => {
  95.     try {
  96.         await device.close();
  97.         console.log('设备会话已关闭');
  98.     } catch (error) {
  99.         console.error('关闭设备会话失败:', error);
  100.     }
  101. };
  103. // 主函数：执行发送数据的整体流程
  104. let sendDataToDevice = async () => {
  105.     const device = await fetchDevices(); // 请求设备
  106.     if (device) {
  107.         await openDevice(device); // 打开设备会话
  108.         await claimInterface(device, 0); // 声明接口，这里以接口编号0为例
  109.         const dataToSend = new Uint8Array([0x01, 0x02, 0x03, 0x04]); // 要发送的数据
  110.         await sendControlTransferOut(device, 0x01, dataToSend); // 发送数据
  111.         await closeDevice(device); // 关闭设备会话
  112.     }
  113. };
  115. // 执行主函数
  116. sendDataToDevice();
复制代码
往interface写入数据的时间，记得要有out权限哦，in/out一样是不可以的。如果遇到了无法办理的问题，记得试一下webHid

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
回复

使用道具 举报

0 个回复

正序浏览
返回列表

快速回复

高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

何小豆儿在此

金牌会员
这个人很懒什么都没写!

楼主热帖

标签云

挺好的 服务器
微信订阅号
微信服务号
微信客服
小程序
H5
关于我们 商务合作 网站地图
©Copyright 2022-2024 杭州祥升科技有限公司 版权所有 浙ICP备20004199号
快速回复 返回顶部 返回列表