asp.net SignalR 一对一聊天
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script src="~/Scripts/jquery.signalR-2.2.1.min.js"></script>
<script src="@Url.Content("~/signalr/hubs")"></script>
<script type="text/javascript">
var clients = [];
var chat;
$(function () { chat = $.connection.ViewDataHub;
console.info(chat);
//显示提示方法
chat.client.showMessage = function (message) {
alert(message);
}
//注册显示信息的方法
chat.client.addMessage = function (message, connectionId) { if ($.inArray(connectionId, clients) == -1) {
showWin(connectionId);
}
$("#" + connectionId).find("ul").each(function () {
$(this).append('<li>' + message + '</li>');
})
}
//注册显示所有用户的方法
chat.client.getUsers = function (data) { if (data) {
var json = $.parseJSON(data); console.info(json);
$("#users").html(" ");
for (var i = 0; i < json.length; i++) {
var html = '<li>用户名:' + json[i].Name + '<button connectionId="' + json[i].ConnectionID + '" onclick="userChat(this)">聊天</button>';
$("#users").append(html);
}
}
}
//注册显示推出聊天提示的方法
chat.client.exitUser = function (data) {
alert(data);
}
//注册显示个人信息的方法
chat.client.showId = function (data) {
$("#conId").html(data);
clients.push(data);
}
//获取用户名称
$('#userName').html(prompt('请输入您的名称', '')); //连接成功后获取自己的信息
$.connection.hub.start().done(function () {
chat.server.getName($('#userName').html());
});
});
//开始聊天
function userChat(obj) {
var connectionId = $(obj).attr('connectionId');
showWin(connectionId);
}
function showWin(connectionId) {
//var connectionId = $(obj).attr('connectionId');
clients.push(connectionId);
var html = '<div style="float:left;margin-left:30px;border:double" id="' + connectionId + '" connectionId="' + connectionId + '">' + connectionId + '"的房间聊天记录如下:<button onclick="exitChat(this)">退出</button><ul></ul><input type="text" /> <button onclick="sendMessage(this)">发送</button></div>';
$("#userBox").append(html);
}
function exitChat(btnObj) { // var connectionId = $(btnObj).parent().attr("connectionId");
$(btnObj).parent().remove();
//chat.server.exitChat(connectionId);
}
//发送消息
function sendMessage(data) {
var message = $(data).prev().val();
var userObj = $(data).parent();
var username = $("#userName").html();
message = username + ":" + message;
console.info($(userObj).attr("connectionId"));
var targetConnectionId = $(userObj).attr("connectionId");
chat.server.sendMessage(targetConnectionId, message);
$(data).prev().val("");
}
</script>
<div>
<div>名称:<p id="userName"></p></div>
<div>ConnectionID:<p id="conId"></p></div> <div style="width:25%;border:1px solid #ff0000">
<div>在线用户列表</div>
<ul id="users"></ul>
</div>
<div id="userBox">
</div>
</div>
后台代码
 [HubName("ViewDataHub")]
    public class ViewDataHub:Hub{
        public static List<User> users = new List<User>();  
        //发送消息
        public void  SendMessage(string  connectionId ,string   message)
        {
            Clients.All.hello();
            var user = users.Where(s => s.ConnectionID == connectionId).FirstOrDefault();
            if (user != null)
            {
                Clients.Client(connectionId).addMessage(message + "" + DateTime.Now, Context.ConnectionId);
                //给自己发送,把用户的ID传给自己
                Clients.Client(Context.ConnectionId).addMessage(message + "" + DateTime.Now, connectionId);
            }
            else
            {
                Clients.Client(Context.ConnectionId).showMessage("该用户已离线");
            }
        }
        [HubMethodName("exitChat")]
        public void GetName(string name)
        {
            //查询用户
            var user = users.SingleOrDefault(u => u.ConnectionID == Context.ConnectionId);
            if (user != null)
            {
                user.Name = name;
                Clients.Client(Context.ConnectionId).showId(Context.ConnectionId);
            }
            GetUsers();
        }  
        /// <summary>
        /// 重写连接事件
        /// </summary>
        /// <returns></returns>
        public override Task OnConnected()
        {
            //查询用户
            var user = users.Where(w => w.ConnectionID == Context.ConnectionId).SingleOrDefault();
            //判断用户是否存在,否则添加集合
            if (user == null)
            {
                user = new User("", Context.ConnectionId);
                users.Add(user);
            }
            return base.OnConnected();
        }
        public override Task OnDisconnected(bool stopCalled)
        {
            var user = users.Where(p => p.ConnectionID == Context.ConnectionId).FirstOrDefault();
            //判断用户是否存在,存在则删除
            if (user != null)
            {
                //删除用户
                users.Remove(user);
            }
            GetUsers();//获取所有用户的列表
            return base.OnDisconnected(stopCalled);
        }
        //获取所有用户在线列表
        private void GetUsers()
        {
            var list = users.Select(s => new { s.Name, s.ConnectionID }).ToList();
            string jsonList = JsonConvert.SerializeObject(list);
            Clients.All.getUsers(jsonList);
        }
    }
    public class User
    {
        [Key]
        public string ConnectionID { get; set; }
        public string Name { get; set; }
        public User(string name, string connectionId)
        {
            this.Name = name;
            this.ConnectionID = connectionId;
        }
    }  
