ASP.NET CoreでのSignalRテクノロジーの使用


はじめに
前回、ASP.NET CoreでWebSocketを使う方法についてお話ししましたが、読んだことがない方は参考にしてください WebSocket in ASP.NET Core 文章 .今回の主役はSignalRです.WebSocketの操作を簡略化するフレームワークを提供しています.
ASP.NET SignalRはASP.NETの下のクラスライブラリであり、ASP.NETのWebプロジェクトでリアルタイム通信が可能である.リアルタイム通信のWebとは?クライアント(Webページ)とサーバ側がメッセージや呼び出し方法を互いに通知できるようにするのは,もちろんリアルタイムで動作する.WebSocketsはHTML 5が提供する新しいAPIであり、Webページとサーバ側の間でSocket接続を確立することができ、WebSocketsが利用可能な場合(すなわちブラウザがHtml 5をサポートする)SignalRはWebSocketsを使用し、サポートされていない場合SignalRは他の技術を使用して同じ効果を保証する.SignalRはもちろん、サーバ側がクライアント上のJavaScript関数を単一または一括で呼び出すことができ、クライアントがサーバ側に接続されているか、接続が切断されているか、クライアントがパケット化されているか、クライアントが許可されているかなど、接続管理が非常に容易である.
カタログに戻る
二、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という名前のファイルを新規作成するには、次のようにします.


    
        
            
            
    

 
もちろんVisual Studioで設定することもできます NuGet Packagesのソースで、このプログラムセットを参照します.
2.project.jsonで参照を追加
"Microsoft.AspNetCore.SignalR.Server": "0.2.0-*","Microsoft.AspNetCore.WebSockets": "1.0.0-*"

SignalRのバージョンは0.2.0のalphaバージョンなので、後続のバージョンも大きく変化する可能性があります!書き直しやすいそうです.
注目すべきは、SignalRは現在ASP.NET Core 1.1以上でしか使用できませんが、この記事で私が使用している.NET Core SDKバージョンは 1.0.0-preview2-003131 ,だから、問題のある学生を引用してCoreAppバージョンを1.1に変更してみることができます.すべてのAspNetCoreのプログラムセットも1.1のバージョンに変更します.
3.構成コードの追加
Startupクラスの ConfigureServicesメソッドには、次のコードが追加されています.
public void ConfigureServices(IServiceCollection services)
{
     services.AddSignalR(options => 
     {
         options.Hubs.EnableDetailedErrors = true;
      });
}

StartupクラスのConfigureメソッドに次のコードを追加します.
app.UseWebSockets();
app.UseSignalR();

4.HUBクラスを追加
ここでは小さなDemoを1つだけ実現し、簡単なチャットルームに入り、複数の人がそれぞれ送信された情報を見ることができます.
public class ChatHub : Hub
{
        public static List ConnectedUsers;

        public void Send(string originatorUser, string message)
        {
            Clients.All.messageReceived(originatorUser, message);
        }

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

            ConnectedUsers.Add(newUser);
            Clients.Caller.getConnectedUsers(ConnectedUsers);
            Clients.Others.newUserAdded(newUser);
        }
}

5.クライアントサポート
wwwrootディレクトリの下にchat.htmlというHtml静的ファイルを作成します.内容は次のとおりです.
html>
    Awesome Chat Application
    
    
    
    
    
    
         
    
    
    
    
    


同ディレクトリの下に

var userName = prompt("Enter your name: ");var chat = $.connection.chatHub;
chat.client.messageReceived = function (originatorUser, message) {
    $("#messages").append('
  • ' + originatorUser + ': ' + message);
    };
    chat.client.getConnectedUsers = function (userList) {    for (var i = 0; i ' + user + '
  • ');
    }
    $.connection.hub.logging = true;
    $.connection.hub.start().done(function () {
        chat.server.connect(userName);
    });