Socket.io 4 with express.js - query parameters missing in onconnection

Question

The query object from the client is simply missing from the handshake object on the server.

On console.log(socket) at the client, query object is shown in _opts while opts looks like -

hostname: "localhost"
path: "/socket.io"
port: "3001"
secure: false

CLIENT

import io from "socket.io-client";

this.liveChatSocket = io.connect('/app_chat', {
    transports: 'polling',
    query: {
        patientId,    // string
        type: "patient"
    }
});

setupProxy.js

const { createProxyMiddleware } = require('http-proxy-middleware');

module.exports = function (app) {
    app.use(
        ['/api', '/socket.io'],
        createProxyMiddleware({
            target: 'http://127.0.0.1:3000',
            changeOrigin: true,
            // agent: {keepAlive: true},
            ws: false,
            logLevel: 'debug'
        })
    );
};

react logs look like this. Missing query parameters

[HPM] POST /socket.io/?EIO=4&transport=polling&t=OrQI-0x&sid=_6nbcQQnHKq5NeQoAAHn -> http://127.0.0.1:3000

SERVER

index.js

const makeChatNameSpace = (live_chat) => {
    live_chat.on('any', ()=>console.log("LOG socket.io live_chat any"))

    live_chat.on('connection', function (chatSocket) {

    const { type, patientId, username } = chatSocket.handshake;
    console.log('chat.index.socket_live_chat.on.connection. Type - ', type, 'client - ', type === 'patient' ? patientId : username, 'connected');
}

module.exports.makeChatNameSpace = makeChatNameSpace

www file

let server = http.createServer(app);

const { Server } = require("socket.io");
const { createAdapter } = require("@socket.io/redis-adapter");
const { createClient } = require("redis");

const { makeChatNameSpace } = require("../chat/index");
const { makePersonaNameSpace } = require("../persona/index");

const pubClient = createClient({ url: "redis://localhost:6379" });
const subClient = pubClient.duplicate();
pubClient.connect()
subClient.connect()


const io = new Server(server, {
  adapter: createAdapter(pubClient, subClient),
  cors: { origin: "*" }
})

const live_chat = makeChatNameSpace(io.of('/app_chat'))
const persona_builder = makePersonaNameSpace(io.of('/doctor/profile'))    // working, returns void and doesn't have any query parameters

...

module.exports = { io, live_chat, persona_builder }

express logs handshake should have the query

socket.handshake =  {
  headers: {
    'sec-fetch-site': 'same-origin',
    'sec-fetch-mode': 'cors',
    'sec-fetch-dest': 'empty',
    cookie: '_ga_H66X2LFN0B=GS1.1.1706617189.135.1.1706617196.0.0.0; _ga_37ETJEX8DX=GS1.1.1706617189.127.1.1706617
196.0.0.0; _ga=GA1.1.1585282760.1686473298; sid=s%3ANAkstqaOgBRIAYmaX3P7s38jTTGs-hci.lkF7maU78Z8jxUpMckYGxbbtgMsOF
L1EV%2BfaBJcjfw8; languageSelected=en; io=Knk2BcJ2k6pk7TesAAA2; TCSESSIONID=21B11575713C1D775F8B60FE16151256; _gid
=GA1.1.631497038.1706298581',
    referer: 'http://localhost:3001/',
    connection: 'close',
    'accept-encoding': 'gzip, deflate, br',
    'accept-language': 'en-US,en;q=0.5',
    accept: '*/*',
    'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:121.0) Gecko/20100101 Firefox/121.0',
    host: '127.0.0.1:3000'
  },
  time: 'Tue Jan 30 2024 17:54:54 GMT+0530 (India Standard Time)',
  address: '::ffff:127.0.0.1',
  xdomain: false,
  secure: false,
  issued: 1706617494246,
  url: '/socket.io/?EIO=4&transport=polling&t=OrQL07M',
  query: [Object: null prototype] {
    EIO: '4',
    transport: 'polling',
    t: 'OrQL07M'
  },
  auth: {}
chat.index.socket_live_chat.on.connection. Type -  undefined client -  undefined connected

Secondary problem - whenever a new client connects to the server, there's a latency of 20s on 127.0.0.1. Working fine on the nginx server.

Answer 1

The problem is with using multiple namespaces.

https://stackoverflow.com/a/74050501/6944264 explains the detailed problem along with the solution.