在 Electron 应用程序中访问 USB 记忆棒失败,并显示:未选择设备异常

Kin*_*one 5 javascript reactjs electron webusb

你好,我正在尝试从用reactjs编写的电子应用程序访问USB记忆棒。

由于电子是谷歌铬我想我可以使用USB Web-Api:https://developer.mozilla.org/en-US/docs/Web/API/USB

所以我创建了一个像这样的组件:

import React from 'react';

const UsbAccessButton = () => (
  <button
    className="usb-access-button"
    onClick={() => {
      navigator.usb
        .requestDevice({ filters: [{ vendorId: 0x0951 }] })
        .then(device => {
          console.log(device.productName);
          console.log(device.manufacturerName);
        })
        .catch(error => {
          console.log(error);
        });
    }}
  >
    Get USB Access
  </button>
);

export default UsbAccessButton;
Run Code Online (Sandbox Code Playgroud)

供应商 ID 是我的特定 USB 记忆棒的正确供应商 ID。但是当我点击按钮时,我收到如下错误:

DOMException: No device selected.       usb-access-button.component.jsx:14
Run Code Online (Sandbox Code Playgroud)

但我想列出可用的设备,以便用户可以进行选择。所以也许我不理解文档的某些部分或者是什么导致了这里的问题?

更新:当我在默认的 Chrome 浏览器中运行此应用程序时,我会看到在 USB 设备之间进行选择的对话框。所以看起来这个错误与电子本身更有关系。

Ger*_*rit 4

目前(2020 年 1 月)Electron 中不可能有 WebUSB 的设备选择器 - 请参阅此处的问题:https ://github.com/electron/electron/issues/14545

目前建议的解决方案是使用thegecko/webusb polyfill,它使用node-usb 库。