ASP.NET SignalR 与LayIM配合,轻松实现网站客服聊天室(三) 激动人心的时刻到啦,实现1v1聊天   看起来挺简单,细节还是很多的,好,接上一篇,我们已经成功连接singalR服务器了,那么剩下的内容呢,就是一步一步实现聊天功能. 我们先看看缺什么东西 点击好友弹框之后,要给服务器发消息,进入组Group.Group原理在上一篇已经介绍了,这里不再赘述. 点击发送消息到后台,后台在传送回来 将htmlappend到相应元素上,demo已经实现了,我们把代码拿过来用就可以了 模拟…

ASP.NET SignalR 与LayIM配合,轻松实现网站客服聊天室(一) 整理基础数据   最近碰巧发现一款比较好的Web即时通讯前端组件,layim,百度关键字即可,我下面要做的就是基于这个前端组件配合后台完成即时聊天等功能.当然用到的技术就是ASP.NET SingalR框架.本人不会css和前端的东西,只会少量的js,所以前端的代码不做介绍,喜欢前端的同学可以自行研究,闲言少叙,书归正传. 我们先看一下layim的效果,看起来还是挺友好的,界面也不错.不过,我做了些调整,具体其他细节…

上一篇已经简单介绍了layim WebUI即时通讯组件和获取数据的后台方法.现在要讨论的是SingalR的内容,之前都是直接贴代码.那么在贴代码之前先分析一下业务模型,顺便简单讲一下SingalR里的部分方法. 进入正题,我们要做,即时通讯,就要考虑收发消息.我们先看推送消息的方法,找到 interface IHubConnectionContext<T> 接口定义,Hub文件里的Clients就是继承 IHubConnectionContext 接口,方法定义如下: public inter…

