一. 整体介绍

二. 从零搭建

 1. 新建MVC5项目，通过Nuget安装程序集：Microsoft.AspNet.SignalR，安装成功后如下图。

2. 新建一个中心模型Hub类（MySpecHub1），该类继承了Hub类，并且几个必要方法可以override。

3. 新建一个OWIN Startup Class(Startup)，并在Configuration方法中指定使用的通讯模型的URl，  这里采用默认的方式：如： app.MapSignalR(); 【后续展开介绍如何指定URL及其中的问题】

　　PS： 程序启动时候首先会找到该类,然后运行里面的Configuration方法，从而url和通讯模型的匹配将生效。

4. 引入必要的JS文件，进行前端代码的编写，如下图。【后续详细介绍】

三. 模型和URL匹配

 　　我们都知道，在OWIN Startup Class(即Startup类)中Configuration方法中进行模型URL的指定，并且在很多例子中，看到都是这么写：app.MapSignalR(); 貌似并没有配置URL，但事实上并不是这样的，我们通过反编译代码可以看到，它会默认指定一个路径  "/signalr"  ,如下图：

　　特别注意：这里的"/signalr"，与js端的自动生成代理类的代码：<script src="~/signalr/hubs"></script>没有任何毛线关系，这两个根本不是一个东西！！！！！，只是路径相似而已罢了。

 　　那么如何指定路径：

　　通过 代码：app.MapSignalR("/myhub1", new HubConfiguration()); 可以将路径指定为："/myhub1"，至于前端页面怎么与之匹配，在下面介绍。

　　PS：这里还可以配置其它参数，如下图：

四. 服务器端代码介绍

 　　前端页面的JS代码有两种模式，代理模式和非代理模式（下面介绍），但无论JS使用哪种模式，服务器端的代码都是唯一不变。

1. MySpecHub1类继承成Hub类，所以可以Override三个方法：

　　(1). OnConnected：连接成功时调用

　　(2). OnDisconnected：连接断开时调用

　　(3). OnReconnected：重连时调用

2. 自定义方法

　　服务器端可以自定义方法供客户端调用，比如：  public void AddUser(string userName, string userId){....}

　   特别特别注意：前端【代理模式】的情况下调用的服务器端方法或者与代理文件建立连接时，有一个非常坑爹的规则，首字母必须小写，比如服务器端定义方法为：“AddUserMsg”，前端【代理模式】情况下调用必须写成：“addUserMsg”；再比如这里的Hub类为 "MySpecHub1"，前端调用的时候必须写成"mySpecHub1"；对此我表示很无语，当年这一点坑了我很久！！！

　　PS：上述指定是【代理模式】，【非代理模式】不存在这个问题。

虽然我们已经知道这个规则了，但经常写着写着就忘了，那么如何解决上面这个问题呢？：

　　这里有两个特性分别是：[HubName()] 和  [HubMethodName()]，可以自行指定Hub类和自定义方法的名称，指定为什么，前端调用就用什么，这样【代理模式】下，坑爹的首字母小写规则，就不存在了。为了后续不麻烦，所以我通常在每个方法上面都加： [HubMethodName(nameof(方法名))]，这样就不会存在问题了，如下图：

 3. 上下文对象（this.Context）

　　(1). 当前用户的标记: this.Context.ConnectionId （Guid生成，不会重复）

　　(2). 其它信息：RequestCookies、Headers、QueryString、User、Request

4. 如何调用客户端方法 

　　使用Clients对象进行调用，Clients对象下的属性和方法有：

　　　　① 向所有人发送(包括自己)：All { get; }

　　　　② 向所有人发送(排除一些人)：AllExcept(params string[] excludeConnectionIds);

　　　　③ 向指定人发送，一对一：Client(string connectionId);

　　　　④ 向一些人发送,一对多：Clients(IList<string> connectionIds);

　　　　⑤ 向某个组发送(排除一些人)：Group(string groupName, params string[] excludeConnectionIds);

　　　　⑥ 向多个组发送(排除一些人)：Groups(IList<string> groupNames, params string[] excludeConnectionIds);

　　　　⑦ 由Id标识的特定用户：Users(IList<string> userIds);

　　　　⑧ 由Id标识的特定多用户：User(string userId);

　　调用形式比如：Clients.All.客户端方法名称

5. 组的概念（Groups对象）

　　① 将连接添加到指定组：Task Add(string connectionId, string groupName);

　　② 从指定组中删除连接：Task Remove(string connectionId, string groupName);

　　调用如：this.Groups.Add("", "");

截图几段代码：

五. 客户端(js)代码介绍-代理模式

 1. 必备JS文件的引入

