Node.js communicating with Arduino

Posted by admin On Jan 10, 2013 In Arduino, Node.js, Protocol

This little demo I made shows that you can communicate with Arduino in a browser.

Arduino’s serial port is connected to Node.js trough the SerialPort module. SocketIO sends and recieves receives data from the browser.

How does it work ?

A big part of the Node.js application has the same setup that I described in a previous post, it contains:

index.js, the starting component that connects all the files.

server.js, initialize and handles http server, sockets and serial communication
route.js, routes a request

requestHandler.js, handles the request; sends a page to the browser

Node.js

When the HTTP Server is initialized in server.js, serial communication with Arduino can begin.

function serialListener()
{
	var receivedData = "";
	serialPort = new SerialPort(portName, {
	    baudrate: 9600,
	    // defaults for Arduino serial communication
	     dataBits: 8, 
	     parity: 'none', 
	     stopBits: 1, 
	     flowControl: false 
	});

	serialPort.on("open", function () {
	  console.log('open serial communication');
         // Listens to incoming data
	    serialPort.on('data', function(data) { 
	         receivedData += data.toString();
		  if (receivedData .indexOf('E') >= 0 && receivedData .indexOf('B') >= 0) {
         // save the data between 'B' and 'E'
		   sendData = receivedData .substring(receivedData .indexOf('B') + 1, receivedData .indexOf('E'));
		   receivedData = '';
	     }
         // send the incoming data to browser with websockets.
	   socketServer.emit('update', sendData);
	  });  
	});  
}

function serialListener()

