SignalRを.NETアプリケーションに組み込む実践的手順

SignalRは、サーバーからクライアントへの即時メッセージ送信を実現するオープンソースライブラリです。リアルタイム通信を必要とするシステム(緊急アラート、オンラインゲーム、ライブチャットなど)の開発を簡素化します。

.NET Frameworkプロジェクトでの設定

NuGetパッケージ管理より「Microsoft.AspNet.SignalR」をインストールし、依存関係である「Microsoft.AspNet.SignalR.Core」を自動取得します。さらにOWIN関連パッケージも追加します。

using Microsoft.Owin;
using Microsoft.Owin.Cors;
using Microsoft.Owin.Hosting;

public class Startup
{
    public void Configuration(IAppBuilder app)
    {
        app.UseCors(CorsOptions.AllowAll);
        app.MapHub<CommunicationHub>("/communication");
    }
}

Hubクラスの実装例:

public class CommunicationHub : Hub
{
    public async Task TransmitMessage(string content)
    {
        string currentId = Context.ConnectionId;
        await Clients.All.SendAsync("displayMessage", currentId, content);
    }
    
    public async Task JoinGroup(string groupName)
    {
        await Groups.Add(Context.ConnectionId, groupName);
        await Clients.Group(groupName).SendAsync("notifyJoin", Context.ConnectionId);
    }
}

クライアント側JavaScript実装:

<script src="/scripts/jquery.min.js"></script>
<script src="/scripts/jquery.signalR-2.4.1.min.js"></script>
<script src="/communication/hubs"></script>
<script>
    $(() => {
        const communication = $.connection.communicationHub;
        communication.client.displayMessage = (id, msg) => 
            $('#messages').append(`<li>[${id}] ${msg}</li>`);
        
        $.connection.hub.start()
            .done(() => $('#sendBtn').click(() => 
                communication.server.transmitMessage($('#messageInput').val())
            ));
    });
</script>

.NET Coreプロジェクトでの設定

.NET 6以降のプロジェクトではProgram.csで設定します:

var builder = WebApplication.CreateBuilder(args);
builder.Services.AddSignalR();

var app = builder.Build();
app.MapHub<CommunicationHub>("/communication");
app.Run();

.NET 5以前のプロジェクトではStartup.csを修正:

public void ConfigureServices(IServiceCollection services)
{
    services.AddSignalR();
}

public void Configure(IApplicationBuilder app)
{
    app.UseRouting();
    app.UseEndpoints(endpoints => 
        endpoints.MapHub<CommunicationHub>("/communication"));
}

リアルタイム通信の基本構造を理解するために、WebSocketプロトコルを介した双方向接続が重要です。SignalRはこのプロトコルを抽象化し、開発者にシンプルなAPIを提供します。

タグ: SignalR .NET Framework ASP.NET Core real-time communication websocket

9月9日 06:18 投稿