SignalR - Chenh

SignalR#

説明#

SignalR の役割は、安定した WebSocket 接続を確立し、サーバーからクライアントにメッセージを送信することです。

使用方法#

サーバー#

.net 環境を使用します。

プロジェクトに SignalR パッケージを追加します。
Hubs フォルダを作成します。
フォルダ内に最初の SignalHub : Hub を作成します。

このクラス内で「シグナル」を作成します。

using Microsoft.AspNetCore.SignalR;
// ...
// Signalにはパラメータを含めることもできます
public async Task OrgnizationSignal(){
  await Clients.All.SendAsync("orgnizationChanged");
}

プロジェクトに SignalR サービスを追加します。

// Program.cs 中
using CMS_miniAPI.Hubs;
//...
builder.services.AddSignalR();
// ルートマッピング
var app = builder.Build();
app.MapHub<SignalHub>("/signalHub");

app.Run();

クライアントウェブ#

ここでは、Vue-web クライアントを例にします。

プロジェクトに SignalR パッケージをインストールします。

npm install @microsoft/signalr
main.js で以下をインポートします。

import { HubConnectionBuild } from '@microsoft/signalr'

接続を確立します。

const connection = new HubConnectionBuild()
	.withUrl('/signalhub')
	.build();
// リスニングを設定
connection.on('orgnizationChanged',()=>{
  console.log("message");
})
connection.start();

必要な場所で signalr をウェブ側でパッケージ化し、接続を確立することができます。

注意事項#

Program.cs に signalR サービスを追加すると、正常に動作します。
Hubs 派生クラスは、クライアントの SignalR メソッド呼び出しを格納するためのもので、ウェブクライアントはconnection.invoke("name", {data})のように呼び出します。フォームアプリケーションでも同様で、接続オブジェクトのinvokeメソッドを呼び出します。
サーバーから直接メッセージを送信するには、hubContext.Clients.All.SendAsync('name', data)を呼び出します。
hubContext には、現在サーバーと接続している情報が格納されており、クライアントリストなどが含まれます。
Connection は、クライアントが確立した SignalR 通信接続です。
別の理解方法として、Hub 内のメソッドをSignalR サーバーメソッドと呼び、クライアントのconnection.on('name', func)をSignalR クライアントメソッドと呼びます。両方の側で相互に呼び出すことができます。サーバーはSendAsyncを使用してクライアントを呼び出し、クライアントはinvokeを使用してサーバーを呼び出します。

参考資料#

Web 实时通信，SignalR 真香，不用愁了 - Code 综艺圈 - 博客园 (cnblogs.com)