Detect if a USB device is plugged in Javascript from browser - javascript

Is there Javascript based mechanism with which i can detect, through a browser, that a user has a specific usb device plugged in?

For security reasons, JavaScript in web browsers provides only restricted access to computer resources. It is not possible to store files in an arbitrary folder, start applications or communicate with a USB device.
But there are some exceptions :
In legacy browsers such as IE6 ~ IE8 you can use ActiveX objects or Java applets to achieve this .
Use a chrome.usb API .
Write a browser plugin using NPAPI , (Here, it is not for long though)

Your javascript code is sand boxed and therefore cannot access system resources such as usb devices.
I think the only way to access the USB devices would be to write a browser plugin.
How to get USB devices List from Browser

Related

Debugging from Web - Embedded boards

So excited to asks experts on this platform. I don't know where my question fits but anyone familiar with ARM mbed or dev.ti.com?
Let me give you a clue. On these website they provide an online IDE (just like desktop version) on which you can build an "Embedded Software" and download, run and Debug on some target board like (TIVA C, STM32 etc.) connected to PC. As far as i know javascript on web page doesn't have any access to local machine. So how does it access computer ports and computer drivers etc?
WEB Experts please give me a clue like how browser is allowed to access local computer resources??
In most cases, you're correct - Javascript running in your browser does not have access to many of the resources needed for reprogramming and debugging a development board.
However, there are a few ways to work around this:
1. Build development boards that can work with the hardware APIs the browser already allows access to.
This usually involves using APIs in unexpected ways. The integrated debug firmware on all mbed boards emulates a USB disk drive. The user can download the firmware file from the mbed site and then copy it onto the disk drive to install the firmware on the development board.
There are also some more creative (mis)uses of hardware APIs. For example, this Chibitronics board relies on the browser sending the new firmware via audio output. I have also heard about - but cannot find a suitable link to - an example of repurposing the U2F protocol to do double duty as a firmware update mechanism.
Because this approach repurposes existing APIs, it is generally widely supported, but requires extra work on the device side to fit a square peg into a round hole.
2. Install a native application/extension that accesses hardware and allows the website to access the hardware through the extension.
This is the approach used by TI Cloud Tools, Arduino Create, and Codebender. Once a user has installed a companion application, that application allows the website to access anything that a normal IDE would be able to access.
In a sense, this approach is very similar to building a native application with a very cloud-centric UI.
3. Extend browsers to add new hardware APIs that can be used to program development boards.
The WebBluetooth and WebUSB draft standards add new APIs to allow Javascript to access BLE and USB devices directly, which can then be used to communicate directly with connected USB debug hardware or BLE bootloaders.
micro:bit is currently testing a beta program that uses WebUSB to directly program and communicate with micro:bit boards.
These APIs are only implemented in Chrome, so they are not a universal solution. Additionally, due to security restrictions and driver issues, not all existing hardware is compatible with WebUSB.
As far as i know javascript on web page doesn't have any access to local machine. So how does it access computer ports and computer drivers etc?
You can access your local machine through a server. For example to ask it for a certain file or to run some commands/code through an API you define.
How browser is allowed to access local computer resources?
The browser is a program on your machine. The programming language(s) in which the browser was built provides interfaces to communicate with your system on a low level.
It's worth mentioning that the browser and the web application it renders are not the same and do not communicate in the same way with your system.

How to access USB device in chrome?

I need a web application which is used to copy the files from usb drive. I can write a java applet to copy the files from usb drive, but chrome will not support applet any more. Could you please suggest any alternative to this?
I need a web application not a chrome app.
Chrome 61+ has an implementation of the WebUSB API
This would not let you issue a command to the OS/File system to, for example:
copy file://some_file_location/myfile.txt to file://USB_DRIVE/some_folder/myfile.txt
Chrome would need to read the files and write to the device directly. In other words the browser would be copying the files by reading them (see below) and then writing to the USB device. This would probably be quite slow and unfeasible for large files.
Your options to read local files are:
To run chrome with the --allow-file-access-from-files flag. This is a security issue/risk, and users would need to visit your site/application with this already on.
Use the File and FileReader, or the non-standard FileSystem APIs along with a input type="file" or drag & drop
Neither of these may be applicable to your problem/solution.
I'd recommend using node.js , its cross platform and can access usb ports from web browser..
Usb Library: https://www.npmjs.com/package/usb
Proof : How to send data to USB device in node.js using libusb
Hope this helps

How can I access to USB stick from website?

