Question

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

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?


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.

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::ERR_CONNECTION_TIMED_OUT

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

This comment has been deleted

    Try DigitalOcean for free

    Click below to sign up and get $200 of credit to try our products over 60 days!

    Sign up

    Get our biweekly newsletter

    Sign up for Infrastructure as a Newsletter.

    Hollie's Hub for Good

    Working on improving health and education, reducing inequality, and spurring economic growth? We'd like to help.

    Become a contributor

    Get paid to write technical tutorials and select a tech-focused charity to receive a matching donation.

    Welcome to the developer cloud

    DigitalOcean makes it simple to launch in the cloud and scale up as you grow — whether you're running one virtual machine or ten thousand.

    Learn more
    DigitalOcean Cloud Control Panel