1. 前言
本文是根據網上前人的總結得出的。
環境： SignalR2.x，VS2015，Win10
2. 開始開發
1）新建一個MVC項目，叫做SignalRDemo
2）安裝SignalR包
Install-Package Microsoft.AspNet.SignalR
Install-Package Microsoft.AspNet.SignalR.Client
安裝完包后會有相應的引用和js文件
3）新建startup文件，用來啟動SignalR
代碼如下：
using System; using System.Threading.Tasks; using Microsoft.Owin; using Owin; [assembly: OwinStartup(typeof(SignalRDemo.SignalR.StartupSignalR))] namespace SignalRDemo.SignalR { public class StartupSignalR { public void Configuration(IAppBuilder app) { // 有關如何配置應用程序的詳細信息，請訪問 http://go.microsoft.com/fwlink/?LinkID=316888 app.MapSignalR();//啟動SignalR } } }
4）新建Hub類，MyHub。此類的作用是用來與客戶端的連接。
可以看到[HubName("myHub")]的注解，是用來與前端JS做綁定
using System; using System.Collections.Generic; using System.Linq; using System.Threading.Tasks; using System.Web; using Microsoft.AspNet.SignalR; using Microsoft.AspNet.SignalR.Hubs; namespace SignalRDemo.SignalR { [HubName("myHub")] public class MyHub : Hub { //當連接hub實例時被調用 public override Task OnConnected() { string connId = Context.ConnectionId; return base.OnConnected(); } //當失去連接或鏈接超時時被調用 public override Task OnDisconnected(bool stopCalled) { //stopCalled=true時，客戶端關閉連接 //stopCalled=false時，出現鏈接超時 return base.OnDisconnected(stopCalled); } //重新連接時被調用 public override Task OnReconnected() { return base.OnReconnected(); } } }
上面已經新建了與前端連接類。下面我們開始不同的調用方式
至此，我們創建環境已經結束。
3. 不同調用方式
1）前端調用后端
前端html：
myHub是HubName注解屬性。2個js一定要引用：Jquery、SignalR。scripts中有src='/SignalR/hubs'，其中SignalR是我們服務器端的文件夾，hubs是不存在的文件夾。
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <meta charset="utf-8"/> <script src="/scripts/jquery-1.10.2.min.js"></script> <!--Reference the SignalR library. --> <script src="/scripts/jquery.signalR-2.2.1.js"></script> <!--Reference the autogenerated SignalR hub script. --> <script src='/SignalR/hubs'></script> <!--Add script to update the page and send messages.--> <script type='text/javascript'> $(function () { //引用自動生成的代理，myHub是HubName注解屬性 var myHub = $.connection.myHub; //開始連接 $.connection.hub.start().done(function () { //客戶端發送信息到服務器 myHub.server.Send($.connection.hub.id); }); }); </script> </head> <body> </body> </html>
后端MyHub類中，添加方法：
//客戶端發送信息到服務器 public void Send(string message) { }
訪問html，就能直接調用Send方法了。
至此，前端調用后端，結束。
2）后端主動調用前端
前端代碼，增加了后端調用前端JS
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <meta charset="utf-8"/> <script src="/scripts/jquery-1.10.2.min.js"></script> <!--Reference the SignalR library. --> <script src="/scripts/jquery.signalR-2.2.1.js"></script> <!--Reference the autogenerated SignalR hub script. --> <script src='/SignalR/hubs'></script> <!--Add script to update the page and send messages.--> <script type='text/javascript'> $(function () { //引用自動生成的代理，myHub是HubName注解屬性 var myHub = $.connection.myHub; //后端調用前端 myHub.client.serverSend2Client = function (message) { console.log("serverSend2Client message=" + message); }; //開始連接 $.connection.hub.start().done(function () { //客戶端發送信息到服務器 myHub.server.send($.connection.hub.id); console.log("connection.hub.id=" + $.connection.hub.id); }); }); </script> </head> <body> </body> </html>
后端代碼：
我們新建一個Notifier的靜態類，好處是讓其他類可以靈活地調用，你也可以把方法寫在Hub類中
serverSend2Client方法是與前端綁定的JS方法，可以看到前端也有此方法。
public static class Notifier { private static readonly IHubContext Context = GlobalHost.ConnectionManager.GetHubContext<MyHub>(); public static void ServerSend2ClientMethod(string connectionId, string message) { //注冊后端與前端的方法serverSend2Client。connectionId是判斷發送給哪個前端 Context.Clients.Client(connectionId).serverSend2Client(message); } }
我們在Controller中，添加代碼，達到，后端主動調用前端的目的。
注意，connectionId在后端與前端后可以獲取。
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; using SignalRDemo.SignalR; namespace SignalRDemo.Controllers { public class DefaultController : Controller { // GET: Default public ActionResult Index() { //接收connId，connId是前端與后端連通的唯一標識 string connId = Request["connId"] ?? ""; //調用 后端主動調用前端的方法 Notifier.ServerSend2ClientMethod(connId, Math.Round(1000.0) + ""); return View(); } } }
至此，后端主動調用前端代碼結束。
代碼下載地址GitHub https://github.com/cjt321/SignalRDemo
如果你的部署是負載均衡，多台服務器，可以查看Redis與SignalR的配置。C# BS消息推送 負載均衡-SignalR&Redis的配置（三）
可以關注本人的公眾號，多年經驗的原創文章共享給大家。
