Introduction

What Socket.IO is

Socket.IO is a library that enables real-time, bidirectional and event-based communication between the browser and the server. It consists of:

  • a Node.js server: Source | API
  • a Javascript client library for the browser (which can be also run from Node.js): Source | API
Diagram for bidirectional communication

There are also several client implementation in other languages, which are maintained by the community:

Other server implementations:

How does that work?

The client will try to establish a WebSocket connection if possible, and will fall back on HTTP long polling if not.

WebSocket is a communication protocol which provides a full-duplex and low-latency channel between the server and the browser. More information can be found here.

So, in the best-case scenario, provided that:

  • the browser supports WebSocket (97% of all browsers in 2020)
  • there is no element (proxy, firewall, …) preventing WebSocket connections between the client and the server

you can consider the Socket.IO client as a “slight” wrapper around the WebSocket API. Instead of writing:

const socket = new WebSocket("ws://localhost:3000");

socket.onopen = () => {
socket.send("Hello!");
};

socket.onmessage = (data) => {
console.log(data);
};

You will have, on the client-side:

const socket = io("ws://localhost:3000");

socket.on("connect", () => {
// either with send()
socket.send("Hello!");

// or with emit() and custom event names
socket.emit("salutations", "Hello!", { "mr": "john" }, Uint8Array.from([1, 2, 3, 4]));
});

// handle the event sent with socket.send()
socket.on("message", data => {
console.log(data);
});

// handle the event sent with socket.emit()
socket.on("greetings", (elem1, elem2, elem3) => {
console.log(elem1, elem2, elem3);
});

The API on the server-side is similar, you also get a socket object which extends the Node.js EventEmitter class:

const io = require("socket.io")(3000);

io.on("connection", socket => {
// either with send()
socket.send("Hello!");

// or with emit() and custom event names
socket.emit("greetings", "Hey!", { "ms": "jane" }, Buffer.from([4, 3, 3, 1]));

// handle the event sent with socket.send()
socket.on("message", (data) => {
console.log(data);
});

// handle the event sent with socket.emit()
socket.on("salutations", (elem1, elem2, elem3) => {
console.log(elem1, elem2, elem3);
});
});

Socket.IO provides additional features over a plain WebSocket object, which are listed below.

But first, let’s detail what the Socket.IO library is not.

What Socket.IO is not

Socket.IO is NOT a WebSocket implementation. Although Socket.IO indeed uses WebSocket as a transport when possible, it adds additional metadata to each packet. That is why a WebSocket client will not be able to successfully connect to a Socket.IO server, and a Socket.IO client will not be able to connect to a plain WebSocket server either.

// WARNING: the client will NOT be able to connect!
const socket = io("ws://echo.websocket.org");

If you are looking for a plain WebSocket server, please take a look at ws or uWebSockets.js.

There are also talks to include a WebSocket server in the Node.js core.

On the client-side, you might be interested by the robust-websocket package.

Features

Here are the features provided by Socket.IO over plain WebSockets:

Please find more details about how it works here.

Caught a mistake? Edit this page on GitHub