前一段时间写了几篇关于signalr的文章
3.Xamarin android中使用signalr实现即时通讯
在平时的工作中用到了signalr进行消息的推送,所以总结了这几篇文章,今天我就来写一写这个signalr如何使用Group 分组方法群发消息。更全面地了解和学习使用signalr。
在开始学习Signalr Group群发消息之前我们来看一下所实现的效果图:
强大的signalr已经封装好了Group方法,已经在Hub里面集成了Groups分组管理,关键的使用方法如下:
//加入Group组方法 //Context.ConnectionId 连接ID,每个页面连接集线器即会产生唯一ID //roomName分组的名称 Groups.Add(Context.ConnectionId, roomName); //移除Group组 Groups.Remove(Context.ConnectionId, roomName); //作用:调用分组内连接对象,注册客户端Js方法 //Room:分组名称 //new string[0]:过滤(不发送)的连接ID数组
// msg:消息内容
Clients.Group(Room, new string[0]).sendMsg(Room,msg)
在客户端中调用:
chat.client.sendMsg=function(Room,msg){}当然在实际中如何实现,看下接下来的代码
namespace signalrGroupDemo.Models { public class DbContext { public DbContext() { Users = new List<User>(); Connections = new List<Connection>(); Rooms = new List<Room>(); } //用户集合 public List<User> Users { get; set; } //连接集合 public List<Connection> Connections { get; set; } //房间集合 public List<Room> Rooms { get; set; } } //用户类 public class User { [Key] public string UserName { get; set; } //用户连接 public List<Connection> Connections { get; set; } //用户房间集合 public virtual List<Room> Rooms { get; set; } public User() { Connections = new List<Connection>(); Rooms = new List<Room>(); } } public class Connection { //连接ID public string ConnectionID { get; set; } //用户代理 public string userAgent { get; set; } //是否连接 public bool Connected { get; set; } } //房间类 public class Room { [Key] public string RommName { get; set; } //用户集合 public virtual List<User> Users { get; set; } public Room() { Users = new List<User>(); } } }
第二步:引入Signalr类库,添加Hub集线器类
using System; using System.Collections.Generic; using System.Linq; using System.Threading.Tasks; using System.Web; using Microsoft.AspNet.SignalR; using signalrGroupDemo.Models; using Newtonsoft.Json; using Microsoft.AspNet.SignalR.Hubs; namespace signalrGroupDemo { [HubName("groupHub")] public class GroupHUb : Hub { public void Hello() { Clients.All.hello(); } public static DbContext db = new DbContext(); /// <summary> /// 重写Hub连接事件 /// </summary> /// <returns></returns> public override Task OnConnected() { //查询用户 var user = db.Users.Where(w => w.UserName == Context.ConnectionId).FirstOrDefault(); //判断用户是否存在 if (user == null) { user = new User() { UserName = Context.ConnectionId }; db.Users.Add(user); } //发送房间列表 var rooms = db.Rooms.Select(p => p.RoomName).ToList(); //注册getRooms 获取房间的方法 Clients.Client(Context.ConnectionId).getRoomList(JsonConvert.SerializeObject(rooms)); return base.OnConnected(); } //更新所有用户的房间列表 private void GetRooms() { var rooms =JsonConvert.SerializeObject(db.Rooms.Select(p => p.RoomName).ToList()); Clients.All.getRoomList(rooms); } //重写Hub链接断开事件 public override Task OnDisconnected(bool s) { var user = db.Users.Where(u=>u.UserName==Context.ConnectionId).FirstOrDefault(); //判断用户是否存在,存在则删除 if (user != null) { //删除用户 db.Users.Remove(user); } return base.OnDisconnected(s); } //加入聊天室 public void AddRoom(string roomName) { //查询聊天室 var room = db.Rooms.Find(a=>a.RoomName==roomName); //存在则加入 if (room != null) { //查找房间中是否存在此用户 var isUser = room.Users.Where(w => w.UserName == Context.ConnectionId).FirstOrDefault(); //不存在则加入 if (isUser == null) { var user = db.Users.Find(a => a.UserName == Context.ConnectionId); user.Rooms.Add(room); room.Users.Add(user); Groups.Add(Context.ConnectionId, roomName); //注册加入聊天室的addRoom方法 Clients.Client(Context.ConnectionId).addRoom(roomName); } else { Clients.Client(Context.ConnectionId).showMessage("请勿重复加入房间"); } } } //创建聊天室 public void CreateRoom(string roomName) { var room = db.Rooms.Find(a=>a.RoomName==roomName); if (room == null) { Room r = new Room() { RoomName = roomName }; //将房间加入列表 db.Rooms.Add(r); AddRoom(roomName); Clients.Client(Context.ConnectionId).showMessage("房间创建完成"); GetRooms(); } else { Clients.Client(Context.ConnectionId).showMessage("房间名重复"); } } //退出聊天室 public void ExitRoom(string roomName) { //查找房间是否存在 var room = db.Rooms.Find(a=>a.RoomName==roomName); //存在则删除 if (room != null) { //查找要删除的用户 var user = room.Users.Where(p => p.UserName == Context.ConnectionId).FirstOrDefault(); //移除此用户 room.Users.Remove(user); //如果房间人数为0,怎删除房间 if (room.Users.Count == 0) { db.Rooms.Remove(room); } //Groups Remove移除分组方法 Groups.Remove(Context.ConnectionId,roomName); //提示客户端 Clients.Client(Context.ConnectionId).removeRoom("退出成功"); } } //给分组内所有用户发送消息 public void SendMsg(string Room,string Message) { Clients.Group(Room, new string[0]).sendMessage(Room,Message+" "+DateTime.Now.ToString()); } } }
第三步:前端调用注册的Server方法和注册Client方法
@{ Layout = null; } <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>signalr group 分组方法的使用</title> <script src="~/Scripts/jquery-1.10.2.min.js"></script> <script src="~/Scripts/jquery.signalR-2.2.1.min.js"></script> @*这里是虚拟目录,也就是你再OWIN Startup中注册的地址*@ <script src="~/signalr/hubs"></script> </head> <body> <div><div>名称:<p id="userName"></p></div> 房间名:<input type="text" value="ceshi" id="roomName"/> <button id="createRoom">创建聊天室</button></div> <div style="float:left;border:double"> <div>房间列表</div><ul id="roomList"></ul> </div> <div id="rooms"></div> <script> var chat; var roomCount =0; $(function(){ chat = $.connection.groupHub; //调用hub中注册的showMessage方法 chat.client.showMessage= function (message) { alert(message); } //调用hub中注册的sendMessage 方法 chat.client.sendMessage= function (roomname, message) { debugger $("#" + roomname).find("ul").each(function () { $(this).append('<li>'+message+'</li>'); }) } //调用hub中removeRoom 退出房间方法 chat.client.removeRoom = function (data) { alert(data); } //注册查询房间列表的方法 chat.client.getRoomList = function (data) { if (data) { debugger var jsonData = $.parseJSON(data); $("#roomList").html(" "); for (var i = 0; i < jsonData.length; i++) { var html = '<li>房间名:' + jsonData[i] + '<button roomName="' + jsonData[i] + '" onclick="addRoom(this)">加入</button> </li>' $("#roomList").append(html); } } } //调用hub中addRoom 加入房间的方法 chat.client.addRoom = function (roomName) { var html = '<div style="float:left; margin-left:30px; border:double" id="' + roomName + '" roomname="' + roomName + '" ><button onclick="removeRoom(this)">退出房间</button> \ ' + roomName + '房间聊天记录如下:<ul></ul> <input type="text"/> <button onclick="send(this)">发送</button><div>' $("#rooms").append(html); } //获取用户名称 $("#userName").html(prompt('请输入您的名称:', '')); $.connection.hub.start().done(function () { $("#createRoom").click(function () { if (roomCount < 2) { chat.server.createRoom($("#roomName").val()); } else { alert("聊天窗口只允许有2个"); } }) }) }) //发送消息的方法 function send(btn) { var message = $(btn).prev().val(); var room = $(btn).parent(); var userName = $("#userName").html(); message = userName + ":" + message; var roomName = $(room).attr("roomName"); chat.server.sendMsg(roomName,message); } //退出房间 function removeRoom(btn) { var room = $(btn).parent(); var roomName = $(room).attr("roomName"); chat.server.exitRoom(roomName); } //加入房间 function addRoom(roomName) { var data = $(roomName).attr("roomName"); chat.server.addRoom(data); } </script> </body> </html>