詳解在ASP.NET Core下使用SignalR技術

這篇文章主要介紹了在ASP.NET Core下使用SignalR技術 ，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟著小編過來看看吧

一、前言

上次我們講到過如何在ASP.NET Core中使用WebSocket 。這次的主角是SignalR它為我們提供了一個簡化操作WebSocket的框架。

ASP .NET SignalR 是一個ASP.NET 下的類別庫，可以在ASP.NET 的Web專案中實現即時通訊。什麼是即時通訊的Web呢？就是讓客戶端（Web頁面）和伺服器端可以互相通知訊息及呼叫方法，當然這是即時操作的。 WebSockets是HTML5提供的新的API，可以在Web網頁與伺服器端間建立Socket連接，當WebSockets可用時（即瀏覽器支援Html5）SignalR使用WebSockets，當不支援時SignalR將使用其它技術來保證達到相同效果。

SignalR當然也提供了非常簡單易用的高階API，使伺服器端可以單個或批量調用客戶端上的JavaScript函數，並且非常方便地進行連接管理，例如客戶端連接到伺服器端，或斷開連接，客戶端分組，以及客戶端授權，使用SignalR都非常容易實現。

二、SignalR目前情況

我們知道在ASP.NET Core 1.0.x 版本中並沒有包含SignalR，但是SignalR技術計劃集成在ASP.NET Core 1.2版本中，並且它的開發團隊還要使用TypeScript對它的javascript客戶端進行重寫，服務端方面也會貼近ASP.NET Core的開發方式，例如會整合到ASP.NET Core依賴注入框架中。

目前的情況就是在1.0中無法使用SignalR技術，本文實現的Demo都是在1.1下進行的。

三、整合SignalR

當然ASP.NET Core 1.2離正式發布還有一段時間，目前想整合SignalR都不是現成的方案，我們要透過手動的方式整合SignalR。

要在ASP.NET Core中使用SignalR，若要先引用Microsoft.AspNetCore.SignalR.Server 、 Microsoft.AspNetCore.WebSockets 的NuGet Package套件。

當然上面也說過目前沒有ASP.NET Core沒有整合SignalR，所以NUGET上也找不到SignalR的程式包，想加入引用我們就得去MyGet去找找。

1.新增NuGet來源

在程式根目錄新建一個命為NuGet.Config的檔案內容如下：

<?xml version="0" encoding="utf-8"?>
<configuration>
  <packageSources>
    <clear/>
      <add key="aspnetcidev" value="https://dotnetmygetorg/F/aspnetcore-ci-dev/api/v3/indexjson"/>
      <add key="apinugetorg" value="https://apinugetorg/v3/indexjson"/>
  </packageSources>
</configuration>

2.在project.json加入引用

"MicrosoftAspNetCoreSignalRServer": "0-*",
"MicrosoftAspNetCoreWebSockets": "0-*"

3.新增設定碼

public void ConfigureServices(IServiceCollection services)
{
   servicesAddSignalR(options => 
   {
     optionsHubsEnableDetailedErrors = true;
   });
}

這裡我們只實現一個小Demo，一個簡單的聊天室，多個人進入可以看到各自發送的訊息：

appUseWebSockets();
appUseSignalR();

在wwwroot目錄下建立一個名為chat.html的Html靜態文件，內容如下：

public class ChatHub : Hub
{
    public static List<string> ConnectedUsers;

    public void Send(string originatorUser, string message)
    {
      ClientsAllmessageReceived(originatorUser, message);
    }

    public void Connect(string newUser)
    {
      if (ConnectedUsers == null)
        ConnectedUsers = new List<string>();

      ConnectedUsersAdd(newUser);
      ClientsCallergetConnectedUsers(ConnectedUsers);
      ClientsOthersnewUserAdded(newUser);
    }
}

同目錄下建立一個chat.jsr