You are on page 1of 15

ASP.

NET Core

SignalR In 10 Minutes!

Keivan Damirchi

Include:
● What is SignalR?
● Use cases of SignalR
● Example of SignalR In ASP.NET Core
● Understanding the SignalR Architecture
● Authentication and authorization in SignalR
● SignalR and IoT
● Tips for working with Signalr
What is SignalR?

SignalR is a real-time messaging library developed by


Microsoft that enables bi-directional communication
between clients (such as web browsers, mobile devices,
and desktop applications) and a server.

It provides a simple and scalable way to add


real-time communication and updates to web
applications, allowing users to receive updates and
messages in real-time without having to refresh the
page or submit a request manually.

1
Common Use Cases of
SignalR
Chat Applications
SignalR can be used to build chat applications where
users can communicate in real-time. SignalR makes it
easy to send messages to a group of users or to a
specific user.

Real-time Gaming
Real-time gaming applications can use SignalR to
provide an immersive gaming experience where players
can communicate with each other and receive updates
in real-time.

Financial Trading Applications


Financial trading applications require real-time updates
to keep traders informed about the latest market trends.
SignalR can be used to provide real-time updates to
traders.

Collaboration Applications
Applications that require collaboration among
multiple users in real-time can benefit from
SignalR. Examples include document editing and
project management applications.

2
Common Use Cases of
SignalR

Live Dashboards
SignalR can be used to build real-time dashboards that
update automatically as data changes. This is useful in
monitoring applications, where real-time updates are
required to track changes in the system.

Notifications
SignalR can be used to send real-time notifications to
users about updates, events, or changes in the system.
For example, notifications can be sent to users when
a new order is placed, or when a new message is
received.

Tip
Before you start working with SignalR, it's important to
understand the basics of how it works.

3
Using SignalR in
an ASP.NET Core
application
Install the SignalR package

Microsoft.AspNetCore.SignalR

Create a SignalR hub

In this example, the hub has a single method called "SendMessage" that
takes a username and a message as parameters. The method sends the
message to all connected clients using the "SendAsync" method, which
sends a message to all clients with a matching method name
("ReceiveMessage" in this case).

4
Using SignalR in
an ASP.NET Core
application
Add the hub to the application
In the "ConfigureServices" method of your "Startup" class, add the
following code to enable SignalR:

services.AddSignalR();

Then, in the "Configure" method, add the following code to map the
"ChatHub" class to a URL:

This will make the "ChatHub" class accessible at the URL "/chathub".

5
Using SignalR in
an ASP.NET Core
application
Call the hub from the client
In your client-side code (e.g. JavaScript), you can connect to the hub
and call the "SendMessage" method like this:

This code creates a new connection to the "/chathub" URL, and


then calls the "SendMessage" method with the specified username
and message.

Tip
SignalR supports multiple transports such as
WebSockets, Server-Sent Events (SSE), and long polling.
Each transport has its own advantages and
disadvantages, so it's important to choose the
appropriate one for your application.

6
Understanding the
SignalR Architecture
The architecture of SignalR is designed to simplify the
process of building real-time web applications.

Here are the key components of the SignalR architecture:

Hubs: A hub is a high-level Clients: Clients are the users


pipeline for client-server or devices that connect to the
communication that handles SignalR server to receive and
the details of connection send real-time messages. The
management, message SignalR client library provides
routing, and serialization. It a set of APIs that allow clients
to send and receive messages
allowing clients to call
in real-time.
server-side methods, and
vice versa.
Connections: A connection
represents a single client's
Transports: SignalR uses a variety connection to the SignalR server.
of transports to establish and Each connection is identified by a
maintain the connection between unique ID, which allows the
the client and the server. server to track the state of the
Transports include WebSockets, connection and send messages to
Server-Sent Events (SSE), Long the appropriate client.
Polling, and Forever Frame.

SignalR Server: The SignalR server is responsible for managing the


connections, handling message routing, and managing the
communication pipeline between the clients and the server.

7
Understanding the
SignalR Architecture
The basic flow of SignalR communication is as follows:

1 The client establishes a connection to the


SignalR server using a transport.

2
The SignalR server receives the connection
request, creates a new connection object, and
sends back a connection ID to the client.

3 The client sends messages to the server by


invoking server-side methods defined on the hub.

4
The server receives the message, and uses the
connection ID to send the message to the
appropriate client.

5 The client receives the message and updates


the UI accordingly.

8
Authentication and
authorization in
SignalR
In an SignalR application, authentication and authorization
are typically implemented using middleware and the Authorize
attribute. Middleware is used to authenticate and authorize
incoming requests, while the Authorize attribute is used to
restrict access to specific SignalR hubs or hub methods based
on user authentication and authorization status.Here's a
simple example of authentication and authorization in ASP.NET
Core SignalR.

Configure Identity in the ConfigureServices method of Startup.cs:

This sets up cookie


authentication with
a login path and
Define
authorization
policies. In Startup
class, we also
need to map
ChatHub to the
"/chat" endpoint.

9
Authentication and
authorization in
SignalR
Add the [Authorize] attribute to the hub class to require
authentication for all methods, and add the
[Authorize("policyName")] attribute to specific methods to
require authorization based on the defined policy.

This ensures that only authenticated users can access the hub,
and only users with the "Admin" role can call the KickUser method.

10
Authentication and
authorization in
SignalR
Finally, in the client-side JavaScript code, use the
AccessTokenFactory provided by the @microsoft/signalr package
to get the access token for the current user:

This gets the access token from the server-side /Account/Token endpoint,
and passes it to the SignalR connection as an access token factory.

11
SignalR and IoT
SignalR can be used to provide real-time
communication between IoT devices and a server. For
example, imagine a scenario where multiple sensors are
sending data to a server. The server can use SignalR to
push this data to a web or mobile application in
real-time. This allows the application to display the
sensor data in real-time and respond to changes as they
occur.

Imagine you have a fleet of trucks that are equipped with GPS
sensors that send location data to a central server. You want to
build a real-time monitoring application that displays the
location of all the trucks on a map, and updates the map in
real-time as the trucks move around. To accomplish this, you
could use SignalR to establish a real-time connection between
the server and a web-based map application. The GPS data from
the trucks would be sent to the server, which would use SignalR
to push updates to the map application in real-time.

12
SignalR and IoT
Here's an outline of how this could work:

1. Each truck has a GPS sensor that sends location

data to the server at regular intervals.

2. The server receives the GPS data and processes it

to determine the current location of each truck.

3. The server then uses SignalR to push updates to

the map application, sending the current

location of each truck.

4. The map application receives the updates in

real-time and updates the map accordingly.

5. The user can view the location of all the trucks on

the map, and see updates as they move around.

By using SignalR in this way, you can build a real-time monitoring


application that provides up-to-the-minute information about the
location of your fleet of trucks.

13
Close();

Keivan Damirchi

You might also like