Question

NGINX CONFIG,SSL,NODE JS, Socket.io

Hello! I have a website that is hosted in Digital Ocean

Let’s call it https://example.com

This site has let’s encrypt for SSL certification and it is working fine it has NODE JS as the back end.

Recently I made a new NODE JS application that uses socket.io with REACT JS and runs on port 6000.

I intend to run the new app (a separate node app that runs the whole website) by using https://example.com/me/chat

so I used the below on the default config file

location /me/chat/ { proxy_pass http://localhost:6000/; }

location /me/chat {
    proxy_pass http://localhost:6000/;
}

That looks fine up to here and the web page could be loaded.

Now the problem is socket io

inside my main app in node js

const io = require("socket.io")(httpServer, {
  path: "/me/chat/socket.io/",  // I used without path too
  cors: {
    origin:
      // regarding to origin cors
  },
  "sync disconnect on unload": true,
});

Inside react JS forsocket.io-client :

const socket = io(HTTP://www.example.com/me/chat, {
  path: "/me/chat/socket.io/", // I used without path too
});

and finally, I added the following inside the Nginx default config

   location /me/chat/socket.io/ {

      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header Host $host;

      proxy_pass http://localhost:6000/; # I tested this line with http://localhost:6000/socket.io/ or http://localhost:6000/me/chat/socket.io/ too and still does not work

      proxy_http_version 1.1;
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection "upgrade";
    }

The problem is that the socket io in the server never calls when react JS calls it. On the local machine, it is working fine and the problem only happens when I move it to digital ocean and want to do Nginx settings.

Thanks for any input!


Submit an answer

This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!

Sign In or Sign Up to Answer

These answers are provided by our Community. If you find them useful, show some love by clicking the heart. If you run into issues leave a comment, or add your own answer to help others.

I also get the following errors on my client browser: ​ WebSocket connection to ‘wss://example.com/me/chat/socket.io/?EIO=4&transport=websocket&sid=p7jTQqvqDYc0_DHUAAAI’ failed: WebSocket is closed before the connection is established. value @ main.eddee9a8.js:2 ​ Error: Invalid namespace at n.value (main.eddee9a8.js:2:385370) at dl.emit (main.eddee9a8.js:2:357318) at r.value (main.eddee9a8.js:2:392124) at dl.emit (main.eddee9a8.js:2:357318) at n.value (main.eddee9a8.js:2:380063) at r.value (main.eddee9a8.js:2:392075) at dl.emit (main.eddee9a8.js:2:357318) at n.value (main.eddee9a8.js:2:373091) at dl.emit (main.eddee9a8.js:2:357318) at n.value (main.eddee9a8.js:2:359164)

Hi @sam80,

Try to add the location block at the top of the file before any other location directives in your Nginx. I feel like there is a location before the one you’ve mentioned preventing it to load properly.