<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> <title>CS</title> <link rel="stylesheet" href="cs.min.css"> <link rel="stylesheet" href="../../css/weui.min.css"> <link rel="stylesheet" href="../../css/api.css"> <style> .rongcloud-blueBg { background: none; background-color: #dbb25f; } .rongcloud-consult button { background: #dbb25f; border-radius: 0.1rem; } .rongcloud-rong-send-btn { background: #dbb25f !important; } .rongcloud-funcPanel .rongcloud-mode2 a { color: #dbb25f } </style> </head> <body> <div id="header" class="rongcloud-rong-header rongcloud-blueBg rongcloud-online"> <span class="rongcloud-phone-exit" onclick="closeWindow()"></span> <div class="rongcloud-phone-infoBar"> <span class="rongcloud-phone-kefuName" style="font-size: 14px;">咨询客服</span> </div> </div> <div id="rcs-app"> </div> <script src="../../js/api.js"></script> <script src="../../js/weui.min.js"></script> <script src="../../js/axios.min.js"></script> <script src="../../js/public.js"></script> <!-- 可以将 SDK 下载到本地 配置 gruntfile 与 cs.js 合并压缩成一个 js 文件 --> <script src="../RongIMLib-cs.min.js"></script> <script src="//cdn.ronghub.com/RongIMVoice-2.2.4.min.js"></script> <script src="cs.min.js"></script> <script> var rongYunToken = ''; var customerServiceId = ''; var user_type = []; apiready = function () { console.log(RCS) rongYunToken = api.pageParam.rongYunToken; customerServiceId = api.pageParam.userId; user_type = api.pageParam.user_type; RCS.init({ appKey: "8w7jv4qb82s2y", // token: "wG5sHjQtfgwuZ4F2Jl1f3DCABMOr8MwyoL1v7wbF6L6/yYC3MBnTnRoOlv2d4cOJoqNM2oO263uUt+JN9vbApg==", token: rongYunToken, target: document.getElementById('rcs-app'), customerServiceId: "KEFU153130751974494", // 客服Id // customerServiceId: "KEFU150535341165880", // 客服Id userIcon: 'http://7xo1cb.com1.z0.glb.clouddn.com/rongcloudkefu2.png',//用户默认头像,在用户没有头像的时候显示 csIcon: 'http://fsprodrcx.cn.ronghub.com/UQRxDVEHcD6_gHENUQRxDUs9XOZRBH25PGECfjBjFA/base64.png',//客服默认头像,在客服没有头像的时候显示,建议线上地址 showButton: false, //是否需要按钮主动发起,设为false的时候,init()方法直接唤起聊天窗口,需客户自己编写按钮,点击之后调用init(),templates中的button模板不可用;设为true的时候,init()首先唤起客服咨询按钮,点击之后才连接客服,唤起聊天窗口,在进入页面之后就需调用init()方法。此参数是为了方便客户在点击客服按钮后自行获取token,在获取到token之后,执行init()即可。 connectingCallback: function () { console.log('连接中'); },//连接中的执行的方法,例如显示加载页面,可不传 connectedCallback: function () { },//连接成功之后的方法,例如关闭加载页面,可不传 disconnectedCallback: function (e) { toastMsg('连接断开'); setTimeout(function () { closeWindow() }, 1000) },//断开连接之后的操作,可不传 templates: { // button: ['<div class="rongcloud-consult">', // ' <button onclick="RCS.showCommon()"><span></span></button>', // '</div>', // '<div class="customer-service" style="display: none;"></div>'].join('')//"templates/button.html", // chat: "templates/chat.html", // closebefore: 'templates/closebefore.html', // conversation: 'templates/conversation.html', // endconversation: 'templates/endconversation.html', // evaluate: 'templates/evaluate.html', // imageView: 'templates/imageView.html', // leaveword: 'templates/leaveword.html', // main: 'templates/main.html', // message: 'templates/message.html', // messageTemplate: 'templates/messageTemplate.html', // userInfo: 'templates/userInfo.html', } }); } </script> </body> </html>