Client unable to hit socket.io server

Question

Project is hosted on Digital Ocean.

On the client side, its throwing a 404 error

GET http://134.209.147.204/socket.io/?EIO=3&transport=polling&t=NKKWF-X //404

Here is the nginx config file

server {
        listen 80;
        root /var/www/html;
        location / {
                proxy_pass http://127.0.0.1:5000; (where the frontend is running)
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection "upgrade";
        }
        location /socket/ {
                proxy_pass http://localhost:3001; (where the sockets.io server is running)

        }

}

Frontend

socket = io('/socket/')

Both the frontend and backend runs without any errors and can be accessed from the browser.

You need those additional lines (`proxy_http_version`, `proxy_set_header`) for the socket.io location block. They are for WebSockets protocol support. Most probably you need those lines only for the socket.io and does not need them for the frontend (unless it uses WS protocol too). — Ivan Shatsky, Oct 10 '20 at 22:14
Try `proxy_pass http://localhost:3001/;` instead of `proxy_pass http://localhost:3001;` — Ivan Shatsky, Oct 11 '20 at 17:21
I dont think this will solve the issue because I can access {ip}/socket from the browser — rohanharikr, Oct 11 '20 at 17:48
I address [this](https://stackoverflow.com/questions/53649885/a-little-confused-about-trailing-slash-behavior-in-nginx) issue, I think it is at least worth to give it a try. — Ivan Shatsky, Oct 11 '20 at 17:54

score 1 · Accepted Answer · answered Oct 14 '20 at 11:48

After days of hacking, I was able to make it work!

nginx config

upstream websocket {
    server 127.0.0.1:3001;
}

server {
    listen 80;
    root /var/www/html;
    location / {
        proxy_pass http://127.0.0.1:8080;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }

    location /ws/ {
        proxy_pass http://websocket/socket.io/;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }
}

socket.io server

const app = require('express')();
const server = app.listen(3001);
const io = require('socket.io').listen(server);

socket.io client

 socket = io.connect('http://yourdomain/', {path: '/ws/'})

Julio Spinelli · Answer 2 · 2021-07-06T18:49:33.093

I faced the same problem when trying to connect a sockets.io application to a nodejs server that is behind an Apache2 server. I access the nodejs using /video/. I read this answer and didn't get it. Dummy me! But just in case I'm not alone, I'll attempt to clarify it further here.

I ended up having to follow the code of sockets.io to understand what they mean in the documentation. I'm such a dummy. The documentation says:

A new Socket instance is returned for the namespace specified by the pathname in the URL, defaulting to /. For example, if the url is http://localhost/users, a transport connection will be established to http://localhost and a Socket.IO connection will be established to /users

After following the code, the meaning (in my dummy's mind) became clear. The socket connection is made with the "String" that I specify in socket=io("url/video/"), but that the transport connection will be attempted to just its "url" part. To change the transport connection path, you need to specify one of the options described in the documentations for the Manager class, which are the same as the options for the io class.

Here is a link to the pertinent documentation, you need to read the io and the Manager headings.

Client unable to hit socket.io server

2 Answers2