Real-time web functionality using ASP.NET SignalR
We all know how to push information from the client to the server, but getting the server to push information to the client in web applications in real-time has always been a challenge. In this post we look at SignalR capabilities and how you can learn to use it in your applications
What is ASP.NET SignalR?
ASP.NET SignalR is a new library that makes developing real-time web functionality easy. It allows bi-directional communication between server and client, pushing content to connected clients the instant it becomes available.
What this means is SignalR allows the server to send information to the front end in real-time.
You may be familiar with WebSockets, the HTML5 API that enables bi-directional communication between the browser and server. SignalR will use WebSockets when it’s available and fallback to other technologies when it isn’t. But you just write the SignalR code. There is also a simple API for doing server to client remote procedure calls from within your ASP.NET application along with hooks for connection management.
Check out the Microsoft Virtual academy session on SignalR September 24th, 2014 to learn how to implement SignalR in your applications
SignalR Case study
To get a better sense of when SignalR is helpful, let’s look at a real world implementation of SignalR. Thank you Michael Siu of IdeaNotion for sharing their experience with SignalR for their software IdeaCloud. IdeaCloud is a software tool that allows users to create real time social media clouds for events so real-time updates to their client are essential.
There are two important features in IdeaCloud that use SignalR: the "Announcement" (a push notification) and "Moderation" feature. With the implementation of these features we can push announcements to IdeaCloud and ban any feed at the moderation panel. These features are important for event organizers hosting large conferences that want greater control over their event.
Moderation
Moderation in IdeaCloud is used to ban a particular social message or user that is already on the IdeaCloud Wall. Administrators can use this feature to filter out unwanted users and messages. Administrators can filter through the Moderation panel, and their actions are sent using SignalR from back end to front end browsers. Then the browsers can hide or delete the comments in real-time.
Announcement
The announcement feature has a custom popup message on the front end which overlays on the IdeaCloud Wall. It is used to catch the audience’s attention at an event or conference. The Announcement panel triggers announcements you want to share with the audience. After inputting your message in HTML format, the user can set a timer to adjust how long the message will display. As soon as the user triggers the "Activate" button on the Announcement panel, SignalR will send this message from backend to front end browsers and have an overlay message displayed on their wall.
How SignalR is used in IdeaCloud?
In IdeaCloud, you can see how SignalR fits into the architecture:
IdeaCloud Server: Control Panel triggers the Announcement or the Moderate feature based on admin inputs. It will call LiveUpdateHub to broadcast its requests.
LiveUpdateHub: Keeps track of how many browsers open IdeaCloud and responsible for broadcasting the message to them
SignalR: In real-time, SignalR communicates between LiveUpdateHub and all available IdeaCloud walls.
IdeaCloud: Front end Javascript is responsible for listening to the broadcast messages and performing the Announcement or Moderation features
SignalR enables IdeaCloud to interact with admin inputs in real-time, which makes it a perfect tool for IdeaCloud to adopt. In the future, it will be able to use SignalR to extend IdeaCloud with audience inputs, which will be even more interesting. If you have any questions or want more information about IdeaCloud please visit the IdeaCloud website.
For more information about how to implement SignallR visit the SignalR site or check out the session on Microsoft Virtual Academy