客服模块(优客服)
开源项目(优客服)搭建及基础使用说明
项目开源说明
老版本开源也就是码云上存在源码依旧开源
git地址:http://192.168.8.169:8088/common/ukfu.git
项目组成
- 前端:LayUI + Freemarker
- 后端:Spring Boot
- 数据库:MySQL+Elasticsearch
项目运行
1.将代码拉取下来(默认当前分支即可)
2.编译pom.xml文件,下载好jar包
3.本项目自带有两个依赖包(src/main/resources/WEB-INF/lib),IP2REGION 和 UCKeFu-Core,通过以下指令加入到本地Mavenue仓库:
mvn install:install-file -Dfile=src/main/resources/WEB-INF/lib/ip2region-1.2.4.jar -DgroupId=org.lionsoul.ip2region -DartifactId=ip2region -Dversion=1.2.4 -Dpackaging=jar
mvn install:install-file -Dfile=src/main/resources/WEB-INF/lib/jave-1.0.2.jar -DgroupId=lt.jave -DartifactId=jave -Dversion=1.0.2 -Dpackaging=jar
4.创建mysql数据库,将ukefu.sql脚本在mysql数据库里运行
5.配置项目中的application.properties文件中的数据库连接
6.就可以启动Application,一般就启成功了(默认端口80)
核心使用
服务端代码说明
1、NettySocketIO的NameSpace 和 Room 基础概念
客户端连接时指定自己属于哪个 NameSpace, io.connect( http://localhost/namespace)。 服务端看到 NameSpace 就会把这个 socket 加入指定的 NameSpace。
如果客户端没有具体指定哪个 room,则服务端会放入默认 room 中,或者服务端通过代码 socket.join(“agent”) 放入 agent 的 Room 中。
2、服务配置代码
2.1优客服通信服务配置通过 SpringBoot 启动,服务配置代码位于:
com.ukefu.webim.config.web. IMServerConfiguration,使用的是 Spri
ngBoot 的@ Configuration 功能启动
2.2 NameSpace注册及服务启动代码:com.ukefu.webim.util.server.ServerRunner,采用@Component 注册及CommandLineRunner启动
2.3nameSpace监听实例(事件和消息的处理类)(com.ukefu.webim.util.server.handler.IMEventHandler),如客户对应nameSpace处理类
2.4.nameSpace处理类中监听消息事件类型有以下几种:
2.4.1.@OnConnect 客户端建立连接的事件处理接口
2.4.2.@OnDisconnect 客户端断开连接的事件处理接口
2.4.3.@OnEvent 客户端触发的消息事件处理接口,优客服系统中定义了以下几种事件消息:
@OnEvent(value = “status”) 状态变更事件,例如,新用户接入、用户离开、统计坐席的当前状态信息等
@OnEvent(value = “message”)介绍到访客或坐席发送的消息处理接口,完成消息的解析、组装、路由等功能
3.服务端发送示例(客服发送消息:com.ukefu.webim.util.server.handler.AgentEventHandler)如下:
com.ukefu.webim.util.router.WebIMOutMessageRouter
com.ukefu.util.client.NettyClients
4.相关代码位置说明
客户端代码说明
1.客户端连接示例:templates/apps/im/index.html(pc客户端)
客户端通过 SocketIO.js 代码连接服务端,连接的 NameSpace 是 ‘/im/user’,同时,传入连接的参数,各个参数及其功能说明如下:
userid:当前访客的用户标识
orgi:组织标识
session:会话标识
appid:网站识别代码,能够支持多个网站接入客服系统
osname:当前访问客户端的操作系统名称
browser:当前访问客户端的浏览器名称和版本信息
skill:接入的技能组,默认为空,表示自动分配
agent:请求的人工坐席,默认为空,表示自动分配
2.客户端监听事件,如下:
socket.on(‘connect’,function() {}) :连接成功回调事件
socket.on(‘disconnect’,function() {}):断开连接回调事件(断开连接socket对应的客户端与服务端都会触发对应回调事件)
socket.on(‘status’,function(data) {}):接收客服系统状态消息,例如开始和结束坐席对话
socket.on(‘agentstatus’,function(data) {}):用于接收服务端推送的坐席分配状态消息,例如:坐席忙、坐席分配成功
socket.on(‘message’,function(data) {}):接收坐席发送的消息和当前访客发送给坐席的消息
接收消息示例(templates/apps/im/index.html(pc客户端))如下:
3.客户端发送消息示例(templates/apps/im/index.html(pc客户端))如下:
4.相关代码位置说明
pc客户端:templates/apps/im/index.html
移动客户端:templates/apps/im/mobile.html
pc客服端:templates/apps/agent/index.html
5.客户端工作流程
项目其他相关文档见项目结构