I am making a website in Socket.io. But emit method not working in my code. I can't see any errors in my code. Here is my server code.

var io = require("socket.io").listen(server);

//Some external codes for running server in Node.js

io.on("connection", function(socket) {
    //This line is working.
    console.log("Socket connected.");

    io.on("requestNewMap", function(data) {
        //Create new map object in here.
        io.emit("responseNewMap", { mapData: map });
    });
});

And this is my client side javascript code.

var socket = io();

socket.on("responseNewMap", function(data) {
    var map = data.mapData;

    //Draw map in canvas's context.
});

//setInterval runs this method every 2 seconds.
function requestNewMap() {
    socket.emit("requestNewMap");
}

I am making a website in Socket.io. But emit method not working in my code. I can't see any errors in my code. Here is my server code.

var io = require("socket.io").listen(server);

//Some external codes for running server in Node.js

io.on("connection", function(socket) {
    //This line is working.
    console.log("Socket connected.");

    io.on("requestNewMap", function(data) {
        //Create new map object in here.
        io.emit("responseNewMap", { mapData: map });
    });
});

And this is my client side javascript code.

var socket = io();

socket.on("responseNewMap", function(data) {
    var map = data.mapData;

    //Draw map in canvas's context.
});

//setInterval runs this method every 2 seconds.
function requestNewMap() {
    socket.emit("requestNewMap");
}

• javascript
• node.js
• socket.io

• did you try emitting outside of connection, by the way put a log inside connection, if there is no log, there then there is no connection being made – Remario Commented Apr 14, 2017 at 15:15

6 Answers 6

This part could be wrong:

io.on("requestNewMap", function(data) {
    //Create new map object in here.
    io.emit("responseNewMap", { mapData: map });
});

I would use socket there as in:

socket.on("requestNewMap", function(data) {
    //Create new map object in here.
    socket.emit("responseNewMap", { mapData: map });
});

I think io.emit should work fine, it would just send the response to every connected client, but io.on('requestNewMap',...) won't work since requestNewMap is not an io standard event.

change this

io.on("requestNewMap", function(data) {
    //Create new map object in here.
    io.emit("responseNewMap", { mapData: map });
});

into this

socket.on("requestNewMap", function(data) {
    //Create new map object in here.
    socket.emit("responseNewMap", { mapData: map });
});

you are adding an event listener to the server object not the client socket.

I'm not certain, but I believe your problem is that your function on the client side is written like you are expective 'requestNewMap' to be passing along data. Instead of:

io.on("requestNewMap", function(data){

Try:

io.on("requestNewMap", function(){

OR pass an empty object or some other kind of junk data along with the emit from client side like this:

function requestNewMap() {
  socket.emit("requestNewMap", {});
}

function requestNewMap() {
  socket.emit("requestNewMap", undefined);
}

function requestNewMap() {
  socket.emit("requestNewMap", -1);
}

Hopefully this is helpful and correct!

Edit: This turned out to not be the answer to your question, but still something worth considering. If you're not passing data along you should avoid writing the event handler as if it expects data.

This works fine only you want to send the "responseNewMap" event back to the sender only.

socket.on("requestNewMap", function(data) {
    //Create new map object in here.
    socket.emit("responseNewMap", { mapData: map });
});

Implement this if you want to send the event back to all connected users

socket.on("requestNewMap", function(data) {
    //Create new map object in here.
    io.emit("responseNewMap", { mapData: map });
});

If you use a namespace like this:

io.of('/api/v1/chat').on('connection', function (socket) { 
//Your code here
});

Then include a namespace like this:

io.of('/api/v1/chat').emit("responseNewMap", { mapData: map })

I'm going to respond to this as a note to myself and others on the whole socket.emit is not working situation...

So I had issues with socket.emit not firing to the socket that made the initial request out. The issue was not an issue, more so the way client works. I was indeed emitting to the originator only when using socket.emit (which is what I wanted, only the requested got the response) but the issue was that I had more than one socket on in my app.

I use ES6 and imports (import 'path to socket io client js') which is also an issue without webpack unless you do it like that, as i have my own web component framework.

I had 3 components all creating a socket from io(), expecting them to use the same manager and they where not.

socket.io will not use the same manager over many mjs files all creating this.socket = io(); they are indeed all new isolated sockets! So take this in mind, you may be returning the message to the socket that sent the request out but if your listener is in another component than thats got a different socket.id and in essence is a whole new socket connection.

There is an option to pass in to io called forceNew which is true by default so it appears, but changing this still gave me the same issues albeit the ID's where all now the same, however I still could not seem to get a listening component to get responses from an action in an action component even though both had the same ID now. A bug maybe or something else, not sure.

So short answer is importing via ES6 without webpack needs to be just import 'fsdfsd.js'; and to save issues, only generate one socket and share between components, which you may want to do anyway as sockets are not cheap and you dont want to use many for one app!

This is my first time playing with sockets, they are great, but use sparingly and do not hold them open if you want authenticated people only, drop if not authed!

Hope this helps someone, had me lost for a day or too.

In my case, setting homepage to "." in package.json fixed the problem.