I have a proprietary USB device that has a flashing functionality over USB. I would like to replicate this flashing functionality from within the browser, but I am not certain what API to use.
Visiting chrome://usb-internals/
to inspect my device gives me the following information:
The device advertises itself with class code 8: mass storage. The device does not show up in my file system, e.g. it is not a normal USB pendrive. According to this StackOverflow answer, WebUSB is blocked from accessing mass storage devices due to security reasons, and I should use WebHID instead.
Using WebHID, however, still did not allow me to connect to my device. This is the sample code I used:
const filter = [
{
vendorId: 0xabcd, // correct VID:PID obtained via lsusb
productId: 0x1234
}
];
const [device] = await navigator.hid.requestDevice({ filter });
Furthermore, visiting chrome://device-log/
makes a distinct difference between USB and HID devices. When I plug in a mouse, for example, the Chrome device log shows that a USB HID device connected. When I plug in a USB pendrive, I get two lines in the debug log: one HID device, one mass storage device. When I plug in my proprietary drive, I get a single line: USB Mass Storage device.
How could I convince WebHID to make a connection to my proprietary mass storage device?
Not possible without major changes:
USB mss storage uses bulk endpoints, HID is transferred via Control and Interrupt end points.
You can implement both Mass storage and HID on a single USB device (with an IAD), but the bootloader code for HID would look significantly different from the mass storage one.
USB pendrives don't usually support HID unless there is an LED or button present.