Invalid namespace in production

[amine-abdelli]

Hi everyone,

I'm trying to access my socket.io server from a next.js frontend. when i run curl 'url-of-my-server' it respond properly but i get this message in the network and can't communicate with it. Everything runs in a nginx server in my VPS.

Here's the way i've setup everything

CLIENT

import io, { Socket } from 'socket.io-client';

const ENDPOINT = process.env.SOCKET_URL || 'http://localhost:4001';
const socket = io(ENDPOINT, {
  transports: ['websocket'],
  autoConnect: false,
});

export { socket };

SERVER

import http from 'http';
const app_socket = express();
const socketServer = http.createServer(app_socket);
const io = require('socket.io')(socketServer, {
  cors: {
    origin: process.env.FRONTEND_URL || 'http://localhost:3000',
    methods: ['GET', 'POST'],
    credentials: true,
  },
});
socketServer.listen(SOCKET_SERVER_PORT, () => log.info(`Websocket server running on port ${process.env.SOCKET_SERVER_PORT}`));

Frontend runs on https://www.my-domain.com and socket server on https://www.my-domain.com/socket (as set in nginx config)

[darrachequesne]

Hi! The screenshot suggests you are trying to reach the /socket namespace, which does not exist on the server.

Are you looking for the path option instead?

const socket = io(ENDPOINT, {
  path: "/socket",
  transports: ['websocket'],
  autoConnect: false,
});

Reference: https://socket.io/docs/v4/client-options/#path

[amine-abdelli]

I'm trying to reach my-domain.com/socket because in my nginx server (running in my vps where the project is running) i use a reverse proxy to reach http://localhost:4001 everytime /socket is hit (see code sample below). When i curl my-domain.com/socket i get the correct answer from server so i know it is running properly at this url. I've also try to add path: '/socket' but it is not working out for me.

/etc/nginx/sites-available/my-domain

server {

  root /var/www/my-domain/html;
  index index.html index.htm index.nginx-debian.html;
  server_name my-domain.com www.my-domain.com;

  location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
  }

  location /socket {
        proxy_pass http://localhost:4001;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
  }
}```

[darrachequesne]

Did you set the path on both sides? Server and client?

[amine-abdelli]

No i hadn't. But now it's working that's awesome, thank you ! :)