Skip to main content

Simplified signaling with SignalR


Introduction

Users are always interested in a rich experience, or a well UI Experience. They expect real-time action between both client and server, no matter if the technology used is HTML5 web sockets or something else. There comes the SignalR. It is framework built on top of ASP.NET and JavaScript library that helps to build rich interactive web applications.

We can use signalR in the scenarios where require polling server after fix interval to check if server has something which client needs to update. Well, In Definition SignalR is an asynchronous signaling framework that helps maintain persistent connections between client and server”. It uses the raw technique of keeping connections open between a web client and a web server. Actually it uses an existing technique called long polling. Behind the scenes, it could very well use Web Sockets transparently.

How it works

Long Polling: With long-polling, the browser sends a request to the server and the server keeps the request open for a set period.  If a notification is received within that period, a response containing the message is sent to the client. If a notification is not received within the set time period, the server sends a response to terminate the open request

SignalR: SignalR registers some code to run at application start time that finds all hubs in your application which is done by jquery.signalR.min.js and SignalR.dll. On the first request to signalr/hubs, the proxy is generated and cached for the lifetime of the application.



Server Hub:
[HubName("testHub")]
public class TestingHub :Hub
{
 /// <summary>
        /// This method is called from signalR client
        /// Clients is dynamic property.
        /// </summary>
        /// <param name="message"></param>
        public void Send(string message)
        {
            Clients.broadcastMessage(message);
        }

}

Client Side Scripting:
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="Scripts/jquery.signalR.min.js" type="text/javascript"></script>
<script src="/signalr/hubs" type="text/javascript"></script>
   
    <script type="text/javascript">
        $(function () {

            var broadCaster = $.connection.testHub;
            broadCaster.broadcastMessage = function (message) {
                $('#brodcastArea').html(message);
            };


            $.connection.hub.start();
            $('#btnBroadCast').click(function () {
                broadCaster.send($('#txtMessage').val());
            });


        });


    </script>

Business problem with SignalR

Real time stock update system, we can create a very interactive stock updating tool, which reflects the live stock market change to the clients.  Our server will communicate to Stock API’s and updates all the open clients with the real time market data. 

History

The concept of SignalR that is long polling or server side scripting is not new in the world of Web. It is an existing technique which can be achieve by Socket.IO, node.js and Nowjs. We could say SignalR is related to this, but a new prospect that it is completely uses JavaScript on Client side and ASP.NET on server side.

Comments

Popular posts from this blog

DD4TFormRouteHandler (posting a form as tridion page url)

ASP.NET routing enables us to use URLs that are not physical files, In DD4T we have the default page route definition. In which all page request redirct to Page controller and process the page. DD4TFormRouteHandler is a custom route handler responsible for mapping incoming browser requests to particular MVC controller actions, this works along with  DD4TFormHelper  (that generate the route information for the form) Posting a form in DD4T is not complicated, you can create the mvc form as a normal controller and action, then post it via AJAX. But, when we need to do post the form as normal page, It would need a tweak as the controller/action is not a page existed in tridion. This can be achieved by implementing a custom Mvc RoutHandler and reroute the posted form to the encrypted action and controller. It works as below daigram. So, how to do this. to render out the form we have BeginDD4TForm html helper as below that generate the form with encrypted route values....

Navigation in DD4T

There always been a question on What is the best approach for building navigation with DD4T and ASP.NET MVC? Answer is: There is TridionSiteMapProvider as part of the DD4T.Mvc project, which can be used out of the box. The  DD4T.Examples.Templates project also have a example on how Sitemap can be generated from the template ( TBB ) Many organization will have different kinds of navigation structure, It can be from very simple structure or it can be a heavily complex in nature. In this article you can see how the default SitemapProvider can be used and how we could customize to achieve complex Navigations like Megamenu or similar using TridionSiteMapProvider. Setting up the default TridionSiteMapProvider The only configuration you would need to do in web.config is set the your default sitemap provider is as below. <system.web> <siteMap defaultProvider= "TridionSiteMapProvider" enabled= "true" > <providers> <clear/> ...

Observer Pattern With C# 4.0

Observer Pattern "The Observer Pattern Defines a one-to-many dependency between objects so that when one object changes state, all of its dependents are notified and updated automatically." Publishers + Subscribers = Observer Pattern C# Introduced , IObserver<T> and IObservable<T> which will help push-based notification,also known as the observer design pattern. The IObservable<T> interface represents the class that sends notifications (the provider); the IObserver<T> interface represents the class that receives them (the observer). T represents the class that provides the notification information. An IObserver<T> implementation arranges to receive notifications from a provider (an IObservable<T> implementation) by passing an instance of itself to the provider's IObservable<T>.Subscribe method. This method returns an IDisposable object that can be used to unsubscribe the observer before the provider finishes sending...