Nuget添加 SignalR包
1、构建一个MyHubServer服务端类
定义类的特性标签为
[HubName("chatHub")] public class MyHubServer : Hub { }
必须继承Hub基类,基类中提供了如下操作
public abstract class HubBase : IHub, IUntrackedDisposable, IDisposable { protected HubBase(); public HubCallerContext Context { get; set; } public IGroupManager Groups { get; set; } public void Dispose(); public virtual Task OnConnected(); public virtual Task OnDisconnected(bool stopCalled); public virtual Task OnReconnected(); protected virtual void Dispose(bool disposing); }
Context :上下问对象
Groups : 分组
以及下面的三个虚方法,必要是可以重写
OnConnected 建立连接、OnDisconnected 断开连接、OnReconnected 从新连接构建客Js户端 ,安装了Nuget包后会看到如下js文件,将应用页面添加js引用,基于Jquery的
引用客户端JS包
<script src="~/Scripts/jquery.signalR-2.2.3.min.js"></script> <script src="~/signalr/hubs"></script>
Notes:第二个Js是Signalr生成的js文件路径,项目目录中不会存在
<script> $(function () { //服务器端对应的集线器 var hub = $.connection.chatHub; ////客户端接收消息 上线通知 hub.client.addTips = function (msg) { $('#discussion').html('<span><strong></strong> ' + htmlEncode(msg) + '</span>'); }; //启动连接成功 $.connection.hub.start().done(function () { $('#sendmessage').click(function () { hub.server.sendmsg($('#contact').val(), $('#sendid').val(), $('#sendname').val()); $('#contact').val('').focus(); }); }); }); function htmlEncode(value) { var encodedValue = $('<div />').text(value).html(); return encodedValue; } </script>
需要注意的是这个
这里连接的chartHub就是服务端的 HubName属性标签配置的名称
以如下客户排单为例子:
当没有客户对接人员上线发送会提示
我们打开2个浏览器分别登上不同的账号
当客户对接人员使用功能时候提示
使用另一个账号发送消息,客户对接人员会实时接受消息,同时将这些消息保留数据库记录
接下来看下服务端的具体代码
public void sendmsg(string contact, string sendid, string sendname) {
Clients.Client(Context.ConnectionId).addTips("客户接待人员还没有上线"); }
服务端发送方法,这里与客户端Js调用服务端方法是对应的
服务端 中的 Clients对象包含了3个类别
All:向所有的客户端发送消息
Group:向分组包含的客户端发送消息
Client:向某一个指定客户端发送消息
基本就是对这些进行操作,包括群聊的处理都是通过以上三个方式来实现在线聊天功能