An introduction to SignalR
This deck was part of my presentation to Virtusa employees on an ASP.NET asynchronous, persistent signaling library known as SignalR
There is also a slide on how to use SignalR with SharePoint.
Date: August 2013
Follow / Tweet me: @ShehanPeruma
4. 4
What?
• Stock Ticker
• Live Scores
• News Feeds
• Dashboards
• VoIP
• Chat
• Auctions
• Activity
Streams
Improved User Experience & Server Performance
D e f i n i t i o n : an application that functions within a time
frame that the user senses as immediate or current.
Real Time Web Technologies
5. 5
How?
Multiple approaches exist to provide near real time functionality, but each has
it’s own set of pros & cons.
• Polling
• Long Polling
• Forever Frame (IE only)
• Server Sent Events (SSE)
• Web Sockets
Real Time Web Technologies
Server
Client
Server
Client
6. 6
Response4
Response3
Response2
Response1
Web Sockets – Quick Intro.
• Part of the Html 5 specification
• Full-duplex (unlike HTTP)
• Built on top of HTTP – can share
HTTP ports (i.e. 80 & 443)
• URL: ws:// & wss:// similar to
http:// & https://
• Client & Server support required
Real Time Web Technologies
Server
Client
Request1
Request2
Request3
Request4
Time
Frame3
Frame2
Frame1
Handshake
Response
Server
Client
Handshake
Request
Time
Frame4
PollingWebSockets
8. 8
• Initially developed by members of the ASP.NET team
• Part of the ASP.NET Technologies
• Open source and hosted on GitHub
• Distributed via NuGet
• Requires .NET 4.0 and above
What is SignalR?
S i g n a l R : An ASP.NET asynchronous, persistent
signaling library that enables the real-time, multi-user
web functionality for applications.
SignalR
14. 17
Connections & Hubs
SignalR
Persisted Connections (low-level)
• Can communicate with 1 to N clients
• Is an IHttpHandler
• Requires a route to be defined
• Limited to sending messages
• You define the “protocol”
Hubs (high-level)
• Can communicate with 1 to N clients
• Abstraction over
PersistentConnection
• Route automatically mapped
(/signalr/hubs)
• Can send messages and call
methods
• SignalR defines the protocol
15. 18
Hubs
• Hub methods can be called by the
clients (e.g. javascript)
• Client methods can be called by
the Hub
• Can send messages to all or
individual clients
• Ability to add clients to groups
• Messages can be sent to groups
• Handles connection lifetime
events
SignalR
16. 19
jQuery Proxy
• Two approaches:
• with generated proxy
• Use signalr.exe tool to create the proxy file.
• Without proxy but ‘late binding’
• Can be accessed by navigating to http://yoursite/signalr/hubs
• The proxy simplifies the code needed to communicate with the
server
SignalR
18. 21
Installing NuGet Packages
Getting Started
Search for SignalRInstall Microsoft ASP.NET SignalR
The required scripts & assemblies
will be added to the project.
20. 23
Hub Class
Getting Started
Inherits from Microsoft.AspNet.SignalR.Hub
Sends the message to all the clients by
calling the clients broadcastMessage method
Connected clients can call
the Hubs NewMessage method
21. 24
Client (JavaScript)
• Add reference to JavaScript
files
• Get reference to Hub
• Wireup events
• Start hub connection
• Call hub methods
Getting Started
24. 27
Groups
Hubs API
• Provides the ability to broadcast messages to a selected set of
clients
• Groups are not persisted on the server
• No API to retrieve group count or members
The developer would need to
keep track of this (e.g.
database).
Adding a client to a group
Sending
messages
to a group
26. 29
• Override the event handlers
• OnConnected
• OnReconnected
• OnDisconnected
• JavaScript methods available to notify client about connectivity
states
• $.connection.hub.connectionSlow
• $.connection.hub.reconnecting
• $.connection.hub.reconnected
• $.connection.hub.disconnected
Lifetime/Lifecycle Events
Hubs API
27. 30
• Send data to connected clients by calling methods from outside
the Hub
HubContext
Hubs API
SignalR Client SignalR Server
Windows
Service/Scheduler
The Hub classMethod belongs to a class that is not a Hub
Call the client method
29. 32
• Authorize - specify which users or roles have access to a hub or
method
• Scaleout
• Windows Azure Service Bus
• Redis
• SQL Server
Other Features
Hubs API
31. 34
• Create a ASP.NET Web Application
• Install SignalR using nuget
• Create the Hub
• Update Global.asax
• Publish
• Set web application pool to use .Net Framework 4.0 (you might
need to run the aspnet_regiis after changing the framework)
• Optional:
• Set the port to 80 and provide a host header (make sure to
update the host file with the same header name)
• Navigate to the site and ensure you can access the JavaScript
hub proxy (i.e. http://signalr.mydomain.com/signalr/hubs)
Hub Setup
SignalR & SharePoint
32. 35
• Within the page/CEWP/Webpart,etc.. Add reference to the
scripts in the hubs site
• Set jQuery to support cross domain communication
• Set the hub url
• Start the connection
Client Setup (SharePoint 2010)
SignalR & SharePoint
35. 38
Summary
• Provides the ability to add real time web functionality to
applications
• Push data to clients and/or groups
• Hubs enables remote procedure calls (RPCs) to be made from a
server to connected clients and from clients to the server
• Not limited to web clients