tam
By:
tam

How to set up Node, Socket.io, and Redis?

February 1, 2016 2.7k views
Node.js Redis Ubuntu

I am very new to the whole idea of redis and socket.io but I followed this laracast series and I was able to get basic Laravel events to broadcast successfully.

The problem arose when I tried to push my code to my droplet. First some code:

socket.js

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

redis.subscribe('test-channel');

redis.on('message', function(channel, message) {
    console.log(message);
    message = JSON.parse(message);

    io.emit(channel + ':' + message.event, message.data);
});

server.listen(3000);

main.blade.php

var socket = io('http://localhost:3000');

// not relevant stuff for using Vue.js

socket.on('test-channel:App\\Events\\EventWasCompleted', function(data) {
    // push stuff to Vue.js
}.bind(this));

routes.php

Route::get('/fire', function() {
    $i = 0;
    while ($i < 10) {
        event(new EventWasCompleted($i)); 
        $i++;
    }
    return 'Done';
});

Now what happens is when I am working locally, is that I can visit the main view and hit the localhost/fire route and my event is broadcasting correctly and the results are pushed to the main view.

However, when I tried to push to my droplet, I wasn't really sure what I needed to change if anything. I ran node socket.js on the server, and I know that it is working because I can see the results of my event in the console. The issue is that my main view does not properly receive the events. If I hit my local route localhost/fire I do catch the events on my production server. However if I send the events from droplet_IP/fire my view can't catch the events.

What do I need to change to get this to work?

3 Answers
tam February 1, 2016
Accepted Answer

Finally fixed it. I had to set the client to var socket = io('http://droplet_IP:3000'); and I had to set the server to server.listen(3000, 'droplet_IP');

I am trying to do the same,

routes.php

Route::get('/', function () {

    $data = [
        'event' => 'UserSignedUp',
        'data' => [
            'username' => 'JohnDoe'
        ]
    ];

    Redis::publish('test-channel', json_encode($data));


    return view('welcome');

});

Route::get('/visits', function(){
    $visits = Redis::set('name', 'Patrick');

    return Redis::get('name');
});

socket.js

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

redis.subscribe('test-channel');

redis.on('message', function(channel, message){

    message = JSON.parse(message);

    console.log(message);

    io.emit(channel + ':' + message.event, message.data);
});

server.listen(3000, 'mydropletip');

welcome.blade.php

            var socket = io('http://mydropletip:3000');

            var vm = new Vue({
                    el: '#app',

                    data: {
                        users: [],
                    }
            })

            socket.on('test-channel:UserSignedUp', function(data){
                    console.log('git socket in welcome');
                    vm.users.push(data.username);
            })

So far if I access '/' the console return the io emitted data.
But the browser console just returns an error.
GET http://dropletip:3000/socket.io/?EIO=3&transport=polling&t=LW0cZJd net::ERRCONNECTIONTIMED_OUT

Its also a digitalocean droplet but I user serverpilot as servermanagement.

Have another answer? Share your knowledge.