asp.net core 中的SignalR與web前端進行實時通訊

1、介紹

---

SignalR是.net 開源庫，用於構建須要實時進行用戶交互和數據更新的web應用，如在線聊天，遊戲，天氣等實時應用程序，且簡化了構建實時應用的過程，包括服務端庫和js端庫，繼承了數種常見傳輸方式，如long polling，websocket等，並提供相應的api供開發人員選擇。項目的流程圖以下：

 

2、項目實操

---

一、新建立一個.net core 2.2 web application 項目

二、添加SignalR客戶端文件

在添加這個文件時按照官方給出的步驟操做，個人vs一直會卡主，所以我直接從其餘項目複製過來，而後放在wwwroot文件夾下面的lib/signalr下，我複製了signalr.js和signalr.min.js文件便可。

文件請移步至個人github上下載案例。

 

三、建立SignalR中心
此中心用來客戶端與服務端的溝通橋樑。又叫作高級管道。
新建一個文件夾命名爲SignalRChat，而後建立一個類，如ChatHub，此類繼承與Hub
Hub 類管理鏈接、組和消息。

using Microsoft.AspNetCore.SignalR;
using System.Threading.Tasks;

namespace SignalRChat.Hubs
{
    public class ChatHub : Hub
    {
        public async Task SendMessage(string user, string message)
        {
            await Clients.All.SendAsync("ReceiveMessage", user, message);
        }
    }
}

特別注意在服務中心中的這個"ReceiveMessage"，是能夠傳參的，如修改爲一下的方式：

 public async Task SendMessage(string method,string user, string message)
        {
            await Clients.All.SendAsync(method, user, message);
        }

 

四、在項目中的startup.cs 注入SignalR的配置。
在ConfigureServices 中注入signalr到container中。

public void ConfigureServices(IServiceCollection services)
        {
            services.Configure<CookiePolicyOptions>(options =>
            {
                // This lambda determines whether user consent for non-essential cookies is needed for a given request.
                options.CheckConsentNeeded = context => true;
                options.MinimumSameSitePolicy = SameSiteMode.None;
            });


            services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_2);
            services.AddSignalR();
        }

在Configure 中注入中間件

 app.UseSignalR(a=> 
            {
                a.MapHub<ChatHub>("/chatHubs");
            }); 

五、服務端已經配置完成，接下來輪到 前端配置了。
前端頁面中須要添加 Signalr.js文件以及咱們自定義的chat.js此腳本用來鏈接SignalR以及發送接收用的數據用的。
注：下圖中的兩處標紅的位置名稱要一致，不然會形成數據沒法接收，這邊的名稱就是在SignalR中心中的自定義的方法標籤。

 

六、能夠運行應用
我開了兩個頁面，一個發送，一個就能夠接收了。

 

至此，SignalR簡單demo已OK

3、總結

---

 此案例之間簡單的進行通訊，尚未涉及到數據安全、身份驗證和受權等。後期將會繼續深刻研究。

 

github-demo：https://github.com/LouieGuo/SignalRLouie

參考文檔：入門：https://docs.microsoft.com/zh-cn/aspnet/core/tutorials/signalr?tabs=visual-studio&view=aspnetcore-2.2

 

asp.net core 交流羣：787464275 歡迎加羣交流
若是您認爲這篇文章還不錯或者有所收穫，您能夠點擊右下角的【推薦】按鈕精神支持，由於這種支持是我繼續寫做，分享的最大動力！

做者：LouieGuo

聲明：原創博客請在轉載時保留原文連接或者在文章開頭加上本人博客地址，如發現錯誤，歡迎批評指正。凡是轉載於本人的文章，不能設置打賞功能，若有特殊需求請與本人聯繫！

微信公衆號：歡迎關注                                                 QQ技術交流羣： 歡迎加羣