Tuesday, 17 April 2018

How to implement Real time notification in NodeJs

Here are simple steps to create real time notification using NodeJs, Socket.io and Mysql

Socket.IO enables real-time bidirectional event-based communication.It has two parts: a client-side library that runs in the browser, and a server-side library for node.js. Install Socket.IO


npm install --save socket.io

I hope you have install express and mysql. This are basic few code inside server file.

var express = require( 'express' );
var app = express();
app.use( express.static( __dirname + '/public') );

var mysql = require('mysql');
var server = require( 'http' ).Server( app );
var io = require( 'socket.io' )( server );
server.listen( 3000, function(){
  console.log( 'listening on *:3000' );

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

});

The require('socket.io')(http) creates a new socket.io instance attached to the http server.

Now make mysql connection

var con = mysql.createConnection({
  host: "localhost",
  user: "root",
  password: "",
  database: "nodejs"
});

con.connect(function(err) {
  if (err) throw err;
  console.log("Connected!");

});

Now in index.html I add the following snippet before the </body>:
It load the socket.io-client, and then connect with server.
<script src="/socket.io/socket.io.js"></script>
<script>
  var socket = io();

</script>

Now in server file I add the following snippet. It will check connection event for incoming sockets,

io.on('connection', function(socket){
  console.log('a user connected');
});

Now add event on client side
socket.on('user list', function(list){
$('.blink_me').text(list[0].totalUsers);

});

Handle event in server side.

io.on('connection', function(socket){
  setInterval(function() { // send total users after 4 second
      con.query("SELECT count(*) as totalUsers FROM customer", function(err, result) {
if(err){
throw err;
}
io.emit('user list', result);
  });
   }, 4000);

});

Some Important points

Socket Event Handling

In order to send an event to everyone, Socket.IO gives us the io.emit:

io.emit('some event', { for: 'everyone' });

You can create and execute custom events using the socket.emit function.

eg: socket.emit('customEvent', { content: 'A custom event created !'});

in view file use it
var socket = io();
socket.on('customEvent', function(data){document.write(data.content)});

You can also emit events from the client side. To emit an event from your client, use the emit function on the socket object.
var socket = io();
socket.emit('clientEvent', 'Sent an event from the client!');

inside server file
socket.on('clientEvent', function(data) {
  console.log(data);

});

Socket Broadcasting
Broadcasting means sending a message to all connected clients.To broadcast an event to all the clients, we can use the io.sockets.emit method.

inside server file:
var clients = 0;
io.on('connection', function(socket) {
   clients++;
   io.sockets.emit('broadcast',{ description: clients + ' clients connected!'});
   socket.on('disconnect', function () {
      clients--;
      io.sockets.emit('broadcast',{ description: clients + ' clients connected!'});
   });
});

On the client side
socket.on('broadcast',function(data) {
document.write(data.description);

});

0 comments:

Post a Comment