How to Implement Ping/Pong Request for Websocket Connection Alive in JavaScript

How to implement Ping/Pong request for webSocket connection alive in javascript?

At this point in time, heartbeats are normally implemented on the server side: there's not much you can do from the client end.

However, if the server keeps killing your socket connection, and you have no control over it, it is possible for the client to send arbitrary data to the websocket on an interval:

let socket = null;

function connect_socket() {
  socket = new WebSocket(ws_url);
  socket.on("close", connect_socket); // <- rise from your grave!
  heartbeat();
}

function heartbeat() {
  if (!socket) return;
  if (socket.readyState !== 1) return;
  socket.send("heartbeat");
  setTimeout(heartbeat, 500);
}

connect_socket();

I strongly recommend trying to sort out what's happening on the server end, rather than trying to work around it on the client.

Sending websocket ping/pong frame from browser

There is no Javascript API to send ping frames or receive pong frames. This is either supported by your browser, or not. There is also no API to enable, configure or detect whether the browser supports and is using ping/pong frames. There was discussion about creating a Javascript ping/pong API for this. There is a possibility that pings may be configurable/detectable in the future, but it is unlikely that Javascript will be able to directly send and receive ping/pong frames.

However, if you control both the client and server code, then you can easily add ping/pong support at a higher level. You will need some sort of message type header/metadata in your message if you don't have that already, but that's pretty simple. Unless you are planning on sending pings hundreds of times per second or have thousands of simultaneous clients, the overhead is going to be pretty minimal to do it yourself.

Why do I need ping-pong to detect websocket connection drops if I am already reconnecting onclose()?

If the connection is explicitly closed, you will get an onclose almost immediately, but if the connection is broken, for instance when you disconnect the ethernet cable, it will take some time to get an onclose, probably not before TCP detects loss of connectivity. This can take many minutes, depending on your settings.

It doesn't have to be Ping/Pong by the way; a heartbeat sent by the server and received and processed in the browser will also work and is sometimes easier to implement.

Does socket io handle ping pong automatically?

Socket.io does that automatically for you. In socket.io circles the concept is referred to as a heartbeat mechanism instead of ping/pong.

The ping/pong intervals can be configured as well:

const httpServer = require("http").createServer();
const io = require("socket.io")(httpServer, {
  pingInterval: 10000, // how often to ping/pong.
  pingTimeout: 30000 // time after which the connection is considered timed-out.
})

From the docs:

pingTimeout
Default value: 5000

This value is used in the heartbeat mechanism, which periodically checks if the connection is still alive between the server and the client.

The server sends a ping, and if the client does not answer with a pong within pingTimeout ms, the server considers that the connection is closed.

Similarly, if the client does not receive a ping from the server within pingInterval + pingTimeout ms, the client also considers that the connection is closed.

In both cases, the disconnection reason will be: ping timeout

You should think of socket.io as an abstraction over WebSockets. It's supposed to automatically handle the trivialities of WebSocket connections so you can focus on just sending/receiving messages.

Now to answer your questions:

If socket.io doesn't handle it automatically, is it ok for creating a ping and pong events my self, client sends a ping message and server responds with a pong message in intervals.

Yes, you can, but it's utterly unnecessary since socket.io does that for you.

In order to achieve persistent socket.io connection we need ping/pong messages, am i correct?

No, again, socket.io does that for you.

If socket.io doesn't handle it automatically, is it ok for creating a ping and pong events my self, client sends a ping message and server responds with a pong message in intervals.

Again unnecessary.

---

Related Topics