You can now officially use JavaScript to read USB devices that are connected to your computer. This is using the new WebUSB API that is still in early draft. As being so, the API could later change or be removed altogether until it receives the final verification.
In order to use WebUSB you need to be running the latest version of Google Chrome, with the experimental web platform features flag enabled. To enable it, type in chrome://flags/#enable-experimental-web-platform-features in your address bar and enable the highlighted option.
It’s also worth noting that Firefox has their own WebUSB API that is not compatible with the one Google is using.
Javascript Access USB
Here is the javascript code that will look for all available devices connected to your computer:
navigator.usb.requestDevice({ filters: [] }).then(function (device) {
console.log(device);
});
The code above calls the requestDevice method which looks for a specific device. If you know the vendor ID of your device, you can pass it in as an option to the filters array:
{ vendorId: 0x2341 }
I kept it blank so that it will show me all the usb devices connected to my computer. Then on the promise resolve, I log the device that the user has requested.
Security Limitations
Due to security limitations, this code will only work on a button click or mouse movement event. Also, the WebUSB API will only work on a site that uses HTTPS connections. However, you can still test it using the usual http://localhost. Anyway, I wrapped the code inside a click event handler:
document.querySelector('button').onclick=function () {
navigator.usb.requestDevice({ filters: [] }).then(function (device) {
console.log(device);
});
};
The user will see the following screen when they click the button:
If you look at the console log, you will see all the information about the connected USB devices.
As far as what you can do with it, you are going to be pretty limited. On the Google developer site, they showed an example where the user connects to an Arduino and sends commands.