Socket doesn't emit within route

Question

I'm building a web app where the view needs to be updated on a data change. For this purpose I'm using socket.io. This is the setup in the server.js file:

const io = require('socket.io')(http);

/* WEB SOCKET INITIALISATION
----------------------------------------- */
io.on('connection', function(socket) {
  io.emit('new connection', 'new connection');

  socket.on('disconnect', function () {
    io.emit('offline', 'offline')
  });
});

When looking into my console, it log's 'new connection' as soon as I'm on the page. Now I want to use the socket in one of the routes i've made. To make this possible I bind io to the place where i require the route, like this:

const dashboardRouter = require('./routes/dashboard')(io);

This is how a part of the route looks like:

/* MAKE SOCKET.IO ACCESSABLE
--------------------------------------------------------------- */
module.exports = function(io) {

  /* INDEX ROUTE
  -------------------------------------------------------------- */
  router.get('/', account.checkSession, playwalls.statistics, playwalls.getYours, function(req, res, next) {
    io.emit('update', 'testen');
    res.locals.username = req.session.username;
    res.render('dashboard/index');
  });

  /* EXPORT ROUTER
  --------------------------------------------------------------- */
  return router;

}

The problem is that when I emit update, it doesn't log in the console. When I do console.log(io) inside the route, it looks like socket.io is available though. I get no errors inside the terminal console.

This is what the client side JavaScript file looks like:

(function() {

  const socket = io();

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

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

}());

What am I doing wrong here? How can I make sure that the socket emits the message? Hope someone can help me with this!

Thanks in advance.

I am not sure I am getting this right. But you're not connected to the websocket while the page/route is loading. Even if it's emitted you won't see it because your pages loads after `io.emit` has been called. Or are you making an AJAX call to the `dashboard` route ? — Brahma Dev, Sep 30 '17 at 15:00

score 1 · Accepted Answer · answered Sep 30 '17 at 15:40

This route:

  router.get('/', account.checkSession, playwalls.statistics, playwalls.getYours, function(req, res, next) {
    io.emit('update', 'testen');
    res.locals.username = req.session.username;
    res.render('dashboard/index');
  });

Will broadcast to all the other connected pages, but will not show anything for the particular user that triggered this route. That's because the user that triggered this route is in the middle of requesting and loading a page and they are not yet connected to socket.io.

The sequence of operations for the user who made this requests is as follows:

Browser closes down previous web page which includes disconnecting socket.io and shutting down Javascript.
Browser requests / URL.
Server calls your route handler for that URL.
Your route handler calls io.emit() which sends to all currently connected clients, but the client making this request is not currently connected.
Route handler renders the page and sends it back to the browser.
Browser receives and renders the page
Browser runs Javascript in the page, resulting in socket.io connection being made.

As you can see from this sequence, the browser making the request is not connected with socket.io when you call io.emit(). Basically, you can't emit to the page that is being rendered in the same route that renders it.

Thanks so much for the answer, took some time to understand it in a clear way, but after some playing, testing & debugging I've fixed the problem with a good understanding of the flow! — Camille Sébastien Niessen, Sep 30 '17 at 19:49

Socket doesn't emit within route

1 Answers1