Socket.io

by Severin Ibarluzea and Joey Lee

Socket.io

• Node.js
• Real-time web communication
• Faster than polling
• Simple API

Polling?

Long Polling

The Problem

Installation

Getting Connected

The Server

The Basics

<script src="/socket.io/socket.io.js"></script>
<script>
  var socket = io.connect('http://localhost');
  socket.on('news', function (data) {
    // Do stuff with data
  });
</script>

Client

Server

var io = require('socket.io')();

io.on('connection', function (socket) {
  socket.emit('news', "Hello World!");
});

io.listen(3000);

Chatroom

Client

Server

var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);

io.on('connection', function(socket){
  console.log("User Connected!");
  socket.on('chat message', function(msg){
    io.emit('chat message', msg);
  });
  socket.on('disconnect', function(){
    console.log('user disconnected');
  });
});

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

// (serve page to client)

var socket = io();
$('form').submit(function(){
    socket.emit('chat message', $('#m').val());
    $('#m').val('');
    return false;
});
socket.on('chat message', function(msg){
    $('#messages').append($('<li>').text(msg));
});

Chatrooms are boring

Client Networking Code

var network = (function(){

    var socket = io();

    socket.on("color", function(nameColor){
        console.log("Name: " + nameColor[0] + " Color: " + nameColor[1]);
        network.onColorChange(nameColor[0], nameColor[1]);
    });

    socket.on("position", function(d){
        network.onPositionChange(d[0], d[1], d[2], d[3]);
    });

    socket.on("exit", function(name){
        console.log("Player: " +name + " has exited");
        network.onPlayerExit(name);
    });

    function hostSendColor(name, color){
        var nameColor = [ name, color];
        socket.emit("color", nameColor);
    }
    function updatePosition(name, xpos, ypos, color){
        var namePosition = [name, xpos, ypos, color];
        socket.emit("position", namePosition);
    }
})();

Server Code

var express = require('express');
var app = express();
var http = require('http').Server(app);
var io = require('socket.io')(http);

app.use('/', express.static(__dirname + '/../client/'));

io.on('connection', function(socket){
    console.log("New Player Connected");

    var clientName = "";

    socket.on('position', function(position){
        io.emit('position', position);
        clientName = position[0];
    });
    socket.on('color', function(color){
        io.emit('color', color);
    });
    socket.on('disconnect', function(){
        io.emit('exit', clientName);
    });

});

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

Wait but I use PHP

Learn More

Thank You

RCOS

Professor Goldshmidt

Professor Moorthy

Sean O'Sullivan