Tuesday, 20 June 2017

Socket.IO module with nodeJs tutorial

How to send message from Node(server) to browser(client) and vice versa? How to connect/disconnect to  the room.

Question: What is socket.io module?
Socket.IO is a JavaScript library for realtime web applications.
It enables realtime, bi-directional communication between web clients and servers.
It has two parts
a) client-side library that runs in the browser.
b) server side that run in browser.



Question: Give example of real time application?
  1. Instant messengers like facebook notification/message.
  2. Push Notifications like when someone tags you in a picture on facebook, you receive an instant notification.
  3. Collaboration applications like multiple user editing same file.
  4. Online gaming




Question: Why we use socket.io?
  1. bi-directional communication channel between a client and a server.
  2. When an event occur, socket get notify and let to know the single client OR all clients.
  3. It is trust application and used by Microsoft Office, Yammer, Zendesk, Trello, and numerous other organizations.



Question: How to install socket.io in Web and Server?
In Browser (client)
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.3/socket.io.js"></script>

In NodeJS
npm install socket.io

var io = require('socket.io')




Question: How get to know, if user is connect/disconnect?
In Server(Node)
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);

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

//Whenever someone connects (execute when come in Web page)
io.on('connection', function(socket){
  console.log('A user connected');

  //Whenever someone disconnects (execute when Leave the web page)
  socket.on('disconnect', function () {
    console.log('A user disconnected');
  });

});

http.listen(3000, function(){
  console.log('listening on *:3000');
});

In Browser
 var socket = io.connect('http://127.0.0.1:3000'); 



Question: How to get to know, when new user comes in browse?

OR
Question: How to send message from Client(Browser) to Server(Node)?
In Server
 
socket.on('adduser', function(name, email, uid) {
    //name, email, and uid of user
    console.log('New user comes in web page');
});

In Browser>
 
socket.emit('adduser', 'Robin Sharma','robinsharma@no-spam.ws',2555);      




Question: How to send message from Server(Node) to Client(Browser)?
In Server
socket.emit('newRequestCome', 'name','myself send request'); //Send message to socket (Same window)
socket.broadcast.to(roomName).emit( 'newRequestCome','name','message'); //Send message to all socket (Other windows in same Room)

In Browser
 
socket.on('newRequestCome', function(name, message) {                        

});


Question: How to join the room and send message?
Join the room
io.on('connection', function(socket){
  socket.join('someNo12');
});



Question: How to send message the room?
Send message to the room
io.in('someNo12').emit('some event');
//io.to('someNo12').emit('some event');