Real Time con SignalR y .Net

Desde hace un tiempo, las aplicaciones han incorporado la funcionalidad de recibir notificaciones directamente desde el servidor. En la actualidad, ya no es necesario refrescar la pantalla de forma constante para verificar si hay algún cambio disponible; el servidor puede notificarnos de manera automática.

En la familia de componentes de .Net tenemos SignalR. Vamos a ver una pequeña introducción a este componente mediante un ejemplo simple de las manos de .Net 6+ y Minimal API.

SignalR ¿Que es esta cosa?

SignalR, una biblioteca avanzada, simplifica la incorporación de funcionalidades en tiempo real en aplicaciones ASP.NET de manera ágil y efectiva. En esencia, posibilita la notificación inmediata a los clientes conectados en cuanto la información esté disponible en el servidor.

Algunos escenarios para usar esta tecnología son:

• Aplicaciones que necesitan actualizaciones periódicas desde el servidor. Ejemplos: juegos, plataformas de redes sociales, sistemas de votación, subastas, mapas y herramientas de navegación.‎
• ‎Paneles y aplicaciones de vigilancia. Ejemplos: paneles de control empresarial, actualizaciones instantáneas de ventas o alertas de viaje.‎
• ‎Herramientas colaborativas. Ejemplo: Herramientas de pizarra y software para encuentros de equipo.
• ‎Aplicaciones que buscan notificaciones. Redes sociales, correo electrónico, chat, juegos, alertas de viaje y diversas aplicaciones incorporan funcionalidades de notificación.‎

Es fundamental tener presente que la tecnología implementada es WebSocket. Esto le da la capacidad a los navegadores para establecer esta conexión bidireccional.

Pre-requisitos

• Visual Studio 2022
• .Net 6+.

Creando el Servidor

Inicialmente, debemos establecer un servidor. Para ello, abrimos una consola y ejecutamos los comandos que se detallan a continuación:

dotnet new web -o MySignalRServer
cd MySignalRServer
dotnet add package Microsoft.AspNetCore.SignalR

Al ejecutar estas instrucciones, generamos el servidor y añadimos la referencia al paquete Microsoft.AspNetCore.SignalR, que será empleado en nuestra aplicación MySignalRServer.

Creando el HUB de conexión

¿Qué representa un HUB? Un HUB es el punto de reunión al que se conectarán todos los clientes, junto con el servidor, para intercambiar información entre ellos. Pensemos en ello de esta manera: en lugar de tener un controlador de ASP.NET, optamos por un HUB que SignalR empleará. En nuestra implementación, creamos una clase llamada PrincipalHub. Ahora, revisemos el código:

using Microsoft.AspNetCore.SignalR;

public class PrincipalHub: Hub
{
    public async IAsyncEnumerable<DateTime> Streaming(CancellationToken cancellationToken)
    {
        while (true)
        {
            return DateTime.UtcNow;
            await Task.Delay(3000, cancellationToken);
        }
    }
}

Es evidente que la función devuelve un IAsyncEnumerable. Además, estamos suministrando un parámetro CancelationToken que nos concede la facultad de cancelar la llamada por alguna razón pertinente. Posteriormente, procedemos a añadir la configuración de SignalR y a establecer la ruta del servidor. Dirijamonos a nuestro proyecto y abramos el archivo program.cs, donde completamos con el siguiente código:

var builder = WebApplication.CreateBuilder(args);
builder.Services.AddSignalR();

var app = builder.Build();
app.MapHub<MainHub>("/current-time");

app.Run();

Para lanzar nuestra aplicación, ahora podemos presionar F5 en Visual Studio o, en su lugar, ejecutarla desde la consola mediante el siguiente comando:

dotnet watch run

Creando el Cliente

A continuación, crearemos un cliente que establecerá conexión y se encargará de consumir los eventos comunicados por el servidor. Generaremos un proyecto de consola utilizando la consola:

dotnet new console -o SignalRClient
cd SignalRClient
dotnet add package Microsoft.AspNetCore.SignalR.Client

Tenemos a nuestra disposición los paquetes necesarios para nuestro cliente. Seguidamente, crearemos una clase llamada PrincipalClient y la completamos con el siguiente código:

using Microsoft.AspNetCore.SignalR.Client;

public class PrincipalClient 
{
    public static async Task ExecuteAsync()
    {
        var uri = "https://localhost:7054/current-time";

        await using var connection = new HubConnectionBuilder().WithUrl(uri).Build();

        await connection.StartAsync();

        await foreach (var date in connection.StreamAsync<DateTime>("Streaming"))
        {
            Console.WriteLine(date);
        }
    }
}

Observamos que en la clase se ha definido un método que consumirá los datos enviados por el servidor. Se destaca la creación de un objeto conexión para llevar a cabo la comunicación con el servidor. Por último, nos dirigimos al program.cs y completamos con la siguiente línea de código.

await PrincipalClient.ExecuteAsync();

Solo debemos ejecutar:

dotnet watch run

La salida se refleja en la consola, según se ilustra en la imagen:

Conclusión

Experimentamos la creación ágil de un ejemplo con SignalR y .Net 6+. Configuramos un servidor para transmitir información y un cliente para consumirla. Este es apenas el inicio de esta excepcional librería. En futuras publicaciones explicaremos detenidamente SignalR y sus virtudes.