　　前端Html页面使用SignalR，必须引入两个文件：JQuery和SignalR，必须JQuery在上，且最低版本为1.6.4，不能再低了。如下图：

2. 代理JS代码的生成

 　　代理JS代码用户帮助客户端调用服务器端自定义方法，注意这里的引入路径只能是： <script src="/signalr/js"></script> 或者  <script src="/signalr/hubs"></script>，至于为什么路径非要这么写？这个地方不纠结了，我们姑且就这么使用（有兴趣探讨一下内部原理吧）。

　　引入该代码后，进入页面F12，会发现多了JS代码，没错，这就是自动生成的代理代码，在前端代码的编写中，需要依赖该文件。

　　可能会用人问，我把自动生成的这个JS代码拷贝出来，单独放到一个JS文件里，然后在页面引入，并去掉生成代理代码的这句话 <script src="/signalr/js"></script>，行不行呢？

　　答案是：肯定行。

　   但这种拷贝出来的方式有点Low，服务器端代码只要一改，我就需要重新拷贝一遍，那么有没有别的方便的方法呢？

　   显然有，大约有两种方法。

　　①：借助Microsoft.AspNet.SignalR.Utils程序集和指令。

　　②：借助Microsoft.AspNet.SignalR.Utils程序集和VS开发工具的

　　在这一节里，暂时不介绍这两种方式，后面章节详细介绍。

3. 如何与服务器Hub模型路径相配？

　　在上面的代码中介绍过，服务器Hub模型默认的URL为"/signalr"，那么客户端的代码怎么写呢？

1   //1. 与服务器路径进行匹配
2   var conn = $.connection.hub;
3   //2. 与生成的代理类建立连接
4   var proxy = $.connection.mySpecHub1;

　　乍一看，丝毫没有看到与"/signalR"相关的代码，不要急，这时去看一下自动生成代理类中的代码，如下图：

　　我们再看一下SignalR的JS代码中关于hubConnection方法的声明，如下图：

 　　配合第二个截图简单分析一下这块源代码，首先if判断" 一真或为真"，只要！url 和 useDefaultPath有一个是真的就进入方法体内部，然后在拼接 url+“/signalr”，如果不进入if方法体，那么你输入的url是什么，这里用的就是什么。

　　前面的代码为： signalR.hub = $.hubConnection("/signalr", { useDefaultPath: false }); ||两边都为false，进入不了if方法体内部，所以URL就是默认输入的“/signalr”。

4. 坑爹的调用规范

　　在代理模式中,客户端调用服务器端方法或者与代理建立连接的时候，比如：

　　①：服务器端的Hub名称为MySpecHub1，客户端调用的时候必须为首字母小写：$.connection.mySpecHub1;

　　②：服务器端自定义的方法为SendSingleMsg，客户端调用的时候必须为首字母小写：proxy.server.sendSingleMsg;

　　注：非代理模式中则不存在这个问题！！！！

　　解决： 引入两个特性[HubName("")] 和 [HubMethodName("")]  ，放在服务器端代码上面，就解决了。 （详见服务器端代码）

5. 客户端方法的声明和调用服务器端方法

　　①. 声明客户端方法： proxy.client.xxx = function (x1, x2) {}       xxx代表客户端方法名称

　　②. 调用服务器端方法： proxy.server.xxx(x1,x2);                          xxx代表服务器端方法名称

 注：这里的proxy，是 $.connection.mySpecHub1; 与自动生成的代理类建立连接。

6. 服务器端指定模型URL后，前端如何匹配？

　　如服务器端代码为：app.MapSignalR("/myhub1", new HubConfiguration());

　　①. 当使用自动生成代理类js文件时候，与<script src="/signalr/hubs"></script>冲突，暂时未解决 （欢迎下方留言讨论）

　　②. 手动引入代理类时候可以使用，只需添加 conn.url = "/myhub1"; 即可以将路径改为 "/myhub1"。 

代码如下：

通过Fiddler检测一下。

7. 其它方法

　　同PersistentConnection模式中相同，比如开启和检测断线。

六. 客户端(js)代码介绍-非代理模式 

 　　有了前面代理模式的铺垫，非代理模式就很容易了，下面介绍一下在使用上的一些区别：

1. 基本使用

　　不需要需要引入 <script src="/signalr/js"></script> 或者 <script src="/signalr/hubs"></script>，也不需要引入手动添加的代理类 <script src="~/Scripts/AutoProxy.js"></script>，但在代码上要这么写，比如创建代理类： $.hubConnection().reateHubProxy("MySpecHub1");

详细代码如下：

1  //1. 与服务器路径进行匹配
2 var conn = $.hubConnection();
3 //2. 手动创建代理类
4  var proxy = conn.createHubProxy("MySpecHub1");

2. 在非代理模式中，服务器端的Hub名称和服务器端自定义的方法不必首字母小写(PS:小写也能用)

　　①：服务器端的Hub名称为MySpecHub1，客户端调用的时候 conn.createHubProxy("MySpecHub1");

　　②：服务器端自定义的方法为SendSingleMsg，客户端调用的时候必须为首字母小写： proxy.invoke("SendSingleMsg", $("#j_receiveId").val(), $("#j_content").val());

　　注：服务器端的两个特性[HubName("")] 和 [HubMethodName("")]仍然好用！！！

3. 声明客户端方法和调用服务器端方法

　　①. 声明客户端方法： proxy.on("方法名",function(x1,x2,x3){});

　　②. 调用服务器端方法： proxy.invoke("方法名", "参数1","参数2","参数3");

4 默认路径匹配

　　在不使用代理的情况下,$.hubConnection()与服务器路径进行匹配的时候，通过Fiddler可以发现，默认是"/signalr"路径

5. 服务器端指定路径模型路径：

　　如服务器端代码为：app.MapSignalR("/myhub1", new HubConfiguration());

　　客户端对应的代码为：$.hubConnection("/myhub1", { useDefaultPath: false });

　　注：通过Fidder或者调试源代码，可以看到路径已经改为"/myhub1";

　　特别补充：如果客户端代码var conn = $.hubConnection("/myhub1")这么写，useDefaultPath这个属性默认为true，则最后的路径为："/myhub1/signalr"，原因借助前面的分析很容易理解了。

七. 第三方调用 

　　上面介绍的所有代码都是直接基于 Hub模型这个类来通信的，但在很多情况下，我们可能建立连接后，在别的页面进行通信，而这个页面没法直接和Hub类相连接，我需要借助控制器里的Action来通信，那么问题来了，如何通过调用控制器里的方法来实现发送信息的功能呢？

　　其实非常简单，我们只需要通过 GlobalHost.ConnectionManager.GetHubContext<MySpecHub1>(); 获取到这个Hub即可。

　　代码如下：

 1        /// <summary>
 2         /// 向所有人发送消息
 3         /// </summary>
 4         /// <param name="msg">发送的信息</param>
 5         public string MySendAll(string msg)
 6         {
 7             string myConnectionId = Session["connectionId"].ToString();
 8             //Hub模式
 9             var hub = GlobalHost.ConnectionManager.GetHubContext<MySpecHub1>();
10             hub.Clients.AllExcept(myConnectionId).receiveMsg($"用户【{myConnectionId}】发来消息：{msg}");
11             return "ok";
12         } 

八. 聊天室样例

 　　在本系列的第一节，基于WebSocket写了一个聊天室样例，还吐槽了一番，写法很麻烦，这里基于Signalr的Hub模型，再写一次聊天室，并补充几个新功能。

　　效果图如下：

　　包括的功能有：

　　①：连接成功后通知所有人包括自己登录成功。

　　②：离线后，通知除了自己以外的所有人已经离开。

　　③：通过输入接收人的SessionId，实现一对一发送信息。

　　④： 通过点击群发按钮，向除了自己以外的所有人发送信息。

　　⑤：可以进入room1或room2房间，然后实现向指定房间内的所有人发送信息。

　　⑥：跳转到新页面，然后在新页面实现向指定人发送消息。

下面分享代码，包括（Hub模型代码，控制器代码，前端代码（代理和非代理两套））

Hub模型代码

  View Code

控制器代码

  View Code

代理

  View Code

 非代理

  View Code

　　PS 与WebSocket原生代码编写的相比较，最大的改进之处有：

　　①：单发和群发可以对应不同的服务器端方法，不再需要自行约定规则来识别了，同样客户端接收也很灵活了，可以指定方法接收。

　　②：不需要自己创建登录标记，默认会生成一个SessionID。

　　③：SessionId会自动记录，不需要单独声明一个集合来存储。

　　④：写起来太爽了（^_^）。

郑州哪家医院做人流好:http://www.lnljyy.com/郑州哪个无痛人流医院专业:http://www.lnljyy.com/郑州人流手术费多少钱:http://www.lnljyy.com/郑州人流医院:http://www.lnljyy.com/郑州做人流价格是多少钱:http://www.lnljyy.com/郑州哪个医院人流专业:郑州同济医院:http://www.lnljyy.com/郑州妇科医院：http://yyk.39.net/zz3/zonghe/1d426.html