How to notify front-end from backend?

Question

I am using multer for file uploading. On the server I have this:

stream.on('finish', () => {                                                                              
  console.log('finished')                                                                                
  next()
})

What would be the best way (with what command) to notify the frontend that 'finished' has happened? I want to know this in order to have a loading bar.

That's what websockets are for. The server can send data to the client, and vice-versa. Check out socket.io. Server : `socket.emit("upload finished")`, client : `socket.on("upload finished", function...)` — Jeremy Thille, Jun 08 '17 at 07:10
I've added that as an answer, I'd appreciate if you could validate it :) — Jeremy Thille, Jun 08 '17 at 07:13

score 4 · Accepted Answer · answered Jun 08 '17 at 07:12

4

That's what websockets are for. The server can send data to the client, and vice-versa. Check out socket.io.

Server : socket.emit("upload finished")

Client : socket.on("upload finished", function...)

answered Jun 08 '17 at 07:12

Jeremy Thille

21,780
7
36
54

score 1 · Answer 2 · answered Jun 08 '17 at 08:14

1

While Jeremy Thille 's answer works well, beware of broadcasting event to all.

Socket.emit() simply broadcasts message to all connected clients.

So you need to store the client id of the uploader and notify the progress only to that client and not all. Refer this.

answered Jun 08 '17 at 08:14

vinoth h

471
3
11

You're right, that's all listed in the doc (that's why I gave the link) – Jeremy Thille Jun 08 '17 at 08:46

score 0 · Answer 3 · answered Jun 08 '17 at 07:16

You can use sockets for this type of communication. socket.io is a node package for web sockets. In the server you have

socket.emit('done')

whereas in the client side you can attach to the emit to receive new data

socket.on('done', function (data) {
    // Do something with data
});

How to notify front-end from backend?

3 Answers3