angularjs - NodeJS server on DigitalOcean using socket.io returns connection refused

Question

I was trying to introduce socket.io to my application developed in Laravel and in AngularJS.
The application works fine in my computer, nevertheless when I try to make it work on the server I get the error 'GET http://localhost:8080/socket.io/?EIO=3&transport=polling&t=LQxpNjO net::ERR_CONNECTION_REFUSED'.

The server is running Ubuntu 16.04 and I am using nginx as a web server.

This is the file which creates the nodejs server:

var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
var Redis = require('ioredis');
var redis = new Redis();

var port = 8080;

http.listen(port, function() {
  console.log('Listening on *:' + port);
});

io.on('connection', function (socket) {

  console.info('Client connected');

  redis.subscribe('counter.increase');

  redis.on('message', function (channel, message) {
    console.log('Received message ' + message + ' in channel ' + channel);

    socket.emit(channel, message);
  });

  socket.on('disconnect', function() {
    console.info('Client disconnected');
  });

});

This is the AngularJS factory that should connect to the nodejs server. Here I am using angular-socket-io:

angular.module('myServices').factory('socket', function (socketFactory) {
  var ioSocket = io.connect('http://localhost:8080');

  socket = socketFactory({
    ioSocket: ioSocket
  });

  return socket;
});

This is the configuration file of nginx (/etc/nginx/sites-available/default):

server {
    listen 80 default_server;
    listen [::]:80 default_server;

    root /var/www/html/public;
    index index.php index.html index.htm index.nginx-debian.html;

    server_name XXX.XXX.XXX.XXX;

    location / {
        try_files $uri $uri/ /index.php;
    }

    location ~ .php$ {
        include snippets/fastcgi-php.conf;
        fastcgi_pass unix:/run/php/php7.0-fpm.sock;
    }

    location ~ /.ht {
        deny all;
    }
}

How could I solve this problem?


Update 1

I updated the nginx configuration file like this:

server {
    listen 80 default_server;
    listen [::]:80 default_server;

    root /var/www/html/public;

    index index.php index.html index.htm index.nginx-debian.html;
    server_name XXX.XXX.XXX.XXX;
    location / {
        try_files $uri $uri/ /index.php;
    }

    location ~ .php$ {
        include snippets/fastcgi-php.conf;
        fastcgi_pass unix:/run/php/php7.0-fpm.sock;
    }

    location ~* .io {
        proxy_pass http://localhost:8080;
        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 ~ /.ht {
        deny all;
    }
}

upstream app_yourdomain {
    server 127.0.0.1:3000;
    keepalive 8;
}

and the AngularJS factory like this:

angular.module('myServices').factory('socket', function (socketFactory) {
  var ioSocket = io.connect('http://localhost:8080/socket.io');

  socket = socketFactory({
    ioSocket: ioSocket
  });

  return socket;
});

Now i get the following error:
- GET http://example.com/bower_components/socket.io-client/socket.io.js


Update 2

These are my nginx configuration file:

upstream app_example.com {
    server 127.0.0.1:3000;
    keepalive 8;
}

server {
    listen 80 default_server;
    listen [::]:80 default_server;

    root /var/www/html/public;

    index index.php index.html index.htm index.nginx-debian.html;

    server_name XXX.XXX.XXX.XXX;

    location / {
        # First attempt to serve request as file, then as
        # directory, then fall back to displaying a 404.
        try_files $uri $uri/ /index.php;
    }

    location ~ .php$ {
        include snippets/fastcgi-php.conf;
        fastcgi_pass unix:/run/php/php7.0-fpm.sock;
    }

    location ~ ^/(socket.io) {
        proxy_pass http://localhost:8080;
        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 ~ /.ht {
        deny all;
    }
}

and the AngularJS factory:

angular.module('myServices').factory('socket', function (socketFactory) {
  var ioSocket = io.connect('http://localhost');

  socket = socketFactory({
    ioSocket: ioSocket
  });

  return socket;
});

Working solution

Thanks to John I finally managed to make the application work.

This is nginx configuration file:

upstream app_example.com {
    server 127.0.0.1:3000;
    keepalive 8;
}

server {
    listen 80 default_server;
    listen [::]:80 default_server;

    root /var/www/html/public;

    index index.php index.html index.htm index.nginx-debian.html;

    server_name XXX.XXX.XXX.XXX;
    location / {
        try_files $uri $uri/ /index.php;
    }

    location ~ .php$ {
        include snippets/fastcgi-php.conf;
        fastcgi_pass unix:/run/php/php7.0-fpm.sock;
    }

    location ~ ^/(socket.io) {
        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 ~ /.ht {
        deny all;
    }
}

This is the AngularJS factory:

angular.module('myServices').factory('socket', function (socketFactory) {
  var ioSocket = io.connect('http://example.com');

  socket = socketFactory({
    ioSocket: ioSocket
  });

  return socket;
});

This is the nodejs server:

var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
var Redis = require('ioredis');
var redis = new Redis();

var port = 3000;

http.listen(port, function() {
  console.log('Listening on *:' + port);
});

io.on('connection', function (socket) {

  console.info('Client connected');

  redis.subscribe('counter.increase');

  redis.on('message', function (channel, message) {
    console.log('Received message ' + message + ' in channel ' + channel);

    socket.emit(channel, message);
  });

  socket.on('disconnect', function() {
    console.info('Client disconnected');
  });

});

Answer 1

Socket.io use /socket.io after your domaine name. Then you have to specify the socket.io location :

location ~* .io {
    proxy_pass http://localhost:8080;
    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;        
}

And don't forget the upstream for your node js app

upstream app_yourdomain {
    server 127.0.0.1:3000;
    keepalive 8;
}