Real Time
Node JS + Socket.IO
JOSE GRATEREAUX
@JGRATEREAUX
https://github.com/gratereaux
http://www.slideshare.net/jgratereaux
Web Apps con real time
Flight Radas: localizador de vuelos en tiempo real donde
muestra informacion actual del avion.
Murally is an app targeting creative teams who want to
collaborate in a visual way using large murals.
Real-time in Google Analytics
Game-Cast de ESPN
Node.js
Node.js es un entorno de programación en la capa del
servidor basado en el lenguaje de programación
Javascript, con I/O de datos en una arquitectura
orientada a eventos y basado en el motor Javascript V8.
Fue creado con el enfoque de ser útil en la creación de
programas de red altamente escalables
nodejs.org
¿Websocket?
• Es una tecnología que proporciona un canal de
comunicación bidireccional y full-duplex sobre una
única conexión TCP
• Conexión persistente entre el servidor y el cliente.
Socket.IO
• Tiene como objetivo hacer posible las aplicaciones en
tiempo real en cualquier browser.
• Socket entre Servidor & Cliente.
• Enviar data de uno a otro.
• Recibe data vía eventos.
• Soporte de todos los browsers.
• Múltiples sockets bajo la misma conexión.
• Detección de desconexiones vía heartbeats.
• 100% javascript
• Lo podemos descargar vía NPM
Que pasa cuando te conectas?
Cliente socket.io Servidor Node +
Socket.io
Que pasa cuando te conectas?
Cliente socket.io Servidor Node +
Socket.io
Handshake request
Que pasa cuando te conectas?
Cliente socket.io Servidor Node +
Socket.ioHandshake acepted
La vía de transporte, id y config son retornados
Que pasa cuando te conectas?
Cliente socket.io Servidor Node +
Socket.io
Una función de detección es
usada para encontrar un layer
de transporte que funcione.
Que pasa cuando te conectas?
• Métodos de transporte
disponibles:
• Web Socket
• Flash Socket
• HTML File
• XHR Polling
• XHR Multipart
• JSONP Polling
Que pasa cuando te conectas?
Cliente socket.io Servidor Node +
Socket.io
Heartbeats son enviados para
asegurar una buena conexión
El cliente establece la conexión en tiempo real
con el servidor
Socket.IO
• Descargar e Instalar Node.js
• http://nodejs.org/#download
• Instalar Socket.IO
• Npm install socket.io
• Escribir el server y el cliente
• Ejecutar o correr el servidor
• Node server.js
How to setup
Socket.IO
• emit(event, data)
• on(event, handler)
Socket.IO
Basic Server setup
Socket.IO
Basic Client setup
Socket.IO
Vamonos pa`los codigos!
Gracias
Tiempo de responder preguntas!
JOSE GRATEREAUX
@JGRATEREAUX
https://github.com/gratereaux

Realtime nodejs socket io

  • 1.
    Real Time Node JS+ Socket.IO JOSE GRATEREAUX @JGRATEREAUX https://github.com/gratereaux http://www.slideshare.net/jgratereaux
  • 2.
    Web Apps conreal time Flight Radas: localizador de vuelos en tiempo real donde muestra informacion actual del avion. Murally is an app targeting creative teams who want to collaborate in a visual way using large murals. Real-time in Google Analytics Game-Cast de ESPN
  • 3.
    Node.js Node.js es unentorno de programación en la capa del servidor basado en el lenguaje de programación Javascript, con I/O de datos en una arquitectura orientada a eventos y basado en el motor Javascript V8. Fue creado con el enfoque de ser útil en la creación de programas de red altamente escalables nodejs.org
  • 4.
    ¿Websocket? • Es unatecnología que proporciona un canal de comunicación bidireccional y full-duplex sobre una única conexión TCP • Conexión persistente entre el servidor y el cliente.
  • 5.
    Socket.IO • Tiene comoobjetivo hacer posible las aplicaciones en tiempo real en cualquier browser. • Socket entre Servidor & Cliente. • Enviar data de uno a otro. • Recibe data vía eventos. • Soporte de todos los browsers. • Múltiples sockets bajo la misma conexión. • Detección de desconexiones vía heartbeats. • 100% javascript • Lo podemos descargar vía NPM
  • 6.
    Que pasa cuandote conectas? Cliente socket.io Servidor Node + Socket.io
  • 7.
    Que pasa cuandote conectas? Cliente socket.io Servidor Node + Socket.io Handshake request
  • 8.
    Que pasa cuandote conectas? Cliente socket.io Servidor Node + Socket.ioHandshake acepted La vía de transporte, id y config son retornados
  • 9.
    Que pasa cuandote conectas? Cliente socket.io Servidor Node + Socket.io Una función de detección es usada para encontrar un layer de transporte que funcione.
  • 10.
    Que pasa cuandote conectas? • Métodos de transporte disponibles: • Web Socket • Flash Socket • HTML File • XHR Polling • XHR Multipart • JSONP Polling
  • 11.
    Que pasa cuandote conectas? Cliente socket.io Servidor Node + Socket.io Heartbeats son enviados para asegurar una buena conexión El cliente establece la conexión en tiempo real con el servidor
  • 12.
    Socket.IO • Descargar eInstalar Node.js • http://nodejs.org/#download • Instalar Socket.IO • Npm install socket.io • Escribir el server y el cliente • Ejecutar o correr el servidor • Node server.js How to setup
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
    Gracias Tiempo de responderpreguntas! JOSE GRATEREAUX @JGRATEREAUX https://github.com/gratereaux

Notas del editor

  • #6 You can use the HTML5 web socket in node-webkit: http://html5demos.com/web-socket And you can use node.js's net module if you want a better one: http://nodejs.org/api/net.html WebRTC also works, for the media part, you can read our Wiki: https://github.com/rogerwang/node-webkit/wiki/Control-camera-and-microphone-with-getusermedia-api