前言

  不知不觉已经十四篇了,其实已经没有什么可写了。但是突然发现layim中带的客服功能没有用到。于是乎,抽点时间完成吧。其实之前的工作已经把客服功能完成了一大半,剩下的我们稍微调整即可。今天的演示我们放在后边,直接进入讲解。

客服思路讲解

  大家去一些公司网站都会发现,网页侧面或者自动弹出一些客服聊天框,人家很热情的和你交谈。我们也可以用layim来实现。首先,页面添加一个按钮,点击按钮触发客服模式。

 <a onclick="javascript:global.other.kefu(14896)">我是客服</a>

  

  我们先登录一个用户,模拟客服人员。(一个正常用户登录即可,他的id是14896,对应上述代码中的14896,当然这个id只要设置成一个客服id即可。并非死值)

  

  然后我们换一个浏览器(为了不使cookie冲突导致自己和自己对话),换一个用户登录,模拟咨询人员。登录之后,点击我是客服按钮弹出客服界面,并发送消息如下图:

 //打开客服
kefu: function (kfid) {
layim.chat({
name: '在线客服-小苍'
, type: 'kefu'
, avatar: '/headphotos/default.jpg'
, id: kfid
});
}

  

  在此解释一下,为什么这里给客服发送消息,对面就收到了呢,其实是这样的。首先当我们点击发送的时候触发客服发送事件。layim中默认有三种,friend,group,kefu。其实friend和kefu可以归为一类,他们相当于1对 聊天,所以我们也是如此,直接调用1对1聊天的发送方法即可。只不过对面收到的消息类型是kefu。

  

  这里我们客服端如何处理呢,其实很简单,不用动,直接像1v1聊天那样处理就好,由于layim中的 getMessage方法内部已经判断了kefu和friend的区别。所以,我们只要静静的等待消息即可。

  layim.getMessage(result.msg);//因为result.msg 是合乎layim接口规范,所以直接带入

  然后如下图,我们的客服MM就收到了一条消息。

  

  打开消息界面,客服MM回复客户。同样,客户也收到了回复的消息。(其实客服消息就是1对1消息,只不过UI端的处理不同而已)

  

  这样一个完整的客服咨询过程就结束了,如果想做的完美一点还可以做一个客服满意度评价之类的功能。