PS:
类似这种 chat.client.showMessage 这是后台调用前台
类似这种 chat.server.getName 则是前台调用后台
asp.net SignalR 一对一聊天的更多相关文章
- Asp.Net SignalR - 简单聊天室实现
		
简单聊天室 使用持久链接类我们就可以做一些即时通讯的应用了,我使用Group做了一个简单的聊天室,先上图技术细节下面再讲 可以加入聊天室.创建聊天室.发送消息,下面就说说我是如何通过Group做出来的 ...
 - 史上最全面的SignalR系列教程-5、SignalR 实现一对一聊天
		
1.概述 通过前面几篇文章 史上最全面的SignalR系列教程-1.认识SignalR 史上最全面的SignalR系列教程-2.SignalR 实现推送功能-永久连接类实现方式 史上最全面的Signa ...
 - ASP.NET Signalr 2.0 实现一个简单的聊天室
		
学习了一下SignalR 2.0,http://www.asp.net/signalr 文章写的很详细,如果头疼英文,还可以机翻成中文,虽然不是很准确,大概还是容易看明白. 理论要结合实践,自己动手做 ...
 - 使用ASP.NET SignalR实现一个简单的聊天室
		
前言 距离我写上一篇博客已经又过了一年半载了,时间过得很快,一眨眼,就把人变得沧桑了许多.青春是短暂的,知识是无限的.要用短暂的青春,去学无穷无尽的知识,及时当勉励,岁月不待人.今天写个随笔小结记录一 ...
 - ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室 实战系列
		
ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(零) 前言 http://www.cnblogs.com/panzi/p/5742089.html ASP.NET S ...
 - ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(十二) 代码重构使用反射工厂解耦(一)缓存切换
		
前言 上一篇中,我们用了反射工厂来解除BLL和UI层耦合的问题.当然那是最简单的解决方法,再复杂一点的程序可能思路相同,但是在编程细节中需要考虑的就更多了,比如今天我在重构过程中遇到的问题.也是接下来 ...
 - ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(零) 前言
		
前端时间听一个技术朋友说 LayIM 2.0 发布了,听到这个消息抓紧去官网看了一下.(http://layim.layui.com/)哎呀呀,还要购买授权[大家支持一下哦],果断买了企业版,喜欢钻研 ...
 - ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(一) 之 基层数据搭建,让数据活起来(数据获取)
		
大家好,本篇是接上一篇 ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(零) 前言 ASP.NET SignalR WebIM系列第二篇.本篇会带领大家将 LayIM ...
 - ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(二) 之 ChatServer搭建,连接服务器,以及注意事项。
		
上篇:ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(一) 之 基层数据搭建,让数据活起来(数据获取) 上一篇我们已经完成了初步界面的搭建工作,本篇将介绍IM的核心内容 ...
 
随机推荐
- angular : direative : autoResize textarea auto resize
			
今天为大家推出自己的auto resize 指令功能. 目的:解决textarea在给height的问题. 参考源码:http://monospaced.github.io/angular-elast ...
 - git如何解决冲突(代码托管在coding)
			
分支A提交合并请求到分支B,有冲突 git fetch code 拉取远程仓库的其他分支代码(我拉代码是remote add code所以这里是code,可以用git remote查看) git ch ...
 - css小技巧 :not 省时又省力
			
比如,要实现下面的效果(例如:一个列表的最后一项没有边框): See the Pen gmrGOV by 杨友存 (@Gavin-YYC) on CodePen. 一般的文档结构如下: <!-- ...
 - MySQL 5.7 安装完成后,立即要调整的性能选项
			
原文:MySQL 5.7 Performance Tuning Immediately After Installation 本文是对上一篇<安装 MySQL 后,需要调整的 10 个性能配置项 ...
 - 3步轻松搭建Unity3d安卓开发环境
			
之前写过一个Untiy3d安卓开发环境的配置教程,那是我第一次学习配置安卓开发环境,互联网上的信息良莠不齐,自己当时也不懂,配置步骤麻烦的一塌糊涂,现在见的多了,也会的多了,配置安卓开发环境变得非常容 ...
 - [HDU1210]  Eddy's 洗牌问题
			
Problem Description Eddy是个ACMer,他不仅喜欢做ACM题,而且对于纸牌也有一定的研究,他在无聊时研究发现,如果他有2N张牌,编号为1,2,3..n,n+1,..2n.这也是 ...
 - Java面试02|Java集合
			
关于Java中并发集合有: (1)CouncurrentHashMap (2)CopyOnWriteArrayList (3)LinkedBlockingQueue (4)ArrayBlockingQ ...
 - ACM 组合数
			
组合数 时间限制:3000 ms | 内存限制:65535 KB 难度:3 描述 找出从自然数1.2.... .n(0<n<10)中任取r(0<r<=n)个数的所有组合 ...
 - 在.NET项目中使用PostSharp,使用MemoryCache实现缓存的处理
			
在之前一篇随笔<在.NET项目中使用PostSharp,实现AOP面向切面编程处理>介绍了PostSharp框架的使用,试用PostSharp能给我带来很多便利和优势,减少代码冗余,提高可 ...
 - wemall app商城源码android开发MD5加密工具类
			
wemall-mobile是基于WeMall的android app商城,只需要在原商城目录下上传接口文件即可完成服务端的配置,客户端可定制修改.本文分享android开发MD5加密工具类主要代码,供 ...