Francesc Jaumot@fjaumotCo-founder at Clibb

Real-time Communications with SignalR

1) Introduction to the real-time web2) ASP.NET SignalR3) Building a real-time

Agenda

Without real-time

Got Data?

Got Data?

Got Data?

Here’s some data!

Got Data?

Got Data?

Got Data?ServerClient

With real-time

I do real-time, do you?

Yep!

ServerClientLet’s Party in Real-time!

Basically…

SignalR!!!

ServerClient

Introducing SignalR• Abstraction over transports• Events instead of task/async• Connection management• Broadcast or target specific client

What does SignalR do?

• Client to Server persistent connection over HTTP

• Easily build multi-user, real-time web applications

• Auto-negotiates transport

So how can SignalR know which methodology to use on both sides of the *persistent HTTP connection?

SignalR Fallback

Long Polling

Forever Frames

Server Sent Events

Web Sockets

Transport Negotiation

Let’s try Websockets!

No? How about SSE?No? Forever Frames?

Okay, then. Long Polling!

What does SignalR do?

• Allows server-to-client push and RPC• Built async to scale to 1000’s of

connections• Open Source on GitHub

SignalR Hubs

SignalR Hubs

A hub is a .NET class that inherits fromMicrosoft.AspNet.SignalR.Hub

Since Hubs are called on the client by name, the name can be customized if needed

The Clients property of a Hub class exposes dynamic properties useful for targeting specific clients

Hub classes also have virtual methods useful for responding to connected/disconnected events

Sending messages to all connected clients

Jon

Scott

BradyHub

Clients.All.doWork()

Sending messages to the calling client

Jon

Scott

BradyHub

Clients.Caller.doWork()

Sending messages to other connected clients

Jon

Scott

BradyHub

Clients.Others.doWork()

Sending messages to specific users

Jon

Scott

BradyHub

Clients.Users(“Brady”).doWork()

Demo

Microsoft /web

®

Backplane

SignalR Backplanes

Load balancing via a common transport mechanism

Load

Bala

nce

r

SignalR on the client

SignalR’s .NET Client NuGet

JavaScript Client .NET Client

SignalR JavaScript & .NET Client Parity

Using SignalR in New ASP.NET Web ApplicationsSignalR is included in the Visual Studio 2013 ASP.NET templates

NuGet

• Install the SignalR and/or SignalR JS packages

OWIN

• Wire up SignalR using OWIN in the Startup.cs file

HTML

• Include jQuery & SignalR jQuery Plugin in HTML

Hubs

• Create a SignalR Hub through which clients can communicate

Using SignalR in Existing ASP.NET Web Applications

NuGet

• Install the SignalR and/or SignalR JS packages

OWIN

• Wire up SignalR using OWIN in the Startup.cs file

HTML

• Include jQuery & SignalR jQuery Plugin in HTML

Hubs

• Create a SignalR Hub through which clients can communicate

Wire up SignalR using OWIN

Include the jQuery Scripts

Note – the order is important!

Create a Hub

Connect the client to the Hub using JavaScript

Introduction to ASP.NET MVCLighting Up Real-Time Web Communications with SignalR

And many more: Azure, mobile apps, games…

Microsoft Virtual Academy

Q&A

Francesc Jaumot@fjaumot