Arduino to Node.js to Air or HTML

I recently took the time to play around with node.js and it’s communication features especially serving as a communication port between arduino and a client eg. Flash or HTML.
So far I used TinkerProxy to connect Arduino to Flash. I had it running some years ago and now it turned out to be quite a hassle. So I decided to give node.js a try.

So the first step was to get Arduino and Node.js talking to each other…

1. Arduino to Node.js

This is the Arduino setup I used. A simple button and the build in LED. Check out the detailed description here: (this is where the image is coming from)

The script I’m using sends out a “1” if the button was pressed. This “1” is wrapped into a start and an end byte so that node knows where it’s coming from.

For the incoming data I’m waiting for a serialEvent. It took me quite some time to understand how incoming serial data is handled. It’s different than I expected it to be.
Serial.available() returns the number of bytes which came in. Let’s say there are 3 bytes waiting: a, b, c. Serial.available() returns 3. now returns the first byte: “a”. The funny thing is that when you call Serial.available() the next time it returns only 2. Every call “eats” the byte it returns until nothing is left.

You could do something like this:

Or like this:

This is the full arduino sketch:

On the node.js side we basically just use the serialport package to connect to the serial port in order to send and receive data to and from the Arduino.

When running this code the following should happen – first upload the sketch to the Arduino and then start the Node application:

1. In the terminal you will see the statement “open serial communication”
2. After 2 sec. Node will send “$8” to Arduino. This switches on the build in LED of the Arduino.
3. Pushing the button will print out a “1” in the terminal window

Make sure you stay with those 2 sec delay. My Arduino resets on establishing a serial port communication. It takes about 1.5 sec to get back to the normal state. If you send it earlier than 1.5 sec after the reset, this will get messed up.

One trap I ran into was that I had the serial monitor of the Arduino open. This screwed things up. As far as I understood a serial communication only works correctly between 2 partners. The serial monitor as a 3rd partner which makes things awkward. Make sure to keep it closed. What’s really annoying is that there is no nice way of debugging then… I couldn’t find a solution for this so far.

Ok, now that we got the basic communication between Arduino and Node running up to the next level:

2. Arduino to Node to Air and back

The Arduino sketch stays the same. This is the Node code:

It starts the previously discussed serial port stuff for the Arduino part and creates a socket connection to the Flash client.

This is the AS3 code:

We create a new Socket and add several event listeners to it. The one for getting the date is “ProgressEvent.SOCKET_DATA”. For sending I data I just use mouse press and release. Press will send out an “8” and release a “7” (I was too lazy creating extra buttons for this…)

When you run it – first the Arduino, second the Node app and third the Air app – you can do a mouse press (and hold) on the Air app to switch on the LED of the Arduino. Mouse release will switch it off again. When pressing the Button you will see the “1” being trace out in the Air debugger (I’m using Flash builder for that).

Pretty cool, he?!? :-)

Ok, next step:

3. Arduino to Node to HTML and back

The Arduino sketch stays the same.
The Node script has to be slightly modified. I’m using the package for the Node to HTML communication.

The HTML code looks like this:

I’m importing the “” to talk to Version 1.0 has a bug so I had to use 0.9. You’ll get it here:

So when running the code following things happen: As you can imagine, on the HTML page pressing LED on switches on the LED on the Arduino – and LED off, well, switches it off. When pressing the button on the Arduino you will see a “1” being traced in the debugger console of your browser – btw. I used chrome.

One comment about the way how I used the HTML. Lots of links I found on the web used Node to also act as a webserver which provides the HTML page (this way you don’t have to manually get the by the way). Out of a gut feeling I was a bit reluctant to this solution. I wanted not to be constrained to use node – maybe it might never happen that I need to separate node and the HTML output but anyway, its done now and it works ;-)

Happy coding ;-)

Those links were really helpful:

Leave a Reply

Your email address will not be published. Required fields are marked *