I'm planning to make a login system by USB, so if you put in a USB-drive and open a specific webpage, the website asks the USB-drive for the code (e.g. by a JavaScript file, a redirect or something like that).
The problem is, because of sandboxing, you can't load or redirect to local files. I don't know a solution for this problem. Can you guys help me? I don't need specific code, just an example or something in that way.
Maybe you can read up on USB-HID. Wikipedia:
The USB human interface device class (USB HID class) is a part of the USB specification for computer peripherals: it specifies a device class (a type of computer hardware) for human interface devices such as keyboards, mice, game controllers and alphanumeric display devices.
Here are some references:
USB HID (Human Interface Device)
node-hid - Access USB HID devices from node.js
DepthJS: 'Allows any web page to interact with the Microsoft Kinect using Javascript'.
A related Stackoverflow question:
Write data to USB HID using Javascript, HTML5, or any cross platform language (supports Android)
One other possibility is to check out the Chrome HID (Human Interface Device) APIs:
Interacting with USB HID devices from web apps – via Chrome Apps, see below
Relevant Chrome API docs
Please note that for the time being, you cannot interact directly with the USB device (i.e. you cannot access any WebAPI offering that kind of fine-grained control).
Building a Chrome App (different from a Chrome Extension) may help; This article may point you in the right direction, since it also provides sample code.
The only way I can think of is putting a html file on the usb stick that essentially generates some sort of login token and gives you a link or a form to a login processor. You can then access the webpage by opening the local file first which will redirect you to the actual webpage.
This local script may include a javascript from the server to get some challenge-response-data which it hashes somehow (perhaps in combination with a password) and puts it into the form data.
Web PKI authentication from Modern Browsers may be achieved by using Browser Extension. One such extension is Signer.Digital browser extension. Use below Javascript promises from the APIs provided by Signer.Digital extension.
SignerDigital.getSelectedCertificate() to register user's certificate
SignerDigital.signHash(hash) to sign token at browser and verify at server
For all Javascript APIs refer to SO Answer https://stackoverflow.com/a/63173083/9659885
Disclaimer : I work for a company supporting the application below
Hello, you may try to use Nexu open-source application for communication with smartcards or USB tokens. It also support PKCS 12 keystores.
For example, the application is connected to the DSS webpage on the website of European Commission : see the link.

Write data to USB HID using JavaScript, HTML5, or any cross platform language (supports Android)

I've written an UI in HTML5 and JavaScript. I chose this implementation so that I could share the same code between both Android Chrome and Windows 8 RT.
Now, my next objective is to write data to a USB HID. The device that I'm communicating with is treated as an HID. I'm mentioning this part in case there's a way to write to an HID device rather than a USB RAW device.
I've done a lot of research on the matter. But, the HTML5 specifications are changing so often that maybe I missed something.
**Anyway, is there a language or implementation that I can use to share common code to access a USB device on Android and Windows 8 RT?
If there isn't a way to share between the two, how about a suggestion to get USB communication only on Android?**
Below is my research along with conclusions:
Silverlight: unsupported. In terms of web plugins, it is not supported on Windows 8 RT or Android
Flash: Possible option. It is supported in both operating systems, although they removed support for Android with release of Android 4.1 (Jelly Bean).
HTML5: unsupported
I looked at the GamePad API, but it seems to only support reading from a gamepad.
I looked at Device tag, but this tag no longer exists in the current draft. I read that the "navigator" object replaces it in JavaScript, but it seems completely different. Also, Device only targets acquiring video and audio
JavaScript: unsupported. From my understanding, this is because it'd be a security risk.
Chrome Packaged App: unsupported. I am unsure about support in Windows 8 RT. But, it is not supported in Android Chrome, either.
A USB API exists that accomplishes exactly what I need, but the API is only available to a packaged app.
Java applet: unsupported. I am unsure about support in Windows 8 RT. But, it is not supported in Android Chrome, either.
There are many resources available regarding how to communicate with USB devices. However, since Java applets aren't supported on smartphones, this ends up being unsupported.
A couple of useful posts
How can I send and receive data to a serial port or USB port in ASP.NET?
Is accessing USB from a web application for cross browser cross OS possible at all?
Is that possible to provide a JavaScript API to control USB, LPT, and COM devices?
I've actually thought about how to do things similar to this...
Here's is one way sure way to do it if you have control over the computer which has the USB device attached:
Have the computer with the USB device run a web server such as Apache and PHP. Have it only listen to localhost.
Then in the HTML page being viewed, execute an Ajax post to localhost/somescript.php (or CGI or cfm or whatever).
In the PHP/CGI script, communicate to the USB device and then return a JSON string to the browser saying something happened.
Another approach is to use custom URL protocols. You create an executable and "install" it on the client computer along with your custom URL protocol.
Then you can invoke the executable from the browser using your custom URL protocol.
There is one more alternative Web Socket.Create a web socket server which will access the usb device in local system.
Connect your web server using Web Socket from Web Application.Web Socket has standard Api
You can do something like this
var host = "wss://localhost:25000/test";
Websokcet ws = new WebSocket(host);
You can create your web sokcet Server using RFC 6455
for older browser you can think of http server as well.
Please have a look at JSFS. It works similar to Chris_vr's approach and is already a working solution.
https://github.com/jsfsproject/jsfs.
It's free and licensed under GPL.
If the USB device you want to control is a barcode printer, you can use jZebra.
This is an applet which directly communicates to locally connected printers.
Writing to a serial port:
var writeSerial = function(str) {
chrome.serial.write(connectionId, str2ab(str), onWrite);
}
// Convert string to ArrayBuffer
var str2ab = function(str) {
var buf = new ArrayBuffer(str.length);
var bufView = new Uint8Array(buf);
for (var i=0; i<str.length; i++) {
bufView[i] = str.charCodeAt(i);
}
return buf;
}
More is at http://developer.chrome.com/apps/app_hardware.html.

web application development with j2me

The main reason I'd like to use j2me is that one of its main advantages is that it can access the phone's resources through its various APIs. However, due to newer phones having web browsers like Safari, Opera, and Windows IE, it would be advantageous to build a web application so a user wouldn't have to download some software onto their phone. Is there a way I could build a web application that can also acquire resource information about the phone? Or maybe have j2me converted to Javascript (if that's even possible)?
You can make a link that would send an SMS, but other than that, there's no cross-platform api for accessing phone internals from browser, as far as I know.
So, if you've got to access phone's resources, you'll have to write a real app.
The webkit engine on recent Series60 phones has been given access to at least some phone resources.
Nokai calls it Web Runtime or WRT.
http://www.forum.nokia.com/Resources_and_Information/Documentation/

Categories