Socket.emit() and/or socket.on() not working

Question

I am making a game using node.js and socket.io and I just want to send a variable to the client using socket.emit() and socket.on(). However, this does not seem to work and I am not exactly sure why. I have made a condensed program to see if I am even writing this correctly, as I am very new to socket.io.

 //server var express = require('express'); var app = express(); var serv = require('http').Server(app); app.get('/', function(req, res) { res.sendFile(__dirname + '/client/index.html'); }); app.use('/client', express.static(__dirname + '/client')); serv.listen(2000); console.log('Server started.'); var SOCKET_LIST = {}; var PLAYER_LIST = {}; var optypes = [Math.floor(Math.random()*6), Math.floor(Math.random()*6), Math.floor(Math.random()*6), Math.floor(Math.random()*6)] var op1 = { x: 450, y: 600, type: optypes[0] } socket.emit('operations', op1); 

 <canvas id="ctx" width="900" height="1400" style="border:1px solid #000000;"></canvas> <script src="https://cdn.socket.io/socket.io-1.4.5.js"></script> <script> //client var ctx = document.getElementById("ctx").getContext("2d"); ctx.font = '30px Arial'; var socket = io(); socket.on('operations', function(data) { console.log(data); }); </script> 

Is it the socket.emit? Is it the socket.on? Is it both? Why am I not receiving the variable op1 in the console?

Thanks in advance!!!

Answer 1

You should emit after the connection . Otherwise client is not going to receive it. Change your sever code with below

Server

var express = require('express');
var app = express();
var serv = require('http').Server(app);
var io = require('socket.io')(serv);
app.get('/', function(req, res) {
    res.sendFile(__dirname + '/client/index.html');
});
app.use('/client', express.static(__dirname + '/client'));
serv.listen(2000);
console.log('Server started.');
var SOCKET_LIST = {};
var PLAYER_LIST = {};
var optypes = [Math.floor(Math.random()*6), Math.floor(Math.random()*6), Math.floor(Math.random()*6), Math.floor(Math.random()*6)]
var op1 = {
    x: 450,
    y: 600,
    type: optypes[0]
}
io.on('connection',(socket) =>{
    socket.emit('operations', op1);
})

Answer 2

You have not specified any socket io library in your server code. In order to emit a socket you have to wait until the connection to be established.

//server

var express = require('express');
var app = express();
var serv = require('http').Server(app);
var socketio = require('socket.io')(serv);

app.get('/', function(req, res) {
    res.sendFile(__dirname + '/client/index.html');
});
app.use('/client', express.static(__dirname + '/client'));

serv.listen(2000);
console.log('Server started.');

var SOCKET_LIST = {};

var PLAYER_LIST = {};

var optypes = [Math.floor(Math.random()*6), Math.floor(Math.random()*6), Math.floor(Math.random()*6), Math.floor(Math.random()*6)]

var op1 = {
    x: 450,
    y: 600,
    type: optypes[0]
}

var connection = socketio
  .on('connection', function (socket) {
    socket.emit('operations', op1);
});

Also you need to specify which server you are connecting to in your client code. If you are running your socket server on port 2000 you have to specify which server to connect to.

<canvas id="ctx" width="900" height="1400" style="border:1px solid #000000;"></canvas>

<script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
<script>

//client

var ctx = document.getElementById("ctx").getContext("2d");
    ctx.font = '30px Arial';

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


    socket.on('operations', function(data) {
        console.log(data);        
    });

</script>