休息了两天,还是决定把这个尾巴给收了.本篇是最后一篇,也算是草草收尾吧.今天要加上表情功能和群聊.基本上就差不多了,其他功能,读者可以自行扩展或者优化.至于我写的代码方面,自己也没去重构.好的,我们开始在原有的基础上添加功能. 1.表情功能 表情我用了一个jquery插件,qqFace.由于GitHub中源码已经包含,我这里不在粘贴地址.先看一下添加表情后的效果吧. 表情这里不要忘了加页面样式,表情选中样式.还有一个就是小bug就是,表情框被聊天框限制住了(修改方法:将layim.css里面的代…

看起来挺简单,细节还是很多的,好,接上一篇,我们已经成功连接singalR服务器了,那么剩下的内容呢,就是一步一步实现聊天功能. 我们先看看缺什么东西 点击好友弹框之后,要给服务器发消息,进入组Group.Group原理在上一篇已经介绍了,这里不再赘述. 点击发送消息到后台,后台在传送回来 将htmlappend到相应元素上,demo已经实现了,我们把代码拿过来用就可以了 模拟用户登录,点击发送聊天 在做上述工作之前,还是要做许多准备工作的.我们分析一下界面元素 好的,可以看到,一个消息里面有消…

最近碰巧发现一款比较好的Web即时通讯前端组件,layim,百度关键字即可,我下面要做的就是基于这个前端组件配合后台完成即时聊天等功能.当然用到的技术就是ASP.NET SingalR框架.本人不会css和前端的东西,只会少量的js,所以前端的代码不做介绍,喜欢前端的同学可以自行研究,闲言少叙,书归正传. 我们先看一下layim的效果,看起来还是挺友好的,界面也不错.不过,我做了些调整,具体其他细节可以自己完善. 界面看完了,那么看一下数据.demo里做的也不错,ajax也封装好了,那么我们就直…

有开发者提问怎么做历史记录功能和即使不打开聊天窗口有消息提醒功能.简单抽时间写了点代码.不过只是基本思路,具体细节没有实现. 正如前几篇博客中提到的,读取历史记录什么时候读取呢?按照常理,应该是打开聊天窗口的时候加载历史记录,当然也可以选择异步加载好,然后打开哪个窗口就加载哪部分的记录.当然我们并不知道用户会打开哪个窗口,所以,我还是建议,当用户选择人聊天的时候就读取历史记录.那么之前的功能已经做好了.我们需要充分利用  ctoc  方法.ctoc是什么?不明白的就看看本系列前几篇文章吧. 现在…

本篇也算是个番外篇了,跟之前几篇关系不算大.之前一篇  RabbitMQ .NET Client 实战实验 里有介绍过今天要用的内容. 做了一下小更改,就是在用户聊天的时候,消息记录不直接进入数据库,而是进入队列.然后等待队列逐条处理进入数据库.队列的好处就是确保每条都能得到正确处理,如果数据插入失败,也不会出现数据丢失的情况.(很遗憾我自己还没实现处理失败的情况) 直接进入正题,先新建一个项目,引入相应的dll ChatQueue代码: public sealed class ChatQueu…

上一篇介绍了加好友的流程,这里不再赘述,不过之前的聊天只能发送普通文字,那么本篇就教你如何实现发送附件和图片消息.我们先对功能进行分析: 发送图片,附件,需要实现上传图片和附件的功能. textarea不能显示图片,所以需要做图片转换 接收到消息之后需要在将图片转换回原来图片 附件特殊样式处理 那么我们先实现文件的上传功能,由于用的是MVC,就简单做一个无刷新无进度条上传,所以图片和文件就需要小一点,否则用户体验就差了.我用的是jquery.form.js实现form提交文件,后台用HttpPo…

不知道距离上一篇多久没有写了,可能是因为忙(lan)的关系吧.废话不多说,今天要介绍的不算什么新知识,主要是逻辑上的一些东西.什么逻辑呢,加好友,发送好友申请,对方审批通过,拒绝.(很遗憾,对方审批通过和拒绝后的通知没做,看完本博客的小伙伴有兴趣的可以尝试一下). 抽空写了新版本的聊天室,内容和上次差不多,这次加上了数据库来处理一些逻辑,包括登录注册功能,OK,现在开始. 好友申请 新版本中做了一个默认分组:注册用户 的功能,即所有注册进来的人都会存在于该组中,该组和普通群组一样,可以群聊,也可…

ASP.NET SignalR 是为 ASP.NET 开发人员提供的一个库,可以简化开发人员将实时 Web 功能添加到应用程序的过程.实时 Web 功能是指这样一种功能:当所连接的客户端变得可用时服务器代码可以立即向其推送内容,而不是让服务器等待客户端请求新的数据.(来自官方介绍.) SignalR官网 -1.写这篇的原因 在上篇文章B/S(Web)实时通讯解决方案中,并没有详情介绍SignalR,所以另起一篇专门介绍SignalR,本文的侧重点是Hub功能. 0.先看最终实现效果 github…

前言 本篇要讲的算是一个layim代码功能扩充.在原来的laim中已经有自带的换肤功能,而且在skin配置中,你可以添加自己想要的皮肤图片路径.这些内容在接下来都不会涉及,本篇要讲的是自定义皮肤功能,没错就是用户自己上传自己想要的皮肤.而且随时都可以换掉.老规矩,效果展示. 效果展示 layim自带的皮肤 在layim.config中增加自己的皮肤,config代码如下:(新加了一辆macan图) ,skin: ['/content/macan.jpg'] //新增皮肤 上面就是通过layim自…

一直以来,大家都苦恼怎么实现微信公众帐号可以接入客服,也因此很多第三方接口平台也开发客服系统CRM系统,不过不是操作复杂就是成本太高.今天分享一个低成本又简便的方法,让你的公众帐号接入QQ客服.下面介绍具体的方法: 1.首先,这个方法目前微信最新的手机版本都是适用的,测试过微信5.0安卓版本还有点问题,主要是点击了之后不断地刷新一个空白的网页. 2.公众帐号有自定义菜单功能.有自定义菜单的就可以直接把QQ客服链接网址放在菜单上,我们的粉丝点击菜单就会自动跳转.如果粉丝的手机里面有安装手机QQ的,…

源码下载地址:http://www.yealuo.com/Sccnn/Detail?KeyValue=c891ffae-7441-4afb-9a75-c5fe000e3d1c 几个后台功能模块的完成也就几小章内容,但其实里面应用到的知识点还是蛮多的,只有我们一行一行的去敲击代码才能体会,所以在我们学习的过程中一定要动手去写,不明白的需要去搜索百度查询相关的知识. 就比如本项目其实是我很早就做成了的,但为了写一部该系列的文章,我又重创建项目开始,一步步往下走,在这过程中一些之前不明就里的知识点突然…

上篇:ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(一) 之 基层数据搭建,让数据活起来(数据获取) 上一篇我们已经完成了初步界面的搭建工作,本篇将介绍IM的核心内容了,就是SignalR的Hub类.整个即时通讯机制都是以它为基础的.至于原理我也不再讲解,讲了也不如专业的文章讲得好.所以我们直接看业务,上代码.有一部分原理 在文章 ASP.NET SignalR 与LayIM配合,轻松实现网站客服聊天室(二) 实现聊天室连接 (当时是LayIM1.0版本).原理…

前端时间听一个技术朋友说 LayIM 2.0 发布了,听到这个消息抓紧去官网看了一下.(http://layim.layui.com/)哎呀呀,还要购买授权[大家支持一下哦],果断买了企业版,喜欢钻研的我没有源码怎么行,说来也惭愧,发布好久了我才知道.之前写过一系列的博客,当时是ASP.NET SignalR 结合 LayIM 1.0 的一个小程序.看了一下最新版本的LayIM,太赞了.我电脑里的VS已经蠢蠢欲动了.话不多说,先预览一下效果. 主聊天界面: 好友列表界面:        以及自定…

项目简介 利用ASP.NET SignalR技术与Layim前端im框架实现的一个简单的web聊天室,包括单聊,群聊,加好友,加群,好友搜索,管理,群组管理,好友权限设置等功能.涉及技术: ElasticSearch 搜索,支持各种条件搜索,效率高,速度快,稳准狠. Redis缓存,统计在线好友,登录token等 RabbitMQ消息队列,发送消息通过队列降低数据库访问压力,或者延迟执行任务. ASP.NET MVC,UI架构. 以及普通的三层架构等.CRUD 当然其中的这些技术也是纯粹为了使用…

前言 不知不觉已经十四篇了,其实已经没有什么可写了.但是突然发现layim中带的客服功能没有用到.于是乎,抽点时间完成吧.其实之前的工作已经把客服功能完成了一大半,剩下的我们稍微调整即可.今天的演示我们放在后边,直接进入讲解. 客服思路讲解 大家去一些公司网站都会发现,网页侧面或者自动弹出一些客服聊天框,人家很热情的和你交谈.我们也可以用layim来实现.首先,页面添加一个按钮,点击按钮触发客服模式. <a onclick="javascript:global.other.kefu(148…

2018-09-19 更新 :现在已经更新ASP.NET Core Middleware版本.对.NET Core SignalR感兴趣的朋友移步:https://github.com/fanpan26/LayIM.AspNetCore 前端时间听一个技术朋友说 LayIM 2.0 发布了,听到这个消息抓紧去官网看了一下.(http://layim.layui.com/)哎呀呀,还要购买授权[大家支持一下哦],果断买了企业版,喜欢钻研的我没有源码怎么行,说来也惭愧,发布好久了我才知道.之前写过一…

项目简介 利用ASP.NET SignalR技术与Layim前端im框架实现的一个简单的web聊天室,包括单聊,群聊,加好友,加群,好友搜索,管理,群组管理,好友权限设置等功能.涉及技术: ElasticSearch 搜索,支持各种条件搜索,效率高,速度快,稳准狠. Redis缓存,统计在线好友,登录token等 RabbitMQ消息队列,发送消息通过队列降低数据库访问压力,或者延迟执行任务. ASP.NET MVC,UI架构. 以及普通的三层架构等.CRUD 当然其中的这些技术也是纯粹为了使用…

这是一个极其简陋的聊天室! 这个例子只是在官方的例子上加了 Group 的用法而已,主要是官方给的 Group 的例子就两行代码,看不出效果. 第一步:修改 chat.js "use strict"; //创建一个连接 var connection = new signalR.HubConnectionBuilder().withUrl("/chatHub").build(); //定义客户端的 ReceiveMessage 方法 connection.on(&qu…

一. 整体介绍 本节:开始介绍SignalR另外一种通讯模型Hub(中心模型,或者叫集线器模型),它是一种RPC模式,允许客户端和服务器端各自自定义方法并且相互调用,对开发者来说相当友好. 该节包括的内容有: ①:从零搭建 ②:Hub模型和URL匹配,默认模式和指定路径 ③:服务器端代码介绍 ④:客户端的两种模式,代理和非代理,各自的写法 ⑤:服务器端和客户端包含的方法和各自如何自定义方法并且相互调用 ⑥:第三方调用的问题,比如:如何在控制器中调用客户端的方法. ⑦:再探聊天室样例   二. 从…

近段时间利用业余时间开发了一套在线客服系统,期间遇到过大大小小不少问题,好在都一一解决,最终效果也还可以,打算写一个系列的文章把开发过程详细的记录下来. 希望能够和更多的开发人员互相交流学习,也希望有有兴趣的小伙伴一起加入开发当中来,毕竟一个人的力量是有限的 :) 有兴趣的小伙伴请加Q:279060597 系列文章将分为几个部分 零.概述(本篇) 一.需求分析及技术方案初步选型 二.技术方案选型,验证 三.底层框架设计,开发 四.服务器设计开发 五.客户端设计开发 六.Web端设计开发 在这个系…

我好像特别喜欢做聊天室类的东东,刚折腾完微软的SignalR又折腾App.本来想研究研究XMPP的,由于服务器的搭建问题,先采用一个第三方的吧,看看效果如何.听到弟弟说他们公司用到了融云,我也下载个SDK玩玩.融云的Demo和文档已经非常详细了,我就不搬过来了. 融云官方文档地址:http://www.rongcloud.cn/docs/ 第一步:首先把SDK导入到自己的项目中.还有其他依赖的framework都要加上. 第二步:我这里没有自己写UI,所以,直接用 <RongIMKit/Rong…

前言 上一篇中讲解了加好友的流程,本篇将介绍好友管理,群组管理的右键菜单功能.当然由于菜单项目太多,都实现也得花费时间.只讲解一下我是如何从不知道怎么实现右键菜单到会自定义菜单的一个过程.另外呢,针对菜单:发送即时消息这个原本在Laim中已经有的功能做出实现,其他的方法,只要按照业务逻辑一一实现即可. 演示 用户信息右键菜单: 好友分组信息右键菜单: 群组信息右键菜单: 思路讲解 首先呢,Layim中针对历史消息这个栏有两个菜单项,清空和删除某一条,这是源代码中已经有的,当我看到这段代码的时候,…

ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(零) 前言  http://www.cnblogs.com/panzi/p/5742089.html ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(一) 之 基层数据搭建,让数据活起来(数据获取)  http://www.cnblogs.com/panzi/p/5745042.html ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(二) 之 Chat…

前言 上一篇中,我们用了反射工厂来解除BLL和UI层耦合的问题.当然那是最简单的解决方法,再复杂一点的程序可能思路相同,但是在编程细节中需要考虑的就更多了,比如今天我在重构过程中遇到的问题.也是接下来我要解决的问题,缓存模块.为什么要解决这个问题呢,由于我们有些下载代码运行的小伙伴,发现怎么运行报错,原来是没有装redis.可是我只想看layim和signalr代码而已啊,不想装什么redis.那么基于昨天的经验,我把缓存模块同样提取出接口,然后加了一个原始的cache层.这个cache是基于S…

大家好,本篇是接上一篇 ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(零) 前言  ASP.NET SignalR WebIM系列第二篇.本篇会带领大家将 LayIM界面中的数据动态化.当然还不涉及即时消息通讯,如果你已经搞定了数据界面,那么本文您可以简单的看一下,或者略过. 进入正题,layim帮我们定义好了数据规则,我们只要写一个接口实现那个json规范就可以了,剩下的事情就交给layim去做,看一下json格式.(对应文件夹:demo/json/getLi…

上篇讲解了如何搭建聊天服务器,以及客户端js怎么和layui的语法配合.服务器已经连接上了,那么聊天还会远吗? 进入正题,正如上一篇提到的我们用 Client.Group(groupId)的方法向客户端推送消息.本篇就先不把业务搞复杂了,就默认现在两个用户都各自打开了对方的聊天窗口,那么聊天过程是这样的. 同理,B给A发消息也是这个流程,因为无论如何,A(ID)和B(ID)都会按照规则生成同一个组名.其中由于LayIM已经帮我们在客户端做好了发送消息并且将消息展示在面板上,所以我们要做的就是当接…

前面几篇基本已经实现了大部分即时通讯功能:聊天,群聊,发送文件,图片,消息.不过这些业务都是比较粗犷的.下面我们就把业务细化,之前用的是死数据,那我们就从加好友开始吧.加好友,首先你得知道你要加谁.Layim界面右下角有个+号,点击它之后就会弹出查找好友的界面,不过那个界面需要自定义.由于前端不是我的强项,勉强凑了个页面.不过不要在意这些细节.这些都不重要,今天主要介绍一下ElasticSearch搜索解决方案.它是一个基于Lucene的搜索服务器.它提供了一个分布式多用户能力的全文搜索引擎,基…