环信工作原理：
一、由于环信没有直接的接口来主动调取本项目中的用户数据，所有用户信息必须在环信服务器上注册对应信息成为环信的用户；（这样才能当用户进入聊天时显示其基本信息，如：名称、昵称、电话、邮箱等）；
二、客服工作台登录可以显示用户信息，可以查看用户访问轨迹，可以主动接入访客咨询等诸多功能（这些基本都不需要后端程序员编写）
下面开始后端程序员（app程序员请自行查看环信开发文档）需要接入的代码编写：
一、用户信息传递
1、先下载环信开发demo文件，提取statics、easemob.js等文件放置到项目指定目录下便于调用
如图：图片
2、编写用户信息提供接口，将本站用户基本信息return出，如下：
class GetUser { public function get() { //给予状态初始值 $res = [ 'status' =>0 ]; //判断本站用户是否登录 $user_id = Yii::$app->user->id; if ($user_id >0) { $user_one = User::Redis_getOne($user_id); //easemob_id为用户数据中是否有注册环信的账号id if (empty($user_one['easemob_id'])) { //配置文件中写入的环信参数（是公司在环信官网注册得到的信息，详情见环信文档） $option = [ 'client_id' => yii::$app->params['easemob']['client_id'], 'client_secret' => yii::$app->params['easemob']['client_secret'], 'org_name' => yii::$app->params['easemob']['org_name'], 'app_name' => yii::$app->params['easemob']['app_name'], 'base_url'=> "https://a1.easemob.com/".yii::$app->params['easemob']['org_name']."/".yii::$app->params['easemob']['app_name']."/" ]; //实例化环信类 $h = new Easemob($option); //在环信端注册用户信息 $re = $h->createUser($user_one['phone'], yii::$app->params['easemob']['default_password']); //获取环信上用户的信息到本站上 $easemob_id = $h->getUser($user_one['phone']); //添加用户相关字段值（将用户在环信上注册好的id再存入用户数据） User::updateOne_NoRedis(['id'=>$user_one['id'], 'easemob_id'=>$easemob_id['entities'][0]['username']]); //判断注册信息是否有，如果有则注册成功，状态改为1，信息存入结果集；反之则已被注册，将用户信息直接存入结果集即可； if ($re) { $res['status'] = 1; $res['msg'] = '环信用户生成'; $res['data'] = [ 'username'=>$user_one['phone'], 'password'=>yii::$app->params['easemob']['default_password'], 'nickname'=>$user_one['nickname'], 'realname'=>$user_one['realname'], 'qq'=>$user_one['qq'], 'head'=>File::getFileUrl($user_one['portrait'],100,100), 'phone'=>$user_one['phone'], 'wx'=>$user_one['wx_openid'], ]; } }else{ $res['status'] = 1; $res['msg'] = '环信用户找到'; $res['data'] = [ 'username'=>$user_one['phone'], 'password'=>yii::$app->params['easemob']['default_password'], 'nickname'=>$user_one['nickname'], 'realname'=>$user_one['realname'], 'qq'=>$user_one['qq'], 'head'=>File::getFileUrl($user_one['portrait'],100,100), 'phone'=>$user_one['phone'], 'wx'=>$user_one['wx_openid'], ]; } } return $res; } }
2、在用户点击联系客服按钮事件时，调用上述接口，获取用户信息传到客服工作台
h5页面代码：
< a href=" " οnclick="easemobim.bind({tenantId:‘注册的租户id’'})"><i class="icon"></i><span class="a_txt">在线客服</span></ a>
其中onclick为自定义按钮事件，点击启用传值动作
//打开环信客服窗口 var easemob =function(){ $.ajax({ type:'POST', url:ajax_url_config.my.easemob+'?access-token='+token, success:function (User) { var jsondata = eval("("+User+")"); } return jsondata; } ; var easemobUser = easemob (); window.easemobim = window.easemobim || {}; easemobim.config = { //是否隐藏小的悬浮按钮 hide: true, //自动连接 autoConnect: true, //环信移动客服域，固定值，请按照示例配置 domain: '//kefu.easemob.com', //您网站上im.html文件的完整路径 path: '//你项目的域名地址/huanxin', //访客插件static的路径 staticPath: '//你项目的域名地址/huanxin/static', //orgName#appName appKey: ' ', //手机App绑定的IM号 to: ' ', //集成用户体系，验证的方式二选一，必填，另一项为空即可 user: { //指定用户名，集成时必填 username: easemobUser['username'], //password验证方式 password: easemobUser['password'], //token验证方式 token: '' }, visitor:{ trueName: easemobUser['realname'], qq: easemobUser['qq'], phone: easemobUser['phone'], companyName: '', userNickname: easemobUser['nickname'], description: '' } };
在这之前，请记得要引入之前放置在指定目录下的环信js文件：
<script type="text/javascript" src="/sea-modules/huanxin/easemob.js"></script>
自此，用户信息传递完毕，客服可以看到是哪位用户在咨询。
二、用户访问轨迹传递
1、由于文件已放置，可以省略
2、商品信息得提取接口，我就不提供代码了，与上面的第二部一样；
3、商品信息的传递，也是一样，通过ajax请求得到商品数据，传递到环信平台：
var easemobgoods = (function () { var res ; $.ajax({ type:'GET', url:ajax_url_config.goods.get_attribute_url+goods_item_id, async:false, success:function (data) { res = data; } }); return res; }); var goods = easemobgoods(); //提取环信客服传递商品数据 window.easemobim = window.easemobim || {}; easemobim.config = { tenantId: ' ',//写入注册时得到的租户id //orgName#appName appKey: ' ', //手机App绑定的IM号 to: ‘ ’, satisfaction: true, // //是否隐藏小的悬浮按钮 hide: true, //自动连接 autoConnect: true, //环信移动客服域，固定值，请按照示例配置 domain: '//kefu.easemob.com', //您网站上im.html文件的完整路径 path: '//你项目的域名地址/huanxin', //访客插件static的路径 staticPath: '//你项目的域名地址/huanxin/static', //移动端点击联系客服按钮自动发送订单消息demo extMsg: { "imageName": goods['goods_name'], //custom代表自定义消息，无需修改 "type": "custom", "msgtype": { "track": { "title": "我正在看：", "price": goods['price'], "desc": goods['goods_name']+goods['color'], "img_url": goods['goods_thumb'], "item_url":"http://你项目的域名地址/goods/detail/"+goods['goods_item_id'] } } }, }
原文：https://blog.csdn.net/gaokcl/article/details/74357239
评论（0）