SignalR was originally released way back the year 2013 and since then, this library helps a lot of ASP.NET developers to add 'real-time' functionality or feautue in their app whether a chat feature, uploading/downloading progress tracker, ticketing and much more. In a nutshell, it uses WebSockets whenever is possible. For most applications, Microsoft recommends SignalR over raw WebSockets. You can find more detailed explanations here: "WebSockets support in ASP.NET Core"

Okay, enough with the intro, let's get started on how we can setup this in our ASP.NET Core application.

I'm using ASP.NET Core 5 template here. But in case the 'Microsoft.AspNetCore.SignalR' isn't installed yet in your project, just manuall install it via Nuget Package Manager or console.

SignalR Hubs acts like a communication bridge between clients and servers. In the server code, you define methods that are called by the client which is the 'consumer' and in the client code, you define methods that are called from the server.

In this example, I created MainHub that handles all of the hubs. But I'd prefer you creating a custom hub name depending on it's functionalities and if you'll end up having multiple hubs.

        using System.Threading.Tasks;
using Microsoft.AspNetCore.SignalR;
  
namespace MyApp.Hubs
{
  public class MainHub : Hub
  {
    private readonly IHubContext<MainHub> hubContext;
  
    public MainHub(IHubContext<MainHub> hubContext)
    {
      this.hubContext = hubContext;
    }
  
    public async Task SendNotification(string message)
    {
      await hubContext.Clients.All.SendAsync("receivesNotification", message);
    }
  }
}

      

In the code above, SendNotification has a parameter which is the message where we can pass a data from server to the client consumer.

Go to ConfigureServices method and add this code: services.AddSignalR(); just like the code below.

        public void ConfigureServices(IServiceCollection services)
{

  services.AddControllers();
  services.AddSwaggerGen(c =>
  {
    c.SwaggerDoc("v1", new OpenApiInfo { Title = "MyApp", Version = "v1" });
  });
  
  // SIGNALR
  services.AddSignalR(); 
}
      

This will serve as the webapi endpoint where the client can connect with.

        app.UseEndpoints(endpoints =>
{
  endpoints.MapControllers();
  endpoints.MapHub<MainHub>("/hubs/main");
});
      

If you access the url, you can expect the result like the photo shown below.

This means that you're endpoint is up and running and waiting for the client-side to access the hub.

And that’s it. It’s very simple to set it up!