使用navigator.usb.getDevices()时,Chrome WebUSB API不返回任何设备

时间:2017-09-08 20:59:13

标签: javascript webusb

我正在尝试新的Chrome WebUSB API,但无法看到任何已连接的设备。

尝试使用不同的USB设备连接到我的Windows 7 PC:

<html>
    <body>
        <button onclick="myFunction()">Click me</button>

        <script>
            function myFunction() {
                console.log('Clicked');
                navigator.usb.getDevices()
                  .then(devices => {
                    devices.map(device => {
                      console.log('Device:');
                      console.log(device.productName);
                      console.log(device.manufacturerName);
                    });
                  });
            }
        </script>
    </body>
</html>

但没有设备。

我做错了什么? 它应该适用于任何设备吗?

感谢。

1 个答案:

答案 0 :(得分:5)

在您的网页请求访问设备的权限之前,navigator.usb.getDevices()将返回一个空列表。在onclick处理程序内部调用navigator.usb.requestDevice(),而不是使用过滤器选择您要支持的设备的供应商和产品ID。请参阅示例from the specification

let button = document.getElementById('request-device');
button.addEventListener('click', async () => {
  let device;
  try {
    device = await navigator.usb.requestDevice({ filters: [{
        vendorId: 0xABCD,
        classCode: 0xFF, // vendor-specific
        protocolCode: 0x01
    }]});
  } catch () {
    // No device was selected.
  }

  if (device !== undefined) {
    // Add |device| to the UI.
  }
});