SignalR Real Time with SignalR Jared Rhodes Senior Consultant Magenic.
SignalR. Code, not toothpaste
33
SignalR. Code, not toothpaste Realtime client/server communication Maarten Balliau w Technical Consultant RealDolmen @maartenballiau w
-
Upload
microsoft-developer-network-msdn-belgium-and-luxembourg -
Category
Technology
-
view
5.617 -
download
1
description
Almost all HTML5 and web applications today make use of AJAX to communicate between client and server. AJAX is great with asynchronous operations, but what about real-time communication? How would you push a message from server to client? HTML5 WebSockets offer a solution to all of these questions but are not supported in every browser and every network environment. SignalR is the new cool kid on the block: it leverages WebSockets when supported and falls back to different mechanisms when they aren’t. In this session, I’ll show you where and how to use SignalR to create rich real-time applications in the browser. No toothpaste. Just code.
Transcript of SignalR. Code, not toothpaste
SignalR. Code, not toothpasteRealtime client/server communication
Maarten BalliauwTechnical ConsultantRealDolmen
@maartenballiauw
R
Maarten Balliauw
@maartenballiauw
Who am I?
Web & cloudWindows Azure
Agenda
Why real-time & how?Meet SignalRConnections and HubsClientsQ&A
Why real-time & how?
Users want the latest info, NOW!Twitter – live searches/updates Stock streamersAuctionsLive scoresReal-time notificationsInteractive gamesCollaborative appsLive user analytics…
6
HTTP is an old beast…
Never designed for real-time communicationsWeb is request-responseWeb is stateless
HTML5 WebSockets to the rescue, right?
HTML5 WebsocketsExtension to HTTP
Provide raw sockets over HTTP
Full-duplex
Traverses proxies
It’s still a draft…
Not every proxy server supports it
Not every webserver supports it
Not every browser supports it
They are raw sockets!
HTTP/1.1 200 OKContent-Type: text/plainTransfer-Encoding: chunked
Forever Frame
Server tells client that response is chunckedClient keeps connection open untill server closes itServer pushes data to the client followed by \0Consumes server threads
Client<script>eval("... ")</script>\0
<script>eval("... ")</script>\0
Server
Periodic polling
Poll from time to time using AjaxDelay in communications due to polling intervalWastes bandwidth & latency
Polling interval
Client
Server
Fiddlerhootsuite.com
Long polling
Poll but don’t respond untill there’s dataPoll again after data received or after the connection times outConsumes server threads & connection resources
Client
Server
Fiddlerfacebook.com
Options!Forever FramePeriodic pollingLong pollingHTML5 WebSockets(Server-Sent events)
Meet SignalR
ARRR!
SignalR?
Three-in-one!“Persistent” client/server connection over best transportAbstracts away the transportProvides just one programming model
SignalR?David Fowler and Damian Edwards(two guys on the ASP.NET team)
Not an official Microsoft project (yet?)OSS project on Github, MIT licensedhttp://github.com/signalr/signalr
Simple to setup & just worksDepends on C# (not VB.NET), .NET 4+ and jQuery
Where do I get it?
where else!
http://amzn.to/xrzS6j
Hello, SignalRdemo
BONUS DEMO!Knockout.js & SignalR
What just happened?The server is broadcasting a message every few secondsClients are receiving messagesCode looks easyNo polling or whatsoever (at least not in my code)
Connections and Hubs
Two connection modelsPersistentConnectionCan communicate with 1..N clientsIs an IHttpHandlerRequires a route to be definedLimited to sending messagesYou define the “protocol”
HubsCan communicate with 1..N clientsAbstraction over PersistentConnectionRoute automatically mapped (/signalr/hubs)Can send messages and call methodsSignalR defines the protocol
Hello, SignalR hubsdemo
HubsHub methods can be called from clientClient methods can be called from hubTarget individual clientTarget all clientsTarget group of clients
http://jabbr.net
Clients
So far we’ve used…
On the server sideHost in any ASP.NET application (SignalR.Server)
On the client sideJavaScript (SignalR.JS)
But there’s more…
There’s a lot more!
On the server sideHost in any ASP.NET application (SignalR.Server)Use “SelfHost” - https://github.com/SignalR/SignalR/tree/master/SignalR.SelfHost Use Windows Azure
On the client sideJavaScript (SignalR.JS)Any .NET client (SignalR.Client)Any WP7 device (SignalR.Client.WP7)iOSAndroid
Is this a replacement for WCF?
DeckCastdemo
Session Summary
SignalR is three-in-one!“Persistent” client/server connection over best transportAbstracts away the transportProvides just one programming model
Connections & HubsConnect various clients
Make the web realtime!Install-Package SignalR
Be what’s next• Find everything here
http://aka.ms/mbl-tech• Visual Studio Developer Preview Downloads
http://aka.ms/mbl-tech/devprev• MSDN HTML5 Developer Center
http://aka.ms/mbl-tech/html5
Maarten Balliauw
@maartenballiauwQ&A
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.
ResourcesMy bloghttp://blog.maartenballiauw.be SignalR on Githubhttp://github.com/signalr/signalr SignalR on NuGethttp://www.nuget.org/packages?q=signalr Websocketshttp://github.com/signalr/signalr.websocketsScale-out on Windows Azurehttp://vasters.com/clemensv/2012/02/13/SignalR+Powered+By+Service+Bus.aspxObjective C clienthttps://github.com/DyKnow/SignalR-ObjCAndroid client (using MonoDroid)https://github.com/SignalR/SignalR/pull/127
