If you haven't already checked out what is going on with SignalR, then I suggest you go take a look over at Scott Hanselman's blog and read up about it http://www.hanselman.com/blog/archives.aspx#SignalR and then go to the SignalR website and read the documentation there http://signalr.net/ as it may be the solution to some of your Real-Time problems that you might come across.
Here is an example of how to get SignalR running in a MVC project via Visual Studio and the NuGet package manager console.
Create a new MVC project called "MySignalR" ( either 3 or 4, and either an empty project or a templated project ). I will choose the Empty project for mine.
Via the NuGet package manager console, type
Install-Package SignalR
This will add all the necessary files to your project (SignalR assemblies, Newtonsoft assembly, and various javascript files required). If you don't have NuGet installed in your visual studio, then visit this site for more information on how to install http://nuget.codeplex.com/wikipage?title=Getting%20Started
You will now want to create a Hub to which will be your message "router". So create a new class, "SNLR.cs" and add the following code:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using SignalR;
using SignalR.Hubs;
namespace MySignalR
{
public class SNRL : Hub
{
public void SendMessage(string msg)
{
Clients.sendMessage(msg);
}
}
}
If you have chosen the Empty project, then you will need to create a "Shared" folder within your "Views" folder. Within this, then create a new View called "_Layout.cshtml". This will be the layout for your page and will reference all the Javascript files needed.
Once you have created your _Layout page, add a link to the following javascript files, so your page looks like this:
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>_Layout</title>
</head>
<body>
<div>
@RenderBody()
</div>
<script src="~/Scripts/jquery-1.6.4.min.js"></script>
<script src="~/Scripts/jquery.signalR-0.5.3.min.js"></script>
<script src="~/signalr/hubs"></script>
@RenderSection("JavaScript", false)
</body>
</html>
Within your Views folder, add a file called "_ViewStart.cshtml" and add the following code:
@{
Layout = "~/Views/Shared/_Layout.cshtml";
}
Create a new Empty Controller in your Controllers folder and name it "Home". This will generate the "Index" ActionResult, so then right click on the word "View();" and select "Add View" making sure that you have "User a layout or master page:" selected.
Add the following code to this newly created "Index.cstml" page:
@{
ViewBag.Title = "Index";
}
<h2>Index</h2>
<span id="mySpanTag"></span>
@section JavaScript{
<script>
$(function () {
var myHub = $.connection.sNRL;
myHub.sendMessage = function (data) {
$('#mySpanTag').html(data);
};
$.connection.hub.start(function () {
myHub.sendMessage("Hello World!");
});
});
</script>
}
Run the project. You will see the phrase "Hello World" on the screen. This has been sent from our JavaScript code to our SNLR Hub and then sent back to our JavaScript code, which then renders it on the page. Simples!
Once you have mastered the basics, you can then look into sending messages from the Hub to only the person requesting the data, or groups of users.
If I find more time I will blog about these features, and maybe a more advanced demo on using SignalR with Knockoutjs.
If you are keen to learn more, then it would be wise to follow @davidfowl and @DamianEdwards as these are the main guys behind SignalR. So any updates/changes/bugs etc... then they will probably tweet about it.
Also head on over to http://jabbr.net/#/rooms/signalr where there are daily chats about anything and everything SignalR.
