Home » NodeMCU » Web Server with NodeMCU WebSocket
NodeMCU WiFi Access Point

Web Server with NodeMCU WebSocket

Uploading sensor data to web servers is one of the core ideas for Internet of Things (IoT). Such data are often small-sized and are continuously updated over time. And while HTTP performs satisfactorily for simple applications, like how I showed in my NodeMCU web server tutorial, there is a need for a much better method when speed and data-size are critical factors. I’ve already shown how to use MQTT as a faster and lightweight alternative to HTTP. In this tutorial, I will demonstrate how to use NodeMCU WebSocket.

Introduction to WebSocket

WebSocket, like HTTP, is a communications protocol over TCP. The key differences between WebSocket and HTTP is that the former operates full-duplex, bi-directional and at single TCP connection.

Full-duplex means two objects communicating with each other can send and receive messages simultaneously, like when you’re talking over the telephone. In contrast, half-duplex is non-simultaneous messaging, like when you’re using a walkie-talkie. A full-duplex system is faster than a half-duplex system.

websocket vs http
WebSocket vs. HTTP via DevCentral

As a consequence of being full-duplex, WebSocket is also bidirectional. The client always initiates the communication in HTTP. The client or the server can initiate the communication in WebSocket.

Finally, WebSocket is established in a single TCP connection. The request-response pattern needs to be repeated for every HTTP request by the client.


NodeMCU WebSocket Library

A WebSocket library for NodeMCU using the Arduino IDE can be downloaded in this repository.

Extract the library to the Arduino libraries folder and then restart the IDE (if it was open when you were downloading the library).

The library has plenty of examples (File -> Examples ->WebSockets). I will create my own code here that is similar to the one on the NodeMCU web server tutorial via HTTP:

Upload the code to your NodeMCU and, if successful, open Arduino's serial monitor to see something like this:

Then go to your preferred web browser and type in the address of the NodeMCU (shown in the screenshot above) on the address bar. You should see something like this:

To see what this code does, wire a LED to D7 (which is GPIO #13) on your NodeMCU.

Then click the buttons on the web page. The LED should respond to the button press:

nodemcu blink

Explaining the Code

There are a few differences here with my code using HTTP. First is the declaration of the WebSocket object:

The WebSocket server must be on a different port to HTTP (which is 80). Here it’s on port 81. Then we need to start the WebSocket connection using begin()

The onEvent() function calls the webSocketEvent() function when data is received via WebSocket. The webSocketEvent():

This function simply prints the data via WebSocket to the serial port. Here, we are waiting for a text type response but there are other types of responses:

We also need to add a  webSocket.loop() call on the loop() function to keep the connection alive.

Another advantage of using WebSocket is that you can send or receive data on the server without refreshing the page, like in the NodeMCU Ajax tutorial but easier. I will discuss this on my future tutorials.

I suggest you explore all the given examples on the library to learn more. Also, feel free to drop a comment if you want a solution for a problem you are experiencing on a project related to this topic. Have fun!


Check Also

NodeMCU Webserver

NodeMCU MQTT Tutorial

So far, we've been using HTTP in our NodeMCU web servers and while it works, …

Leave a Reply

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