If you just want to play and make a small up, start up Visual Studio 2010. First, make an Empty ASP.NET application, and install-package SignalR with NuGet, either with the UI or the Package Console.

Second, create a new default.aspx page and add a button, a textbox, references to jQuery and jQuery.signalR along with this script.

The /signalr/hubs endpoint exposes all the available hubs in the solution and lets you access their public methods. You will first need to initiate connection.

JavaScript

1

2

3

4

5

6

7

$.connection.hub.start()

.done(function(){

console.log("Connected!");

})

.fail(function(){

console.log("Could not Connect!");

});

Entire page source below:

C#

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

<head runat="server">

<title></title>

<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"type="text/javascript"></script>

<script type="text/javascript">

$(function(){

// proxy created on the fly

varchat=$.connection.chat;

// declare a method on the chathub so that the server can call it

chat.addMessage=function(message){

$('#messages').append('<li>'+message+'</li>');

};

$("#broadcast").click(function(){

// Call the chat method on the server

chat.sendMessage($('#msg').val());

$('#msg').val('').focus();

returnfalse;

});

// Start the connection

$.connection.hub.start();

});

</script>

</head>

<body>

<form id="form1"runat="server">

<div>

Enter message:

<input type="text"id="msg"/>

<input type="submit"id="broadcast"value="Send message"/>

<ul id="messages"></ul>

</div>

</form>

</body>

</html>

We have two choices of models with SignalR: low level using PersistentConnection or highlevel using Hub. Hubs expose public methods to the clients and raise callbacks on the clients. In most web-based scenarios, you will be utilizing hubs, which follow the publish-subscribe pattern. See Hubs for additional details.

When a connection between a web client and a server is made, SignalR will determine a suitable transport type based on your client capabilities. It will gracefully degrade so older browsers might get long-polling instead of the fancy WebSockets. The transport mode can have a significant impact on the performance of the app.

WebSockets (bidirectional stream)Server Sent Events (push notifications from server to browser using DOM events)Forever Frame (uses HTTP 1.1 chunked encoding to establish a single long-lived HTTP connection in a hidden iframe)Long polling (hit the server hit the server hit the server hit the server hit server and hope something comes back with data)

We’ll use second approach based on Hubs. Simply create a class and inherit from an abstract Hub class.

C#

1

2

3

4

5

6

7

8

9

10

11

12

13

14

usingSignalR.Hubs;

namespaceSignalRDemo.App_Code

{

//[HubName("chatHub")]

publicclassChat:Hub

{

publicvoidSendMessage(stringmessage)

{

// Call the addMessage method for all clients

this.Clients.addMessage(message);

}

}

}

When you want to distribute messages to your clients, you can do so using the Clients dynamic object. Any method that you call on Clients will raise a callback on the client. Furthermore, you can get access to the current client call id using Context.ConnectionId or Groups dynamic object which looks after groups management. To publish on a specific connection you can use Clients[“groupName”].method(params) or Clients[Context.ConnectionId].method(params).

Please check this link with a short demo with MVC3, signalR and backbone.js.