总结

  实现客服消息是不是很简单呢,当然。。。。。。不简单,本篇简单是因为之前的1对1聊天中我们已经做了大量的后端代码工作和前端的处理,所以,对接客服消息的时候你会发现一个模式套用上去,能直接使用。最后,还是对同样喜欢研究layim的同学说一句,layim是大神的代码,但不代表你不能够动他,多读读源代码,你会发现其中的设计巧妙之处以及学习到高手的编码方式和设计思路。然后你再照葫芦画瓢把你自己想的功能给加上去,那还不是小菜一碟!

  本系列博客教程:ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室 实战系列(不断更新中)

ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(十四)之漏掉的客服消息的更多相关文章

  1. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(四) 之 用户搜索(Elasticsearch),加好友流程(1)。

    前面几篇基本已经实现了大部分即时通讯功能:聊天,群聊,发送文件,图片,消息.不过这些业务都是比较粗犷的.下面我们就把业务细化,之前用的是死数据,那我们就从加好友开始吧.加好友,首先你得知道你要加谁.L ...

  2. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室 实战系列

    ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(零) 前言  http://www.cnblogs.com/panzi/p/5742089.html ASP.NET S ...

  3. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(三) 之 实现单聊,群聊,发送图片,文件。

    上篇讲解了如何搭建聊天服务器,以及客户端js怎么和layui的语法配合.服务器已经连接上了,那么聊天还会远吗? 进入正题,正如上一篇提到的我们用 Client.Group(groupId)的方法向客户 ...

  4. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室 实战系列(不断更新中)

    项目简介 利用ASP.NET SignalR技术与Layim前端im框架实现的一个简单的web聊天室,包括单聊,群聊,加好友,加群,好友搜索,管理,群组管理,好友权限设置等功能.涉及技术: Elast ...

  5. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室 实战系列(内容已过期,阅读请慎重)

    项目简介 利用ASP.NET SignalR技术与Layim前端im框架实现的一个简单的web聊天室,包括单聊,群聊,加好友,加群,好友搜索,管理,群组管理,好友权限设置等功能.涉及技术: Elast ...

  6. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(十二) 代码重构使用反射工厂解耦(一)缓存切换

    前言 上一篇中,我们用了反射工厂来解除BLL和UI层耦合的问题.当然那是最简单的解决方法,再复杂一点的程序可能思路相同,但是在编程细节中需要考虑的就更多了,比如今天我在重构过程中遇到的问题.也是接下来 ...

  7. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(零) 前言

    前端时间听一个技术朋友说 LayIM 2.0 发布了,听到这个消息抓紧去官网看了一下.(http://layim.layui.com/)哎呀呀,还要购买授权[大家支持一下哦],果断买了企业版,喜欢钻研 ...

  8. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(一) 之 基层数据搭建,让数据活起来(数据获取)

    大家好,本篇是接上一篇 ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(零) 前言  ASP.NET SignalR WebIM系列第二篇.本篇会带领大家将 LayIM ...

  9. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(二) 之 ChatServer搭建,连接服务器,以及注意事项。

    上篇:ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(一) 之 基层数据搭建,让数据活起来(数据获取) 上一篇我们已经完成了初步界面的搭建工作,本篇将介绍IM的核心内容 ...

  10. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(五) 之 加好友,加群流程,消息管理和即时消息提示的实现

    前言 前前一篇留了个小问题,在上一篇中忘了写了,就是关于LayIM已经封装好的上传文件或者图片的问题.对接好接口之后,如果上传速度慢,界面就会出现假死情况,虽然文件正在上传.于是我就简单做了个图标替代 ...

随机推荐

  1. CSS 3 动画2D

    动画分为两种,1,逐帧动画  组成动画的每一个画面就是一帧 2,关键帧动画,确定关键帧电脑会自动过度 动画中如果遇到不兼容的问题也是要加前缀 @-webkit-keyframes规则   @-webk ...

  2. jq知识总结

    jQuery   jQuery基本选择器: id选择器     $("#div1") class选择器   $(".div1") 元素选择器   $(" ...

  3. AWS EC2的VPN-PPTP搭建教程(on aws redhat6.5 X64 centOS 6.5)

    前些日子收到amazon的邮件通知,一年前申请的ec2到期了,一年免费的free tier没有了,放在上面的2个站已经欠费了十几美元了,不过我也不打算用了,准备重新注册账号(请不要鄙视我..) 1.注 ...

  4. 亲测!阿里云公共DNS,感觉不错!

    最近阿里推出了公共DNS,这对于普通的网友来说估计没什么用处,但对于我们建站人来说,确实是一个不错的消息.一听说阿里出公共DNS,博主就立马换电信的DNS换下了.经过这几天的测试,相当满意! 个人感觉 ...

  5. json 转换错误:JSON.parse expected property name or '}'

    错误原因: 格式要为: [ { "name":"张三", "age":"20" }, { "name" ...

  6. easyui-textbox 和 easyui-validatebox 设置值和获取值

    表单作如下定义:该input使用easyui的"easyui-textbox" <input id="addSnumber" style="wi ...

  7. 服务器端与客户端TCP连接入门(二)

    1.服务器端程序 package Socket; import java.io.BufferedReader; import java.io.IOException; import java.io.I ...

  8. ubuntu arm妙算加载cp210x驱动

    在妙算TK1上安装ros后,插上usb串口竟然没有驱动 无奈装 从http://www.silabs.com/products/mcu/pages/usbtouartbridgevcpdrivers. ...

  9. 【0 - 1】OC内存管理

    一.内存管理概述 垃圾回收机制(GC):由系统管理内存,程序员不需要管理. OC中的垃圾回收:在OC2.0版加入垃圾回收. OC与iOS:OC有垃圾回收机制,但是iOS屏蔽了这个功能.原因:iOS运行 ...

  10. UINavigationController导航控制器

    UINavigationController导航控制器,是多个界面间跳转的重要元素,可以理解为它存储着多个viewController,它的存储结构是栈,栈的特点是先进后出,所以添加视图控制器时,要特 ...