{

var receivedData = "";

serialPort = new SerialPort(portName, {

baudrate: 9600,

// defaults for Arduino serial communication

dataBits: 8,

parity: 'none',

stopBits: 1,

flowControl: false

});

serialPort.on("open", function () {

console.log('open serial communication');

// Listens to incoming data

serialPort.on('data', function(data) {

receivedData += data.toString();

if (receivedData .indexOf('E') >= 0 && receivedData .indexOf('B') >= 0) {

// save the data between 'B' and 'E'

sendData = receivedData .substring(receivedData .indexOf('B') + 1, receivedData .indexOf('E'));

receivedData = '';

}

// send the incoming data to browser with websockets.

socketServer.emit('update', sendData);

});

}

When data is received from the web browser then Node.js sends it to the Arduino.

socket.on('buttonval', function(data) {
	serialPort.write(data + 'E');
});
socket.on('sliderval', function(data) {
	serialPort.write(data + 'P');
});

socket.on('buttonval', function(data) {

serialPort.write(data + 'E');

});

socket.on('sliderval', function(data) {

serialPort.write(data + 'P');

});

‘E’ and ‘P’ are stop characters, these values are used in the Arduino sketch to identify what to do with which LED.

Arduino

The components are set up as following. Notice the resistor between the reset and v5 pin? This is to prevent an autoreset from the Arduino when data is send to it. The value of the resistor has to be between 110Ohm and 124 Ohm (this depends on the type Arduino, see this page for more information) .

The Arduino sketch looks like this.

// LED vars 
const int ledPin = 13;
const int pwmPin = 3;

// LED read vars
String inputString = "";         // a string to hold incoming data
boolean toggleComplete = false;  // whether the string is complete
boolean pwmComplete = false;  

// Potmeter vars
const int analogInPin = A0;
int sensorValue = 0;        // value read from the potmeter
int prevValue = 0;          // previous value from the potmeter

void setup() {
  // initialize serial:
  Serial.begin(9600);
  // init LEDS
  pinMode(ledPin,OUTPUT);
  pinMode(pwmPin,OUTPUT);
  digitalWrite(ledPin,0);
  analogWrite(pwmPin,0);
}

void loop() {
   // Recieve data from Node and write it to a String
   while (Serial.available() && toggleComplete == false && pwmComplete == false) {
    char inChar = (char)Serial.read();
    if(inChar == 'E'){ // end character for toggle LED
     toggleComplete = true;
    }
    if(inChar == 'P'){// end character for dim LED
      pwmComplete = true;
    }
    else{
      inputString += inChar; 
    }
  }
  // Toggle LED 13
  if(!Serial.available() && toggleComplete == true)
  {
    // convert String to int. 
    int recievedVal = stringToInt();

    if(recievedVal == 0)
    {
      digitalWrite(ledPin,recievedVal);
    }
    else if(recievedVal == 1)
    {
      digitalWrite(ledPin,recievedVal);
    }    
    toggleComplete = false;
  }
  // Dim LED 3
  if(!Serial.available() && pwmComplete == true)
  {
    // convert String to int
    int recievedVal = stringToInt();
    analogWrite(pwmPin,recievedVal);
    pwmComplete = false;
  }
    // Potmeter
     sensorValue = analogRead(analogInPin);   
    // read the analog in value:
    if(prevValue != sensorValue){
      Serial.print("B"); // begin character 
      Serial.print(sensorValue);  
      Serial.print("E"); // end character
      prevValue = sensorValue;
    }  
  delay(50); // give the Arduino some breathing room.
}

int stringToInt()
{
    char charHolder[inputString.length()+1];
    inputString.toCharArray(charHolder,inputString.length()+1);
    inputString = "";
    int _recievedVal = atoi(charHolder);
    return _recievedVal;
}

// LED vars

const int ledPin = 13;

const int pwmPin = 3;

// LED read vars

String inputString = ""; // a string to hold incoming data

boolean toggleComplete = false; // whether the string is complete

boolean pwmComplete = false;

// Potmeter vars

const int analogInPin = A0;

int sensorValue = 0; // value read from the potmeter

int prevValue = 0; // previous value from the potmeter

void setup() {

// initialize serial:

Serial.begin(9600);

// init LEDS

pinMode(ledPin,OUTPUT);

pinMode(pwmPin,OUTPUT);

digitalWrite(ledPin,0);

analogWrite(pwmPin,0);

}

void loop() {

// Recieve data from Node and write it to a String

while (Serial.available() && toggleComplete == false && pwmComplete == false) {

char inChar = (char)Serial.read();

if(inChar == 'E'){ // end character for toggle LED

toggleComplete = true;

}

if(inChar == 'P'){// end character for dim LED

pwmComplete = true;

}

else{

inputString += inChar;

}

// Toggle LED 13

if(!Serial.available() && toggleComplete == true)

{

// convert String to int.

int recievedVal = stringToInt();

if(recievedVal == 0)

{

digitalWrite(ledPin,recievedVal);

}

else if(recievedVal == 1)

{

digitalWrite(ledPin,recievedVal);

}

toggleComplete = false;

}

// Dim LED 3

if(!Serial.available() && pwmComplete == true)

{

// convert String to int

int recievedVal = stringToInt();

analogWrite(pwmPin,recievedVal);

pwmComplete = false;

}

// Potmeter

sensorValue = analogRead(analogInPin);

// read the analog in value:

if(prevValue != sensorValue){

Serial.print("B"); // begin character

Serial.print(sensorValue);

Serial.print("E"); // end character

prevValue = sensorValue;

}

delay(50); // give the Arduino some breathing room.

}

int stringToInt()

{

char charHolder[inputString.length()+1];

inputString.toCharArray(charHolder,inputString.length()+1);

inputString = "";

int _recievedVal = atoi(charHolder);

return _recievedVal;

}

Conclusion

Communication between Arduino and Node.js works pretty well. Although there were some problems with the speed of the communication; if the browser sends every value when the slider sliders, the Arduino can’t handle the incoming data. I need to delve deeper into all of this to find a possible solution (or some sort of workaround).

Download

Download the Node.js files and the Arduino sketch.

35 Comments

Jan on Nov 11, 2014 Reply

Same issue as Ray has, also tested on FF33.1, en IE11. Help welcome!
Clear tutorial Barry. Go on!

Grtz Jan
Raj on Nov 10, 2014 Reply

Great article! I am trying to use some of these ideas to monitor a sump pump and with sensors connected to an arduino and be able to monitor water levels and pump activity on a web page and have got the sensor parts working separately. I tried your JS code and noticed that my browser does not auto update the yellow bar graph continually (as seen in the youtube demo). I have correct values coming in between the E and P markers (later I intend to change that part to JSON to distinguish between different types of data). The yellow bar displays the new values only when I refresh the browser. Could you give me some pointers as to where I need to look to figure out why the auto update isn’t working. I am using chrome on a debian laptop. I’ll test this behavior from a windows browser later tonight.

Thanks in advance.
- Raj on Nov 12, 2014 Reply
  
  Ok-by putting debug prints I found out a few bugs (maybe the link to the source zip file that you gave might not be the latest). In the interface.html file, function initSocketIO the line iosocket.on(‘update’, function(recievedData) should be changed to iosocket.on(‘updateData’,function(recievdData) as there is no ‘update’ being sent from Arduino, I can see updateData being sent from the Arduino. Also I did not understand how pollOneH is used. If I change the following line pollOneH = recievedData.pollOneValue/2; to be just pollOneH = recievedData; then it works. Trying to console.log (recievedData.poolOneValue) (for debugging) give a NaN. But now that I have the basic dataflow working from my sensor via Arduberry to a Pi to a browser running I can tailor stuff to my needs. Thanks for your tutorial.
  - admin on Nov 12, 2014 Reply
    
    My guess is that the Node.js modules are updated and that my example isn’t compatible with the newer version of socket.io. Check Matt Bighams comments for a possible solution.
    
    When I’ve got time (and a decent internet connection) I will try to update my download.

matt bigham on Aug 18, 2014 Reply

Hello,

Your example is exactly what I have been looking for, except that the graph does not respond to the potentiometer. I am running node v0.10.28 and socket.io 2.0.0-alpha-5. I suspect that socket.io has changed since you wrote your example. I have tried your code on linux, mac and windows7 with the same results. I am new to node and have not been able to troubleshoot the problem.

thank you for your time.
Matt Bigham

admin on Aug 28, 2014 Reply

Hi Matt,

I’m fairly busy at the moment, so I can’t guarantee that I can find the problem and/or update the application anytime soon. The only advice I can give you right now is to check what has changed in the Socket.io package and rewrite that part…

Good luck,

Barry

matt bigham on Sep 03, 2014 Reply

Hi Barry,

i got this one to work, i think it has something to do with namespace. i will play with it some more.

Matt

function SocketIO_serialemit(sendData){
      console.log("serial emit: ",sendData);
      socketServer.emit('updateData',{pollOneValue:sendData});
      //socketServer.emit('update', sendData);
}


// Listen to serial port
function serialListener(debug) {
  var receivedData = "";
  serialPort = new SerialPort(portName, {
    baudrate: 9600,
    // defaults for Arduino serial communication
    dataBits: 8,
    parity: 'none',
    stopBits: 1,
    flowControl: false
  });

  serialPort.on("open", function () {
    console.log('open serial communication');
    // Listens to incoming data
    serialPort.on('data', function(data) {
      receivedData += data.toString();
      if (receivedData .indexOf('E') >= 0 && receivedData .indexOf('B') >= 0) {
        sendData = receivedData .substring(receivedData .indexOf('B') + 1, receivedData .indexOf('E'));
        receivedData = '';
      }
      // send the incoming data to browser with websockets.
      //console.log("serial emit: ",sendData);
      //socketServer.emit('update', sendData);
      SocketIO_serialemit(sendData);

      //console.log("Session: ",util.inspect(socketServer));
      //console.log("Session: %j",socketServer);

      //Dumper.alert(socketServer);
    });
  });
}

function SocketIO_serialemit(sendData){

console.log("serial emit: ",sendData);

socketServer.emit('updateData',{pollOneValue:sendData});

//socketServer.emit('update', sendData);

}

// Listen to serial port

function serialListener(debug) {

var receivedData = "";

serialPort = new SerialPort(portName, {

baudrate: 9600,

// defaults for Arduino serial communication

dataBits: 8,

parity: 'none',

stopBits: 1,

flowControl: false

});

serialPort.on("open", function () {

console.log('open serial communication');

// Listens to incoming data

serialPort.on('data', function(data) {

receivedData += data.toString();

if (receivedData .indexOf('E') >= 0 && receivedData .indexOf('B') >= 0) {

sendData = receivedData .substring(receivedData .indexOf('B') + 1, receivedData .indexOf('E'));

receivedData = '';

}

// send the incoming data to browser with websockets.

//console.log("serial emit: ",sendData);

//socketServer.emit('update', sendData);

SocketIO_serialemit(sendData);

//console.log("Session: ",util.inspect(socketServer));

//console.log("Session: %j",socketServer);

//Dumper.alert(socketServer);

});

}

matt bigham on Sep 04, 2014 Reply

Hi Barry,

this one also works using eventEmitter, below are listed the changes to server.js

url = require(“url”),
// mpb; 20140904; added
EventEmitter = require(“events”).EventEmitter,
SerialPort = require(“serialport”).SerialPort;

// mpb; 20140904; added
var ee = new EventEmitter();
var socketServer;

// mpb; 20140904; added
//socketServer.on(‘update’, function(data) {
ee.on(‘update’, function(data) {
socket.emit(‘updateData’,{pollOneValue:data});
});

// mpb; 20140904; added
//socketServer.emit(‘update’, sendData);
ee.emit(‘update’, sendData);

if you would like i can send you the file.

thank you again for a great example to work with.

Matt

Rui Santos on Jul 19, 2014 Reply

Hi barry,
This was a great tutorial! I hope you make more soon!
I was searching all around the web for something with nodejs + arduino. No luck so far, until I find your code that actually works! thank you so much for sharing.
Now i can build upon your work also post on my website in a few weeks.

Have a nice day,
Rui Santos
- admin on Aug 05, 2014 Reply
  
  Thanks Rui!

Kris on Apr 24, 2014 Reply

Hello,

I have the following problem:

I would like to display the status of attached pins (HIGH / LOW) on the web server.

Your code (webserver -> arduino) I understand but I do not understand how it works (potentiometer -> Web server)?

I would ask for a simple example of what I have to put the code in files ArduinoNodeJS.ino, server.js and interface.html.

Switching pin can be presented using a simple text on the screen in a web server (pin ON / pin OFF).

admin on May 05, 2014 Reply

First of all you have to send the data to the server when it is changed.
For example, if digitalpin 1 and 4 are changed from LOW to HIGH then you want to send the data to the server.
This can be done in the same way as with the potentiometer.

  int d1value = 0; 
  int d4value = 0; 
  
  if(digitalRead(1) != d1value)
  {
    Serial.print("B"); // begin character 
	Serial.print("D1"); // Digital 1 identifier
    Serial.print(d1value);  
    Serial.print("E"); // end character
    d1value = digitalRead(1);
   }  
   
  if(digitalRead(4) != d4value)
  {
    Serial.print("B"); // begin character 
	Serial.print("D4"); // Digital 4 identifier
    Serial.print(d4value);  
    Serial.print("E"); // end character
    d1value = digitalRead(4);
   }

int d1value = 0;

int d4value = 0;

if(digitalRead(1) != d1value)

{

Serial.print("B"); // begin character

Serial.print("D1"); // Digital 1 identifier

Serial.print(d1value);

Serial.print("E"); // end character

d1value = digitalRead(1);

}

if(digitalRead(4) != d4value)

{

Serial.print("B"); // begin character

Serial.print("D4"); // Digital 4 identifier

Serial.print(d4value);

Serial.print("E"); // end character

d1value = digitalRead(4);

}

In Node.js you need to listen to the incoming data and make a substring of this data (See code-snippet SerialPort init and incoming data listener).

In the case of the changing of digitalPin1 the string ‘sendData’ will contain D11 (digitalPin1 with the value of 1 (HIGH)). You can send this data to the page where you can break the incoming data further down with substring or indexOf (D11 = Digital, Pin, PinStatus) and do something with this.

// in the iosocket.on update function
if(pin1Status != currentPin1Status)
{
	// toggle a radiobox or animate something cool
	currentPin1Status = pin1Status;
}

// in the iosocket.on update function

if(pin1Status != currentPin1Status)

{

// toggle a radiobox or animate something cool

currentPin1Status = pin1Status;

}

Claudio O on Feb 11, 2014 Reply

it´s possible to retrieving real time weight from a digital scale conected to a pc via serial port?
- admin on Feb 13, 2014 Reply
  
  If you can find a way to connect the digital scale to your pc, then it’s probably possible. However I think you might need to do some hacking on the digital scale. For examples, help and inspiration I would recommend to take a look at the Arduino forum.
  - Claudio O on Feb 14, 2014 Reply
    
    i have one digital scale, and a serial usb-cable that creates a virtual com port.
  - Claudio O on Mar 11, 2014 Reply
    
    Barry, finally i have success retrieving data from a digital scale+usb-serial cable+nodejs+serial.io, but i can´t display the weight displayed in node console into a web, just display one value and nothing happend after that.
    if u culd help me i really apreciatte it.
    
    Claudio.
    
    James on Apr 06, 2014 Reply
    
    Claudio, if you want the web page to update with every change, you’ll need to use something like socket.io to “push” the value to some javascript waiting on the client side (browser side) to consume the update and update the display.
    
    Cheers
Will Dixon on Dec 31, 2013 Reply

Thank you for so much information in such a short tutorial. I am creating something that requires me to communicate my Raspberry Pi to my Arduino. There are many tutorials online for this but it did not make sense till I read this article. I was wondering how you would like me to mention you in the README file for github. I edited the server.js and interfaces.html mainly. But everything else is yours. Just let me know and it will happen. Thanks again.

https://github.com/clemmen2/Pi2Arduino
Ed on Nov 27, 2013 Reply

Any way I can get a look at your html file for that bar? I am in the last part of getting this to work.
- admin on Nov 27, 2013 Reply
  
  Of course! You can download the demo files at the end of the blog post (or click here). The HTML file can be found at pages/interface.html. Look for the function animation() at line 57.
Akhyar on Nov 22, 2013 Reply

Could you please explain more further why we have to define E and P as the end variable on arduino?
- admin on Nov 22, 2013 Reply
  
  The E and P characters are identifiers, in this case for the two different LEDs. If the toggle LED button on the website is clicked then the server will send 1E.
  
  The Arduino will listen for serial data in the loop. If there is data then Arduino will write this character to String inputString. If the incoming character is ‘E’ then the Arduino will set the boolean toggleComplete to true. The Arduino can now run the if statement on line 40.
  
  Hope it helps!
lucas on Nov 16, 2013 Reply

Good night, i am testing the example and my command takes too long (more than a minute) to get to the arduino. Sometimes does not work , and is not logging anything. Does it takes some kind of aditional config to work properly? thank you.
- admin on Nov 16, 2013 Reply
  
  Did you set portName (server.js) to your Arduino port name? Also what type of Arduino do you have? How is your Arduino behaving when you receive data in the IDE’s serial monitor?
Marcos Eduardo on Oct 29, 2013 Reply

Could you please explain better how do you created that yellow bar?

Is that flash?

Thank you.
- admin on Oct 29, 2013 Reply
  
  The yellow graph is created with HTML5 canvas. The size of the graph is in direct correlation with the value of the potentiometer. Check out this site for a introduction to the canvas. Also take a look over here to get an impression for what is possible with the canvas.
gapmah on Oct 19, 2013 Reply

Great code ! Good initiative. Would you have any idea or advices on how to deploy it whit providers so that people could read or interact with these data ?
- admin on Oct 21, 2013 Reply
  
  You could do a few things actually.
  
  1. Set up a server and host it yourself (this requires a stable internet connection).
  2. Set up a local server and let it communicate with an hosted server (I made a quick sketch of this option). Maybe you can use a Raspberry PI for the local server to keep it low cost (or use the GPIO pins on the PI instead of an Arduino).
  3. Use an Arduino with a Ethernet/Wireless shield and let it communicate with a hosted server.
  - Nicole on Jul 14, 2014 Reply
    
    If I were to use the 3rd option, how do I connect the Arduino to the server via web socket or node js? I notice that in the sketch, there’s no code connecting to a server or anything; just lines asking if serial is available. THANKS : )
    
    admin on Aug 05, 2014 Reply
    
    I think the easiest way is to connect to the node.js server via a tcp or udp socket. You are right.. there is no code for this in the current sketch, this is a proof of concept and you can build your own preferences upon this sketch. However, in your case this is easily done with the ethernet shield libraries (If I remember correct. I don’t own a ethernet shield and it has been awhile since I’ve worked with one).

subhendu on Jul 19, 2013 Reply

This is the only place where i could implement as mentioned. But, I want a small help. I have two ping sensors. I could see their output in my arduino serial port. Can u please help me with server.js(HHTP server) module specifically in function serialListener() – will read to variables and send them to HTML.
Thanks in advance

admin on Jul 25, 2013 Reply

To send two signals you will first need to configure the Arduino sketch so that Node.js can parse the data.

Serial.print("B"); // begin character 
Serial.print(sensorValue1);  
Serial.print(","); 
Serial.print(sensorValue2);  
Serial.print("E"); // end character

Serial.print("B"); // begin character

Serial.print(sensorValue1);

Serial.print(",");

Serial.print(sensorValue2);

Serial.print("E"); // end character

Now go to server.js, serialListener() and dissect the data.

if (receivedData .indexOf('E') >= 0 && receivedData .indexOf('B') >= 0) {
  sendData = receivedData .substring(receivedData .indexOf('B') + 1, receivedData .indexOf('E'));
  
  // Node.js will split the string (at , ) into an array of substrings, s[0] will be sensorValue1, s[1] sensorValue2
  var s = sendData.split(",");
 
  // For debugging, is the data correct? 
  console.log(s[0]); 
  console.log(s[1]);
  receivedData = '';
}

if (receivedData .indexOf('E') >= 0 && receivedData .indexOf('B') >= 0) {

sendData = receivedData .substring(receivedData .indexOf('B') + 1, receivedData .indexOf('E'));

// Node.js will split the string (at , ) into an array of substrings, s[0] will be sensorValue1, s[1] sensorValue2

var s = sendData.split(",");

// For debugging, is the data correct?

console.log(s[0]);

console.log(s[1]);

receivedData = '';

}

s needs to be a global variable. Use socketServer.emit(); to send the data to the browser.

Cancel reply

Blog

Node.js communicating with Arduino

How does it work ?

Node.js

Arduino

Conclusion

Download

35 Comments

Recent Posts

Recent Comments

Archives

Categories