如何在.NET中集成SignalR

 

SignalR 簡介

SignalR是一個開放源代碼庫,可用於簡化嚮應用添加實時Web功能,實時Web功能使服務器端代碼能夠將內容推送到客戶端。

SignalR開源庫:https://github.com/SignalR/SignalR


SignalR 應用場景

需要高頻次從服務器獲取信息的應用:如預警、遊戲、社交網絡、投票、拍賣、地圖和GPS引用;

儀表盤應用:如數字大屏、儀表板、即時信息看板等;

協作應用:包括白板應用和團隊會議軟件;

通知應用:社交網絡、電子郵件、聊天、遊戲、預警和其他應用都需要使用的通知。


.NET Framework項目中集成SignalR

服務端(.NET Framework MVC)

選擇要引用Signalr的項目,右鍵點擊【管理NuGet程序包】搜索【SignalR】包,找到“ Microsoft.AspNet.SignalR ”,點擊【安裝】

因爲SignalR需要依賴其他程序包,在安裝“ Microsoft.AspNet.SignalR ”的同時,還會自動安裝“ Microsoft.AspNet.SignalR.Core ”、“ Microsoft.AspNet.SignalR.JS ”、“ Microsoft.AspNet.SignalR.SystemWeb ”。

還需引用添加Owin相關的包,Owin定義了 Web 服務器和應用程序組件之間的交互的規範。

同樣,在【管理NuGet程序包】搜索【Owin】包,找到“ Microsoft.Owin ”,點擊【安裝】

在項目中引入


Microsoft.Owin.Hosting
Microsoft.Owin.Cors
Microsoft.Owin.Host.HttpListener

在Web項目中【Startup.cs】文件中啓用SignalR。


    public class Startup
    {
        public void Configuration(IAppBuilder app)
        {
            app.MapSignalR();
       }
    }
創建一個類來繼承Hub類

    public class ServerHub : Hub
    {       
        public async Task DoWork()
        {
            //供客戶端調用
        }
        public async Task SendMessage(string msg)
        {
            // 當前連接用戶的標誌,是一個GUID,如:362d3597-041e-4d65-8fdf-e77e98425d38
            string connectionId = Context.ConnectionId;
            // 給所有人發送消息
            await Clients.All(connectionId).newmsg(msg);
            // 給組內所有人發送消息
            await Clients.Group(connectionId).newmsg(msg);
            // 給除去自己其他人發送消息
            await Clients.Others(connectionId).newmsg(msg);
            // 給自己發送消息
            await Clients.Caller(connectionId).newmsg(msg);
        }
    public async Task WhoIam(string connectionId)
    {
        // 當前連接用戶的標誌,是一個GUID,如:362d3597-041e-4d65-8fdf-e77e98425d38
        await Groups.Add(Context.ConnectionId, connectionId);
        await Clients.Group(connectionId).newmsg(Context.ConnectionId + "已登入");
    }
}


BuildHub中的方法供客戶端調用,方法中Clients代表客戶端對象。

把後臺服務啓動起來,然後查看SignalR狀態是否正常,如果出現如圖頁面則表示SignalR正常。

客戶端:

在網頁中引入SignalR相關JS


<script src="/Scripts/jquery.min.js"></script>
<script src="/Scripts/jquery.signalR-2.4.1.min.js"></script>
<script src="/signalr/hubs"></script>

客戶端頁面代碼:

<html>
<head>
    <title>SignalR</title>
</head>
<body>
    <div> 
        <input type="text" id="msg"/>
        <button id="sendMsg">發送消息</button>
    </div>
    <ol id="showMsg"></ol>  
	<script src="/Scripts/jquery.min.js"></script>
	<script src="/Scripts/jquery.signalR-2.4.1.min.js"></script>
	<script src="/signalr/hubs"></script>
    <script>
        $(function () {
            //獲取服務端連接對象
            var hub = $.connection.serverHub;
            //創建服務端所調用的客戶端方法
            hub.client.showMsg=function(name, msg){
                $('#showMsg').append('<li><span style="color:red">'+name+':</span>'+msg+'</li>')
            }
            //開始連接服務器
            $.connection.hub.start().done(function () {
                //連接成功
                $('#sendMsg').bind('click', function () {
                    //調用服務端發送方法
                    hub.server.SendMessage($('#msg').val());
                })
            }).fail(function () {
                //連接失敗
                alert("連接失敗");
            });
        })
    </script>
</body>
</html>

 

.NET Core中集成SignalR

先通過【管理NuGet程序包】搜索、安裝SignalR包,主要是配置上有點差異。

若項目是.NET6以前的版本,在【Startup.cs】中配置:


    public class Startup
    {
        public void ConfigureServices(IServiceCollection services)
        {
            services.AddControllers();

            services.AddSignalR();
        }
        public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }

            app.UseRouting();

            app.UseAuthorization();

            app.UseEndpoints(endpoints =>
            {
                endpoints.MapControllers();
                endpoints.MapHub("Hubs"); 
            });
        }
    }

若項目是.NET6以後的版本,則在【Program.cs】中配置:


var builder = WebApplication.CreateBuilder(args);
//添加SignalR服務
builder.Services.AddSignalR();


app.UseEndpoints(endpoints =>
{
    endpoints.MapControllerRoute(
        name: "default",
        pattern: "{controller=Home}/{action=Index}/{id?}"
    );

    //添加SignalR端點
    endpoints.MapHub("/Hubs");
});

來源:如何在.NET中集成SignalR https://www.iwmyx.cn/rhznetzjcsignalr.html

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章