Introduction to Sockets.IO in NodeJS (original) (raw)

Last Updated : 17 Feb, 2025

**Socket.IO is a popular library that is used for building real-time web applications. It allows your website and server to talk to each other instantly, making things like live chat and instant updates possible.

• Socket.IO makes it easy to manage WebSocket connections and events.
• It works even with older browsers that don’t fully support WebSockets.

**Why Use Socket.IO?

Many web applications use a client-server setup, where clients (like web browsers) request things from servers. Traditional web communication often uses HTTP, which can be slow for real-time updates and only allows one message at a time. Socket.IO solves this problem.

• Socket.IO enables instant, two-way communication between clients and servers.
• It’s more efficient than traditional HTTP for real-time applications.

Features of Socket.IO

Socket.IO, built on top of Engine.IO, offers several important features that make it a robust choice for real-time web applications:

• **Reliability: Maintains connections even when faced with network obstacles like proxies, load balancers, firewalls, and antivirus software.
• **Automatic Reconnection: The client automatically attempts to reconnect to the server if the connection is lost.
• **Disconnection Detection: Provides mechanisms for both the client and server to detect when the other party has disconnected.
• **Multiplexing: Allows multiple communication channels to operate over a single connection, improving efficiency.
• **Binary Streaming: Supports the transmission of binary data, such as ArrayBuffers and Blobs.

How Socket.IO Works?

Socket.IO consists of two main components

1. **Server-side (Node.js): Listens for incoming connections and handles events.
2. **Client-side (Browser/Frontend): Connects to the server and sends/receives messages.

How Communication Happens

1. A client connects to the **Socket.IO server.
2. The server acknowledges the connection.
3. Both parties can send and receive messages using **events.
4. If the connection is lost, Socket.IO automatically tries to reconnect.

**Installing and Setting Up Socket.IO

**Required for Installation of Sockets.IO

• **Node and NPM (node package manager) installed

1. **Server-side: Install the Socket.IO server library using npm

npm install --save socket.io

**2. Client-side: The Socket.IO client library is usually served directly from your Node.js server. You typically include it in your HTML like this

Alternatively, for use in a Node.js client (less common), you can install it via:

npm install --save socket.io-client

Example

This example demonstrates a simple upvote button using Socket.IO to show real-time communication.

**1. Project Setup: Create a project directory and initialize it with npm:

npm init -y

This creates a package.json file.

**2. Install Express.js: Install Express.js, a web framework for Node.js:

npm install --save express@4.15.2

3. **Create index.js: Create the main application file:

JavaScript `

var app = require('express')(); var http = require('http').createServer(app); const PORT = 3000;

app.get('/', function(req, res) { res.send('Hello World'); });

http.listen(PORT, function() { console.log('listening on *:' + PORT); });

`

In this example

• This code sets up a basic Express app that listens on port 3000 and sends “Hello World” to the client.

**4. Serving HTML: Serve HTML File: Modify index.js to serve an HTML file

JavaScript `

app.get('/', function(req, res) { res.sendFile(__dirname + '/public/index.html'); });

`

**5. Create index.html: Create the public directory and add index.html

html `