What is SignalR
According to Wikipedia, ASP.NET SignalR is a library for ASP.NET developers to add real-time web functionality to their applications.

SignalR is a framework for building asynchronous applications. “R” stand for “Real Time”. SignalR is a realtime communication framework built on top of the WebSoket specification.

It does fallback to classic HTTP when websockets are not supported by client or server. SignalR is stateless by design and it’s not aware of ASP.NET user session

MVC SignalR Project
To create sample applications, we need to have Visual Studio 2012 or later installed and be able to run the server on a platform that supports .NET 4.5.

Step 1:

MVC SignalR Project

Step 2:

Web application

Step 3:

Empty template

Getting Started with SignalR

The first thing is NuGet, which is used to get the needed SignalR assemblies into our solution. Next, we focus on creating OwinStartup class.

Get it on NuGet!
Install-Package Microsoft.AspNet.SignalR

Getting Started with SignalR

Register SignalR middleware

The following code is to define the SignalR Hubs route using an OWIN startup class. Now we will create OwinStartup Class:

Register SignalR middleware

Startup.cs
  1. using System;
  2. usingSystem.Threading.Tasks;
  3. usingMicrosoft.Owin;
  4. usingOwin;
  5. [assembly: OwinStartup(typeof (WebAppSignalR.Startup))]
  6. namespaceWebAppSignalR
  7. {
  8. publicclassStartup
  9. {
  10. publicvoid Configuration(IAppBuilder app)
  11. {
  12. app.MapSignalR();
  13. }
  14. }
  15. }
Explanation

The following attribute will set the startup class to the TestStartup class in the StartupDemo namespace.
  1. [assembly: OwinStartup(typeof(WebAppSignalR.Startup))]
Add the following code to the Startup.Configuration method:
  1. public void Configuration(IAppBuilder app)
  2. {
  3. app.MapSignalR();
  4. }
This code adds a simple piece of middleware to the OWIN pipeline, implemented as a function that receives a Microsoft.Owin.IOwinContext instance. When the server receives an HTTP request, the OWIN pipeline invokes the middleware. The middleware sets the content type for the response and writes the response body.

Create and use Hub classes

After this we will focus on creating a Hub, which we discussed earlier.

Create and use Hub classes

The following class is a simple Hub class in this application that derives from Microsoft.Aspnet.Signalr.Hub.
  1. namespace WebAppSignalR.Hubs
  2. {
  3. public classMessageHub: Hub
  4. {
  5. public void SayHello(String message)
  6. {
  7. Clients.All.Hello(message);
  8. }
  9. }
  10. }
HomeController Code
  1. namespace WebAppSignalR.Controllers
  2. {
  3. public class HomeController: Controller
  4. {
  5. // GET: Home
  6. public ActionResult Index()
  7. {
  8. return View();
  9. }
  10. }
  11. }
Index View Code
  1. @{
  2. ViewBag.Title = "Index";
  3. } < h2 > Say Hello < /h2> < divid = "messages" > < /div> < hr / > < inputtype = "text"
  4. id = "myMessage"
  5. value = "" / > < buttontype = "button"
  6. id = "submit" > Send! < /button>
  7. @section JavaScript
  8. { < scriptsrc = "~/scripts/jquery-1.10.2.min.js" > < /script> < scriptsrc = "~/scripts/jquery.signalR-2.2.0.min.js" > < /script> < scriptsrc = "~/signalr/hubs" > < /script> < scripttype = "text/javascript" > $(function ()
  9. {
  10. var hub = $.connection.messageHub;
  11. //client method which can be called from the server
  12. hub.client.hello = function (message)
  13. {
  14. $("#messages").append("<p>" + message + "</p>");
  15. };
  16. // Wait for the connection
  17. $.connection.hub.start().done(function ()
  18. {
  19. //click event handler to send the message
  20. $("#submit").click(function ()
  21. {
  22. var message = $("#myMessage").val();
  23. //invoke method
  24. hub.server.sayHello(message);
  25. //reset field
  26. $("#myMessage").val("");
  27. });
  28. });
  29. }); < /script>
  30. }
Output

Output