Eventos de conexión en SignalR

Avanzando con la serie asociada a SignalR hay un punto que nos puede ser muy útil a la hora de diseñar la interacción de nuestra aplicación: los eventos de conexión.

Explicándolo de forma muy simplificada, hay tres cosas que pueden suceder en el ciclo de vida de la conexión entre el servidor y cliente:

  • Inicio de la conexión
  • Finalización de la conexión
  • Reconexión

Los dos primeros sucederán en todos los casos, ya que siempre se creará y finalizará una conexión. En cambio la reconexión solamente se dará en aquellos casos donde haya una interrupción momentánea en la conexión entre las partes.

Lo que nos ofrece SignalR es el poder agregar lógica ante el suceso de estos eventos, pudiendo personalizar alguna situación o agregar comportamiento adicional, tanto del lado del servidor como del cliente.

Comenzando por el lado del servidor, la clase Hub – de la cual heredan nuestras propias implementaciones – tiene los métodos necesarios para la gestión de la conexión y desconexión de cada uno de los clientes del mismo. Esto lo hace a través de métodos virtuales, lo que hace que en nuestra implementación podamos realizar un override de los mismos, agregando la lógica de negocio propia además de invocar a la implementación base.

La siguiente porción de código es la definición de la clase Hub provista en las librerías de SignalR, donde podemos observar los tres métodos virtuales que nos servirán para este propósito:

Desde el lado del cliente los métodos estarán disponibles en el código JavaScript generado por SignalR. Veremos dichos métodos en detalle en cada evento en cuestión, junto con la explicación de cada uno:

Inicio de la conexión

Cuando desde el cliente invocamos el método start() sobre la conexión del Hub, es donde se produce el comienzo de toda la interacción entre el cliente y el servidor. Uno de los puntos que se decide en este momento es el tipo de conexión que se utilizará en la interacción con ambos, teniendo en cuenta lo que ya vimos en el post “Introducción: SignalR en ASP.NET MVC“.

Lo primero que sucederá es la invocación del método $.connection.hub.starting en el lado del cliente. Para suscribirnos al mismo y agregar lógica propia lo podremos realizar de la siguiente forma:

Cuando esto sucede de forma exitosa es invocado el método OnConnected del Hub sobre el cual se inicializa la conexión. Por defecto si no hacemos nada adicional se ejecutará dicho método de la clase Hub, pero también podemos sobreescribir dicho método para agregar lógica personalizada. Aquí es el primer punto donde tenemos disponible el ConnectionId de un determinado cliente, por lo cual podríamos utilizarlo para realizar alguna operación particular. Un buen ejemplo de lógica en este punto (que lo veremos de forma detallada en un próximo post) es integrar nuestra aplicación SignalR con el almacenamiento de los usuarios y sus grupos. De esta forma, al iniciarse la conexión de un usuario particular podríamos ya agregarlo a todos los grupos a los que pertenece. Otro ejemplo algo más simple podría ser avisarles a todos los demás clientes que un determinado usuario se ha conectado a la aplicación.

 

Reconexión

Este evento es invocado cuando se da una situación de reconexión entre el cliente y el servidor, por lo cual su ejecución será condicional a un determinado suceso opcional, no como en los otros dos casos. Esto puede deberse tanto por cortes o problemas en la conexión del lado del cliente o del servidor.

Desde el cliente tendremos dos métodos disponibles:

  • $.connection.hub.reconnecting: El mismo se invocará cuando se detecte que hay un problema en la conectividad con el servidor, por el cual se inicia el proceso de re-establecimiento de dicha conexión. Es decir que es lo primero que sucederá dentro del contexto de este proceso.
  • $.connection.hub.reconnected: Se invocará cuando se haya re-establecido la conexión con el servidor.

En el servidor el Hub nos provee del método OnReconnected, el cual se invocará de la misma forma que $.connection.hub.reconnected, solo que del lado del cliente.

La suscripción a los mismos se realizará de la misma forma que lo visto para el caso de inicialización de la conexión.

 

Finalización de la conexión

Este es el último evento que se disparará en la interacción entre el cliente y servidor, dándose el mismo por la finalización definitiva en la comunicación. Tenemos distintas alternativas por las cuales se invoque:

  • Cuando desde el cliente ejecutamos el método stop() sobre la conexión del Hub. Esto hará que ambos cierren la conexión, ejecutándose en el servidor el método del Hub asociado a dicho evento de forma inmediata.
  • En casos de pérdida de conexión como vimos en el evento anterior, se ejecutará el evento OnReconnected en caso de que la conexión pueda restaurarse. De no ser así tanto cliente como servidor esperarán intentando re-establecer la comunicación, hasta que se llegue al límite del timeout configurado.

Desde el lado del cliente contamos con el método $.connection.hub.disconnected, el cual se invocará al momento de que se haya cerrado la conexión, tanto por un suceso esperado como por algún problema de conectividad entre las partes.

Desde el lado del servidor el método equivalente es OnDisconnected(bool stopCalled). La diferencia es que recibirá como parámetro un valor booleano, el cual si tiene como valor true indicará que la conexión se ha cerrado de forma normal bajo una forma normal bajo la ejecución del método stop() del lado del cliente. Caso contrario, el mismo tendrá como valor false.

Algo a destacar es que en caso de cerrar la ventana del navegador donde se está ejecutando nuestra aplicación con SignalR, antes de que se produzca eso se invocará de forma automática el método $.connection.hub.stop(), haciendo de esta forma que la conexión se finalice de forma normal y controlada, como se puede ver en la siguiente secuencia:

EventosSignalR - CerrarConexion.gif

 

Conclusión:

Este conjunto de eventos nos provee una herramienta muy útil a la hora de diagramar la interacción de la aplicación. Es fundamental el poder comprender el suceso de los eventos y cómo poder usarlos en nuestra aplicación para brindar una experiencia de usuario óptima, a la vez que nos aprovechemos de estos eventos para agregar nuestra lógica de aplicación en el lugar y momento apropiado.

A continuación les dejo una demostración de la secuencia de ejecución de los eventos vistos, incluida la simulación de una pérdida de conexión:

 

Anuncios

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s