socket io client net::ERR_CONNECTION_REFUSED

Question

I am currently building a todo application with real time notifications.

CONTEXT I build the backend with PHP (Laravel 4) and the front-end with AngularJS (yeoman:generator-angular). These two applications are not on the same domain (backend.herokuapp.com and frontend.herokuapp.com). The client talks to the server through a public API.

I want to add real time notification to the Angular application, when a user create a new todo, I want the UI to be updated on all connected browsers.

SERVER I am using https://github.com/Wisembly/elephant.io for the PHP and the server of the "emitter example". When a hit a url of my API, the PHP client emit an event on the nodejs server. This is currently working, but ONLY if the server is in the same domain than the PHP server.

here is the configuration of the Laravel application

+ app
    + controllers
        - AlertsController.php
+ push
    - server.js

AlertsController.php

class AlertsController extends ApiController
{
    public function index($userId = null)
    {
        $client = new Client(new Version1X('http://localhost:1337'));
        $client->initialize();
        $client->emit('broadcast', ['foo' => 'bar']);
        $client->close();
    }
}

server.js

var server = require('http').createServer(),
    io     = require('socket.io')(server),
    logger = require('winston'),
    port   = 1337;

// Logger config
logger.remove(logger.transports.Console);
logger.add(logger.transports.Console, {colorize : true, timestamp : true});
logger.info('SocketIO > listening on port ' + port);

io.on('connection', function (socket) {
    var nb = 0;

    logger.info('SocketIO > Connected socket ' + socket.id);

    socket.on('broadcast', function (message) {
        ++nb;
        console.log("broadcast !");
        logger.info('ElephantIO broadcast > ' + JSON.stringify(message));

        io.emit('alert.created', JSON.stringify(message));
    });

    socket.on('disconnect', function () {
        logger.info('SocketIO : Received ' + nb + ' messages');
        logger.info('SocketIO > Disconnected socket ' + socket.id);
    });
});

server.listen(port);

I launch my server.js file by npm start . I am using Homestead for Laravel.

CLIENT My client is on another application so I imported https://github.com/automattic/socket.io-client in my bower file and included in the project. This file is correctly imported (200 OK in networks panel of Chrome development tool). The problem is when I set my io connection, I have "GET http://127.0.0.1:1337/socket.io/?EIO=3&transport=polling&t=1426617086753-0 net::ERR_CONNECTION_REFUSED" in the console panel.

I am using Grunt to create a webserver.

Here what I did in the client file :

var socket = io.connect("http://127.0.0.1:1337");
socket.on('alert.created', function (msg) {
    console.log("new alert created", msg);
});

Does somebody know where the problem can come from ? It is weird, I can have a connection between PHP and NodeJS but not between my NodeJS server and my JavaScript client.

Answer 1

Ok, I found how to solve my problem.

I removed the nodejs server from Homestead and launched it outside. Then in my Laravel application I changed 127.0.0.1 to my ip address.

Everything works fine now.

Thanks guys !

Answer 2

I just had the same problem. This is because you're using a Virtual Machine and you need to explicit the port forwarding.

in .homestead/ edit Homestead.yaml as follow:

ports:
    - send: 1337
      to: 1337
      protocol: tcp

Restart your VM and it should work as intended.