Update 02/15/2018 – Please note that this is a pre-release version and it is not production ready yet. https://github.com/aspnet/SignalR/issues/429 for more discussion.

Whenever we want to implement real-time web functionality in .Net then first thing comes to our mind is SignalR.

What is SignalR?

ASP.NET SignalR is a library for ASP.NET developers that makes developing real-time web functionality easy. SignalR allows bi-directional communication between server and client. Servers can now push content to connected clients instantly as it becomes available. SignalR supports Web Sockets, and falls back to other compatible techniques for older browsers. SignalR includes APIs for connection management (for instance, connect and disconnect events), grouping connections, and authorization.

So basically SignalR can be used for pub-sub, Client-Server applications.

For example, we can implement chat with the use of SignalR. For this, client first subscribes to the Hub and once it is subscribed, Hub pushes the updates as soon as the updates are available.

Microsoft has announced .net core 2.0 in last August which did not have support for SignalR but recently SignalR has been rewritten to support .Net Core. The new SignalR is simpler, more reliable, and easier to use.

Important Note:

Please note that new SignalR is not compatible with previous versions of SignalR. It means that we cannot use the old server with the new clients or the old clients with the new server.

TypeScript Client

Till now the SignalR client was mostly depended upon the jQuery but with the newer version of SignalR has Javascript client which is written in TypeScript. It can be used from Node.js as well.

Let us create a sample client which we will use to invoke methods from the server(Sample of Hub server can be found at the end of the current post)

For Installation:

npm install @aspnet/signalr-client

Setup:

First of all, you need to add below dependencies in package.json file to use the client in Node.js application:

"dependencies": { "atob": "^2.0.3", "btoa": "^1.1.2", "eventsource": "^1.0.5", "msgpack5": "^3.5.1", "websocket": "^1.0.24", "xmlhttprequest": "^1.8.0" },

For Example, you want to make an application which reads stock rates as soon as the market is opened then first we will create a new hub connection in stocks.ts typescript file:

let hubConnection = new signalR.HubConnection( " http://localhost:8080/stocks " );

Then we will write streamStocks method which will collect the stock data by calling StreamStocks method of the hub:

function streamStocks (): void { hubConnection.stream("StreamStocks").subscribe({ next: (stock : any) => { console.log(stock); }, error: () => {}, complete: () => {} }); }

Then we will invoke the method streamStocks if the market is open and will invoke OpenMarket method if the market is not opened yet:

hubConnection.start().then(() => { hubConnection.invoke("GetMarketState").then(function (state : string): void { if (state === "Open") { streamStocks(); } else { hubConnection.invoke("OpenMarket"); } }); }).catch(err => { console.log(err); });

We can subscribe to marketOpened event which will then call streamStocks once the market is opened as below:

hubConnection.on("marketOpened", function(): void { streamStocks(); });

Streaming It is now possible to stream data from the server to the client. Unlike a regular Hub method invocation, streaming means the server is able to send results to the client before the invocation completes. Not more than one Hub per connection New SignalR does not support multiple hubs per connection also it is now not required to subscribe Hub methods before the connection starts. SignalR Server example As we have created the client, now let us create the hub. First of all, create an empty web application from Visual Studio 2017 templates: Then we need to add SignalR reference which you can add from Package console manager as shown below: Install-Package Microsoft.AspNetCore.SignalR -Pre which will add the SignalR reference into the project as below: