Ajax reverse (Comet) con ASP.NET MVC - JUTI 2011

AjaxReverse (Comet)

Ing. Jose A. Fernandezjfernandez{arroba}desarrollosnea{punto}com

JUTI – UTN FRReAgosto.2011

blog: http://team.desarrollosnea.com.ar/blogs/jfernandezblog personal: http://geeks.ms/blogs/fernandezja

@fernandezja

Aplicaciones en tiempo real… un paso mas allá de Ajax

(ejemplos con ASP.NET MVC)

Comet… WebSockets

Hasta el infinito y mas allá… un paso mas allá de Ajax

Ajax

• XMLHttpRequest

– http://www.w3.org/TR/XMLHttpRequest/

• API implementada en los motores de script

• “Es el Mago en Ajax”, …

– ya que establece un canal de comunicación browser-server en background

Tiempo real (en web)

• Tener información “fresca”. Lo mas pronto posible• HTTP basado en peticiones

– Request-Response– No es suficiente para el requerimiento– Debemos solicitar información “constantemente”

Ejemplos:– Aplicaciones de colaboracion– Dashboards/Cuadros de mandos– Chat/Juegos– Algun progreso de una tarea…– etc.

Obtener datos en tiempo real

• Polling/Sondeo

– Solicitar información “constantemente”

• Push/”Colocar”

– Recibir información (alguien lo tiene y lo puedo recibir)

• Pulling/Extraer

– Solicitar información. Cuando sea necesaria

Como lo hacemos?

• Flash (sockets – XMLSocket/Socket – AS3)

• Silverlight (con servicios duplex)

• Comet…

• WebSockets (HTML5)

Comet?

• “MKT”

• Otros nombres

– Reverse Ajax,

– Ajax Push,

– HTTP Push,

– HTTP Server Push

– HTTP Streaming

– two-way-web,

• Demo cajeros

Prevenir

Intervalo

Polling vs Pulling

AsyncController(nuevo en ASP.NET MVC)

• Sin– Controlador sincrónico. “Espere por favor…” – Thread debe esperar a que termine

• No puede responder otras peticiones• Limite de hilos

• Con

Enlaces– MSDN: AsyncController– Code Samples: ASP.NET MVC Asynchronous and Areas

Streaming & Long-Polling.

• Dos opciones

multipart/x-mixed-replace

• comet = cometobj();

• comet.multipart = true;

Dojo.js

• http://dojofoundation.org/projects/cometd

… un poco de magia“elegante”

• http://code.google.com/p/jquery-websocket/

• The Graceful WebSocket

• http://code.google.com/p/jquery-graceful-websocket/

• http://kaazing.com/ lo hace funcionar al IE6 ;)• Emular con flash https://github.com/gimite/web-

socket-js

WebSocket (HTML)

• Protocolo de comunicación full-duplex

• Para ser utilizado en los navegadores (y servidores)– Que sea fácil de utilizar

• Estandarización – W3C Web Applications Working Group

– IETF Hypertext Bidirectional (HyBi) Working Group.

• Fuentehttp://en.wikipedia.org/wiki/Comparison_of_layout_engines_(HTML5)

• Pokerin: Comet Ajax Library for ASP.NET & Mono

http://pokein.com/http://pokein.codeplex.com/

• Enlaces– Prototipo de WebSocket para IIS 7 (WCF)

– SuperWebSocket: http://superwebsocket.codeplex.com/

– pywebsocket: Componente para Apache

ClienteHTTP

ServidorHTTP

HTTP Upgrade Request

ClienteHTTP

ServidorHTTPHTTP Switching Protocols Response

1

2

WebSocket

WebSocket3

Intercambio de mensajes

TCP

TCP

TCP

GET /ejemplo HTTP/1.1

Host: juti-frre.com.ar

Upgrade: websocket

Connection: Upgrade

Sec-WebSocket-Key: {clave/encriptada/base64}

Sec-WebSocket-Origin: http://juti-frre.com.ar

Sec-WebSocket-Version: 6

HTTP/1.1 101 Switching Protocols

Upgrade: websocket

Connection: Upgrade

Sec-WebSocket-Accept: {respuesta en base a clave/encriptada/base64}

ClienteHTTP

1

ClienteHTTP

1

Conclusiones…

• “No es para cualquier requerimiento y ámbito”.

• Entornos de LAN (Intranet)

• Polling- Alto trafico en la red

- Mensajes “innecesarios” (sin cambios)

+/ - Intervalo de sondeo• Dependiendo del “%-intervalo” de actualización

• Puede ser bajo y quedarnos sin recibir actualización

+ Se puede modificar el intervalo desde el servidor en alguna actualización (IA/Estadisticas)

Ing. Jose A. Fernandezjfernandez{arroba}desarrollosnea{punto}com

JUTI – UTN FRReAgosto.2011

blog: http://team.desarrollosnea.com.ar/blogs/jfernandezblog personal: http://geeks.ms/blogs/fernandezja

@fernandezja

Preguntas??