async / await with socket.io

Question

This code send the first emit to client and client get the messageStart : 'Job is starting...' This is OK. After that the code launch puppeteer and make the screen shot example.png. This is OK too. But the second emit is not fired and not send to client. In the console.log of the server I get :

job is starting
CAPTURE FINISHED
job is finished

This is OK too.

What happened? Why is the second emit not fired?

const express = require('express');
const puppeteer = require('puppeteer')
const app = express();
const server = app.listen(3000);

app.set('view engine', 'ejs');
var io = require('socket.io').listen(server);

app.get('/', function (req, res, next) {
  res.render('index');
});

app.get('/scan', function (req, res, next) {
  console.log('job is starting');

  io.sockets.on('connection', function (socket) {
    socket.emit('messageStart', 'Job is starting...');
  });

  (async () => {
    const browser = await puppeteer.launch({headless:false});
    const page = await browser.newPage();
    await page.goto('https://example.com');
    await page.screenshot({ path: 'example.png' });
    await browser.close();
    console.log('CAPTURE FINISHED');
  })().then(()=>{
      console.log('job is finished');

      io.sockets.on('connection', function (socket) {
          socket.emit('messageEnd', 'Job is done!');
        });
    });
  res.render('scan');
});

user_6161265 · Answer

You need to listen to the connection once and emit to the socket twice.

const scanner = async () => {
  const browser = await puppeteer.launch({headless:false});
  const page = await browser.newPage();
  await page.goto('https://example.com');
  await page.screenshot({ path: 'example.png' });
  await browser.close();
  console.log('CAPTURE FINISHED');
}

app.get('/scan', async function (req, res, next) {
  // emit to all clients on start
  console.log('job is starting');
  io.emit('messageStart', 'Job is starting...');

  // do the actual stuff
  await scanner();

  // emit to all clients on finish
  console.log('job is finished');
  io.emit('messageEnd', 'Job is done!');

  res.render('scan');
});

user_429073 · Answer

Here the complete code based on code of Md. Abu Taher :

const scanner = async () => {
    // emit this message when the scan really starts
    io.sockets.on('connection', function (socket) {
        io.emit('messageDoing', 'Doing the Job ...');
    });
    const browser = await puppeteer.launch({ headless: false });
    const page = await browser.newPage();
    await page.goto('https://example.com');
    await page.screenshot({ path: 'example.png' });
    await browser.close();
    console.log('CAPTURE FINISHED');
};

app.get('/scan', async function (req, res, next) {
    // emit to all clients on start
    console.log('job is starting');
    io.sockets.on('connection', function (socket) {
        io.emit('messageStart', 'Job is starting...');
    });

    // do the actual stuff
    await scanner();

    // emit to all clients on finish
    console.log('job is finished');
    io.sockets.on('connection', function (socket) {
        io.emit('messageEnd', 'Job is done...');
    });
    res.render('scan')
});

async / await with socket.io

2 Answers