How to activate or create an anti-clone of the same browser with several socket.io open on the same app?

[Madriix]

Hi

Let's imagine I have 2 tabs open on iPhone with 2 times the same application on in each tab (it's already happened by accident it's like clones), and there is a big conflict because the two tabs connect everything both to socket.io server, I would like to deny socket.io access to the second tab if the first one is already connected to the socket.io.
Does anyone know how to detect the same and unique browser (from a single client) with several tabs on the same socket.io application so that it does not connect to it?

Cdt

[darrachequesne]

Hi! A classic cookie should do the trick:

import { Server } from "socket.io";
import { serialize } from "cookie";

const io = new Server(httpServer, {
  allowRequest: async (req, callback) => {
    // parse the session from the request headers
    const session = await fetchSession(req);
    req.session = session;
    callback(null, true);
  }
});

// send the session cookie during the handshake
io.engine.on("initial_headers", (headers, req) => {
  headers["set-cookie"] = serialize("sid", req.session.id, { sameSite: "strict" });
});

io.use(async (socket, next) => {
  const sessionId = socket.request.session.id;

  const sockets = await io.in(sessionId).fetchSockets();

  if (sockets.length) {
    // another socket with this session ID already exist
    next(new Error("unauthorized"));
  } else {
    socket.join(sessionId);
    next();
  }
});

Reference:

• https://socket.io/docs/v4/server-api/#serverfetchsockets
• https://socket.io/docs/v4/server-api/#event-initial_headers
• https://socket.io/docs/v4/middlewares/

[Madriix]

It works fine when I replace this:
const session = await fetchSession(req);

by

const session = "test";
But it looks global for all users, so it's not an anti clone but rather a limitation to one connected in all on socket.io!

I get an error with fetchSession, it says it is not defined, what exactly should it do here?

[darrachequesne]

The fetchSession method should retrieve or create a new session from the headers of the request, and store it in a database.

I'll put a complete example in the documentation, let me get back to you.

[Madriix]

I've bookmarked the discussion to monitor from time to time

[Madriix]

Hi
Is there an equivalent to fetchSession to make it work?
How to create the session?
cdt