What is Signal-R in c#

on

Introduction:

In today's world, modern applications must keep users updated in real-time. This means providing timely information as events happen. Historically, enabling real-time communication in applications was a complex task, but thanks to SignalR, it has become much simpler. SignalR is a library specifically designed for .NET applications, offering powerful real-time communication capabilities. In this article, we will explore SignalR, its key features, and how to seamlessly integrate it into your C# applications to achieve real-time communication.


What is SignalR?

The SignalR library is a valuable tool for .NET applications, providing the capability for real-time communication. What this means is that you can enhance your applications so that users receive updates instantly as they occur, without the need for them to manually refresh the page. This feature significantly improves the user experience by keeping them informed in real-time.

SignalR, built upon the WebSocket protocol, makes it possible for the server and the client to have instant, real-time communication. However, SignalR goes the extra mile by supporting alternative methods like Server-Sent Events (SSE) and long polling. What's great about this is that if WebSocket isn't an option, SignalR will smartly switch to one of these other methods to ensure that the real-time communication still happens smoothly. It's like SignalR's way of making sure the conversation never lags, even if it needs to take a different route.


How does SignalR Work?

SignalR operates by establishing a persistent connection between the client and the server. This connection acts as a conduit for exchanging data between them. When a client wants to connect to the server, it sends a request to establish this connection. In return, the server provides a unique connection ID, which serves as a way to recognize and distinguish that particular connection.


After the connection is set up successfully, both the client and the server can exchange messages in real-time. This means they can have instant back-and-forth communication. If, for some reason, the connection is lost, SignalR will make automatic efforts to reconnect. This clever feature guarantees that the connection remains active, even if the client or server briefly goes offline.


SignalR offers a convenient hub-based API that simplifies your work. Think of a hub as a user-friendly tool that helps you send messages between the server and clients effortlessly. It does this by handling all the complicated technical details of the connection behind the scenes. So, you can focus on your application's logic and not get bogged down in the nitty-gritty of connection management.



Using SignalR in C#:
Now that we grasp the concept of SignalR and its functionality, let's explore how we can apply it in our C# applications.

Firstly, you have install the SignalR Package through the NuGet Package. Type below command in NuGet Package Manager Console. 

Install-Package Microsoft.AspNet.SignalR

After installing the package, we can begin using SignalR in our application. The initial step involves creating a hub, which is essentially a special class inheriting properties from the Hub class. This hub acts as a manager, dealing with messages coming in from clients and ensuring messages are sent back to the clients.

The below example is Simple Hub. 

  using Microsoft.AspNet.SignalR;  
  
public class MyHubs : Hub  
{  
    public void Send(string messages)  
    {  
        Clients.All.broadcastMessage(messages);  
    }  
}

In this instance, we've made a hub called MyHub. Inside it, there's a method named Send, which takes a string message as a parameter. By using the broadcastMessage method through the Clients object, the Send method can send this message to all clients connected to it.

The following step involves configuring SignalR within our application, which happens in the Startup class. 

  using Microsoft.AspNet.SignalR;  
using Owin;  
  
public class Startup  
{  
    public void Configuration(IAppBuilder app)  
    {  
        app.MapSignalR();  
    }  
}
In this example, we've crafted a method called Configuration that accepts an IAppBuilder parameter. Inside this method, we've utilized the MapSignalR method on the app object. This action configures SignalR within our application, ensuring it's ready to be used.

Now that we've set up a hub and configured SignalR, it's time to apply it in our application. Let's create a straightforward example to demonstrate how SignalR can be used to exchange information between the client and the server.

To start, we'll design a basic HTML page featuring a text box and a button in the user interface. When the user enters a message in the text box and clicks the button, this message will be sent to the server. 
 
  
<html>  
<head>  
    <meta charset="utf-8" />  
    <title>SignalR Example</title>  
    <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>  
    <script src="/signalr/hubs"></script>  
    <script>  
        $(function () {  
            var chat = $.connection.myHub;  
  
            chat.client.broadcastMessage = function (message) {  
                $('#signalMessage').append('<li>' + message + '</li>');  
            };  
  
            $.connection.hub.start().done(function () {  
                $('#sendButtons').click(function () {  
                    chat.server.send($('#inputMessage').val());  
                    $('#inputMessage').val('').focus();  
                });  
            });  
        });  
    &lt;/script&gt;  
&lt;/head&gt;  
&lt;body&gt;  
    &lt;ul id="signalMessage"&gt;&lt;/ul&gt;  
    &lt;input type="text" id="inputMessage" /&gt;  
    &lt;button id="sendButtons"&gt;Send&lt;/button&gt;  
&lt;/body&gt;
&lt;/html&gt;
In this example, we've added the SignalR JavaScript library and created a hub named myHub on the client-side. Additionally, we've established a function called broadcastMessage, which gets triggered when a message arrives from the server. This function straightforwardly adds the received message to an unordered list element.

We've also created an event handler for the button click. When the button is clicked, it triggers the send method within our hub, sending the message to the server.

Now, let's modify our hub to manage messages sent by the client: 

  using Microsoft.AspNet.SignalR;  
  
public class MyHubs : Hub  
{  
    public void Send(string messages)  
    {  
        Clients.All.broadcastMessage(messages);  
    }  
}

In this instance, we've refined the Send method. Now, it calls the broadcastMessage method through the Clients object, including the message as a parameter. By doing this, every connected client receives the sent message.

Lastly, we'll modify our Startup class to connect our hub: 
  using Microsoft.AspNet.SignalR;  
using Owin;  
  
public class Startup  
{  
    public void Configuration(IAppBuilder app)  
    {  
        app.MapSignalR();  
    }  
}

That's all there is to it! When we run our application, input a message into the text box, and click the 'Send' button, that information will be sent to the server. The server will then share this message with all the connected clients.

Comments

Post a Comment