C# -Asp.Net.SignalR.Core之Hub


前言

程序員的進步是需要環境的,良好的團隊環境,良好的開發環境,會讓人進步的更加快速。

所以,我認為,如果一個程序員,在2019年還在用Visual Studio 2005開發,那么,他,大概率,不會想了解Linq是個什么東西,因為他根本用不到。

就如同我,一直在純Windows環境下開發,所以就對Core並不是很感興趣。

因此,如果一直用Visual Studio 2013以下版本開發的話,估計他對SignalR也就沒什么興趣。

因為我們都有個壞習慣,用不到的就不喜歡去學習。

引用SignalR

閑話少敘,現在我們開始學習SignalR。

首先,創建一個MVC項目,然后,我們打開Nuget搜索SignalR,如下圖:

成功引用后,我們查看引用,會發現程序引用了很多dll,比如Owin等等;這是因為SingalR的依賴項比較多,所以,我們也引用了比較多的DLL。

接着,我們會發現一個問題,我們添加引用是SignalR,但實際引用進來的卻是SignalR.Core,如下圖:

SignalR.Core和SignalR有什么區別呢?

我們上網查詢一下,發現,他們的差異大致上就是下面這句話。

【ASP.NET Core SignalR 不支持自動重新連接。 如果客戶端已斷開連接,則用戶必須顯式啟動新連接才能重新連接。 在 ASP.NET SignalR 中,如果連接斷開,SignalR 會嘗試重新連接到服務器。】

差異參考ASP.NET SignalR 和 ASP.NET Core SignalR 之間的差異

Startup

SignalR引入完成了,現在我們需要配置和使用它了。

如何配置呢?很簡單。添加Startup文件,修改代碼如下:

public class Startup
{
    public void Configuration(IAppBuilder app)
    {
        app.MapSignalR(); 
    }
}

Startup文件包含的功能很多,這里暫時不去詳解了,我們暫時只要知道,Startup文件會在網站啟動時跟着一起運行就可以了。

因為網站運行時會調用Startup的Configuration方法,所以,我們在這里打開SignalR的映射——app.MapSignalR(),即網站初始化,我們就開啟了SignalR的映射。

Hub

SignalR簡單的來說,是用於一個網頁即時通訊的工具,既然是即時通訊,那么肯定就是雙工——雙向的。

現在我們先來看下,【網頁——>服務器】這個方向的通訊。

網頁向服務器發送信息

首先,我們在服務器建立一個Hub,用來接收網頁的消息。

//這里命名盡量用小寫,因為前台只認小寫
[HubName("kibahub")]
public class kibahub : Hub
{  
    // 這里函數命名雖然是大寫,但前台Js調用要用小寫字母開頭
    public void Send(string message)
    {
        var id = Context.ConnectionId;   
    }
}

代碼很簡單,我們建立了一個類,並集成Hub,然后編寫了一個Send方法,供頁面調用。

還可以看到,我們在類上面加了一個特性,用來顯示的聲明這個Hub在網頁端的名稱。

接下來,我們編寫網頁代碼,在網頁中,使用JavaScript來調用這個Hub的Send方法,代碼如下:

<head>
    <script src="~/Scripts/jquery-3.3.1.min.js"></script>@*優先signalR引用*@
    <script src="~/Scripts/jquery.signalR-2.4.0.js"></script>
    <script src="~/Signalr/hubs"></script>@*這個是臨時生成的文件,里面保存的是我們在服務器定義的hub生成的JavaScript代碼*@
</head>
<body>
            <script type='text/javascript'> 
                //引用自動生成的代理,kibahub是HubName注解屬性 
                var kibaHub = $.connection.kibahub;
                console.log("kibaHub get");
                //開始連接
                $.connection.hub.start().done(function () {
                    console.log("hub start done");
                    //客戶端發送信息到服務器
                    kibaHub.server.send('kiba');
                    console.log("Send done");
                }); 
            </script> 
   
</body>
</html>

從代碼中可以看到,我們首先引用了三個js文件。

第一個沒啥可說的,就是jq的文件。

第二jquery.signalR-2.4.0.js文件,是我們在引用SignalR時,一起引入進來的,在Scripts文件夾下,我們也直接引入即可。

第三Signalr/hubs個文件大家應該很奇怪,我們項目里根本沒有這個文件夾,也沒有這個文件,而且這個hubs文件居然還沒有后綴名。

事實上這個文件夾和文件的確是不存在的,因為,它們是在我們運行網站時,才會生成的臨時文件。目前先不去管他是什么,我們只要知道,需要這個引用就可以了。

接下來,我們看下JavaScript代碼。

在js代碼里,我們通過$.connection.kibahub這樣一句話就獲取到了服務器的kibahub類的實例了,然后,我們只要調用它的Send方法就可以了。

但是在調用之前,我們需要先連接一下服務器。所以就有了這么一句話 $.connection.hub.start()。

到此,網頁向服務器發送數據已經編寫完成了,下面我們運行網站,在瀏覽器中按下F12進入調試模式,然后選擇Console(控制台)來查看我們的輸出內容。

如上圖所示,我們的SignalR成功的向服務器發出了信息。

服務器向網頁發送信息

網頁請求已經發送成功了,現在我們開始編寫服務器向網頁發送信息。

首先,我們在kibahub類的Send方法里稍作修改,代碼如下。

public void Send(string message)
{
    var id = Context.ConnectionId; 
    IHubContext context = GlobalHost.ConnectionManager.GetHubContext<kibahub>();
    context.Clients.Client(id).getmessage("518"); 
}

可以看到,我們在Send方法中獲取了當前連接的唯一標識ConnectionId,然后我們利用這個ConnectionId找到他對應的Client客戶端。

在通過Client客戶端調用網頁中JavaScript定義的函數getmessage,並向他發送信息518。

這樣服務端的代碼就編寫完成了。

但我們會發現,我們好像並沒有在網頁端用JavaScript定義過函數getmessage呀。

別着急,我們現在就去網頁定義這個方法。

 <script type='text/javascript'> 
     var kibaHub = $.connection.kibahub; 
     $.connection.hub.start().done(function () {
         console.log("hub start done"); 
         kibaHub.server.send('kiba');
         console.log("Send done");
     });
     kibaHub.client.getmessage = function (message) {
         console.log("getmessage:" + message);
     };
 </script> 

如上述代碼所示。我們可以看到getmessage 已經定義好了,現在我們在運行下網站。

如上圖所示,服務成功的向客戶端發出了信息。

----------------------------------------------------------------------------------------------------

到此Asp.Net.SignalR.Core就介紹完了。

框架代碼已經傳到Github上了,歡迎大家下載。

Github地址:https://github.com/kiba518/KibaSignalR

----------------------------------------------------------------------------------------------------

注:此文章為原創,任何形式的轉載都請聯系作者獲得授權並注明出處!
若您覺得這篇文章還不錯,請點擊下方的推薦】,非常感謝!

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM