How to read serial port data from JavaScript

问题:

I connected an Arduino to my laptop using USB, and I can read the serial data using Processing.

Is there any way to get this data in real time into a local webbrowser? For example, a text field that shows the value from the serial port? It does not have to be connected to the internet.

The JavaScript version of Processing does not support the following code, which would have been the ideal solution.

The Processing code is:

myPort = new Serial(this, Serial.list()[0], 9600);
// read a byte from the serial port
int inByte = myPort.read();
// print it
println(inByte);
// now send this value somewhere...?
// ehm...

回答1:

There is no way to directly access the local machine from the web browser. For security reasons browsers have very limited access to the machines resources.

To do this one option would be to write an extension for the browser of your choosing. Even though extensions also have a variety of limitations.

Option two would be to use local server to provide the functionality you need. Personally I recommend using node.js (it's light weight, fast and easy to implement). You can read/write serial data using https://github.com/rwaldron/johnny-five (as @kmas suggested) or https://github.com/voodootikigod/node-serialport and than you can use http://socket.io/ to create a simple service and connect to it though the browser. Socket.io uses WebSockets in modern browsers and works excepionally well for real-time connections.

回答2:

I had a similar problem to solve. My Data acquisition system (DAQ) (like your arduino) relays data in HTTP, TCP, FTP, as well as serial. I had to capture it on the server and then send it to my webpage in real-time.

The hack I wrote uses nodejs at the server, and connects DAQ to the server using TCP sockets using the "net" module of nodejs and connects the server to the HTML page using socket.io.

The code and context can be found in "How to get sensor data over TCP/IP in nodejs?".

I use TCP as I wanted to transmit data over a long distance. You need to modify the socket protocol to serial.

For serial-to-TCP redirection, you may use bloom from sensorMonkey for Windows or their processing sketch for *nix/Mac OS.