夜雨聆风
分享电商相关(支付、客服)接口及调用文档
微信相关
微信公众号支付
公众号支付是在微信端内通过微信授权后支付。
调用：
WeixinJSBridge.invoke('getBrandWCPayRequest', {"appId":"wx2421b1c4370ec43b", //公众号名称，由商户传入 "timeStamp":"1395712654", //时间戳，自1970年以来的秒数 "nonceStr":"e61463f8efa94090b1f366cccfbbb444", //随机串 "package":"prepay_id=u802345jgfjsdfgsdg888", "signType":"MD5", //微信签名方式： "paySign":"70EA570631E4BB79628FBCA90534C63FF7FADD89" //微信签名 },function(res){if(res.err_msg == "get_brand_wcpay_request:ok") { alert("微信支付成功!"); } else if(res.err_msg == "get_brand_wcpay_request:cancel") { alert("用户取消支付!"); } else { alert("支付失败!"); } } ); 微信H5支付
微信H5支付是H5页面分享出去后在其他应用内呼出微信进行支付
调用：
引入JS库
http://res.wx.qq.com/open/js/jweixin-1.2.0.js权限验证
wx.config({ debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。 appId: '', // 必填，企业号的唯一标识，此处填写企业号corpid timestamp: , // 必填，生成签名的时间戳 nonceStr: '', // 必填，生成签名的随机串 signature: '',// 必填，签名，见附录1 jsApiList: [] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2});验证权限
wx.ready(function(){ // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。});后台传参
wx.chooseWXPay({ appId: 'wx23841cce7185b550', timestamp: '1461300911', // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符 nonceStr: '5719aeafb587f', // 支付签名随机串，不长于 32 位 package: 'prepay_id=wx20160422125512b7d2205c9c0913643939', // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=***） signType: 'MD5', // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5' paySign: '5DAB1DDABE1AD34E8FF3386AE971B727', // 支付签名 success: function(res) { // 支付成功后的回调函数 if (res.errMsg == "chooseWXPay:ok") { //支付成功 alert('支付成功'); } else { alert(res.errMsg); } }, cancel: function(res) { //支付取消 alert('支付取消'); } }); 客服相关
智齿客服普通接口
https://www.sobot.com/chat/h5/index.html?sysNum=智齿客服后台生成的KEY智齿客服自定义发送商品调用
Js引入：
<script class="zhiCustomBtn" id="zhichiScript" src="//www.sobot.com/chat/frame/js/entrance.js?sysNum=708abdcdd7574f9eb6bde7761095c1e0" charset="utf-8"></script>Html绑定：
<button class="zhiCustomBtn"></button>Js调用：
//调用智齿客服var zhiManager = (getzhiSDKInstance());zhiManager.set('anchor', 'true');zhiManager.set("color", '2CB85A');zhiManager.set('title', '土豆街商品咨询');//设置用户信息zhiManager.set('userinfo', { tel: '', //电话或手机 email: '', //邮箱uname: '', //昵称 visitTitle: '', //对话页标题，若不传入系统将获取用户打开咨询组件时所在页面的标题 visitUrl: '', //对话页URL，若不传入系统将获取用户打开咨询组件时所在页面的URL face: '', //头像URL realname: '', //真实姓名 weibo: '', //微博账号 weixin: '', //微信账号 qq: '', //QQ号 sex: '', //0 男 1 女 birthday: '', //生日，如“1990-01-01” remark: '', //用户的备注信息 params: '{"等级":"VIP用户","客户状态":"意向客户"}' //自定义用户信息字段});//通过参数设置H5聊天页面显示商品信息内容zhiManager.set("title_info", "智齿_商品详情页_小智智能"); //必传 需编码zhiManager.set("url_info", "http://www.sobot.com/order/zc.html"); //必传 需编码zhiManager.set("abstract_info", "更精确的理解，更精确地回答，在闲聊寒暄中，拉近与客户的距离，导入知识库，意想不到的方便快捷，最简单的知识添加，事半功倍。"); //需编码zhiManager.set("label_info", "2000"); //需编码zhiManager.set("thumbnail_info", "http://test.sobot.com/console/images/logo_new.png"); //需编码//自定义按钮后可设置该值改变悬浮窗的水平位置zhiManager.set("customMargin", 200);//手动初始化时 通过 load 方法调用 js 组件zhiManager.on("load", function(ret) { zhiManager.initBtnDOM();});融云客服接口
第1步
<!-- 作者：1979788761@qq.com 时间：2019-01-30 描述：引入融云Web SDK,SDK 文档：http://www.rongcloud.cn/docs/web.html#sdk--><script src="//cdn.ronghub.com/RongIMLib-2.3.5.min.js"></script>第2步
var conf_appkey = 'c9kqb3rdc4mej';var conf_token = 'mdpCSlMhhapK4WtejKRn/+BqCoraaxP5usXU1I/M+sgwU0qdnXp/F00eCUinhFNYJtrgt1mHLDBYm6c7rEI9NI5OjwOclpjV';//1，初始化融云RongIMLib.RongIMClient.init(conf_appkey);//2，获取tokenvar token = conf_token;//3,连接状态监听器RongIMClient.setConnectionStatusListener({ onChanged: function(status) { switch(status) {case RongIMLib.ConnectionStatus.CONNECTED: console.log('链接成功');break;case RongIMLib.ConnectionStatus.CONNECTING: console.log('正在链接');break;case RongIMLib.ConnectionStatus.DISCONNECTED: console.log('断开连接');break;case RongIMLib.ConnectionStatus.KICKED_OFFLINE_BY_OTHER_CLIENT: console.log('其他设备登录');break;case RongIMLib.ConnectionStatus.DOMAIN_INCORRECT: console.log('域名不正确');break;case RongIMLib.ConnectionStatus.NETWORK_UNAVAILABLE: console.log('网络不可用');break; } }});//4,消息监听器RongIMClient.setOnReceiveMessageListener({ // 接收到的消息 onReceived: function(message) { // 判断消息类型 switch(message.messageType) {case RongIMClient.MessageType.TextMessage: // message.content.content => 消息内容break;case RongIMClient.MessageType.VoiceMessage: // 对声音进行预加载 // message.content.content 格式为 AMR 格式的 base64 码break;case RongIMClient.MessageType.ImageMessage: // message.content.content => 图片缩略图 base64。 // message.content.imageUri => 原图 URL。break;case RongIMClient.MessageType.DiscussionNotificationMessage: // message.content.extension => 讨论组中的人员。break;case RongIMClient.MessageType.LocationMessage: // message.content.latiude => 纬度。 // message.content.longitude => 经度。 // message.content.content => 位置图片 base64。break;case RongIMClient.MessageType.RichContentMessage: // message.content.content => 文本消息内容。 // message.content.imageUri => 图片 base64。 // message.content.url => 原图 URL。break;case RongIMClient.MessageType.InformationNotificationMessage: // do something...break;case RongIMClient.MessageType.ContactNotificationMessage: // do something...break;case RongIMClient.MessageType.ProfileNotificationMessage: // do something...break;case RongIMClient.MessageType.CommandNotificationMessage: // do something...break;case RongIMClient.MessageType.CommandMessage: // do something...break;case RongIMClient.MessageType.UnknownMessage: // do something...break; default: // do something... } }});//5,连接服务器RongIMClient.connect(token, { onSuccess: function(userId) { console.log("Connect successfully." + userId); //显示会话 }, onTokenIncorrect: function() { console.log('token无效'); }, onError: function(errorCode) { var info = ''; switch(errorCode) {case RongIMLib.ErrorCode.TIMEOUT: info = '超时';break;case RongIMLib.ConnectionState.UNACCEPTABLE_PAROTOCOL_VERSION: info = '不可接受的协议版本';break;case RongIMLib.ConnectionState.IDENTIFIER_REJECTED: info = 'appkey不正确';break;case RongIMLib.ConnectionState.SERVER_UNAVAILABLE: info = '服务器不可用';break; } console.log(errorCode); }});//6,重新连接服务器var callback = { onSuccess: function(userId) { console.log("Reconnect successfully." + userId); //显示会话 }, onTokenIncorrect: function() { console.log('token无效'); }, onError: function(errorCode) { console.log(errorcode); }};var config = { // 默认 false, true 启用自动重连，启用则为必选参数 auto: true, // 网络嗅探地址 [http(s)://]cdn.ronghub.com/RongIMLib-2.2.6.min.js 可选 url: 'cdn.ronghub.com/RongIMLib-2.2.6.min.js', // 重试频率 [100, 1000, 3000, 6000, 10000, 18000] 单位为毫秒，可选 rate: [100, 1000, 3000, 6000, 10000]};RongIMClient.reconnect(callback, config);第3步，消息中心，获取会话列表方法，直接操作list
RongIMClient.getInstance().getConversationList({ onSuccess: function(list) { // list => 会话列表集合。 console.log('会话列表数据:' + JSON.stringify(list)); }, onError: function(error) { console.log('会话列表错误:' + error); }}, null);第4步，清除未读消息数
//清除未读消息数var conversationType = RongIMLib.ConversationType.PRIVATE;var targetId = '接收消息的id';RongIMClient.getInstance().clearUnreadCount(conversationType, targetId, { onSuccess: function() { // 清除未读消息成功。 console.log('清除未读消息成功'); }, onError: function(error) { // error => 清除未读消息数错误码。 console.log('清除未读消息失败:' + error); }});客服消息接口
state_cache => 缓存状态
data_cacheArray=>消息缓存数组
state_history=>是否有历史消息状态
data_emojiList=>表情数组
var app = { state_cache: [], data_cacheArray: [], state_history:false, data_emojiList:[], loadMessage: function() { //首次加载获取消息列表 var conversationType = RongIMLib.ConversationType.PRIVATE; //单聊,其他会话选择相应的消息类型即可。 var targetId = app.data_targetid; // 想获取自己和谁的历史消息，targetId 赋值为对方的 Id。 var timestrap = null; // 默认传 null，若从头开始获取历史消息，请赋值为 0 ,timestrap = 0; var count = 20; // 每次获取的历史消息条数，范围 0-20 条，可以多次获取。 RongIMLib.RongIMClient.getInstance().getHistoryMessages(conversationType, targetId, timestrap, count, { onSuccess: function(list, hasMsg) { // list => Message 数组。 // hasMsg => 是否还有历史消息可以获取。 console.log('load-获取消息数据:' + JSON.stringify(list)); console.log('load-是否还有历史消息可以获取:' + hasMsg);if(app.state_cache[app.data_targetid] != '1') { app.data_cacheArray[app.data_targetid] = list; app.state_cache[app.data_targetid] = '1'; } app.data_messageList = app.jsonSort(app.data_cacheArray[app.data_targetid], 'sentTime'); app.state_history = hasMsg; }, onError: function(error) { console.log('load-获取消息数据失败:' + error); } }); }, getMessage: function(input) { //当有用户发消息过来，获取消息 console.log('get-获取消息数据:' + JSON.stringify(input)); app.data_cacheArray[app.data_targetid].push(input); app.data_messageList = app.jsonSort(app.data_cacheArray[app.data_targetid], 'sentTime'); app.clearUnreadCount(); }, updateMessage: function(input) { //当给用户发消息更新消息列表 console.log('update-更新消息数据:' + JSON.stringify(input)); app.data_cacheArray[app.data_targetid].push(input); app.data_messageList = app.jsonSort(app.data_cacheArray[app.data_targetid], 'sentTime'); }, getHistoryMessage: function() { //获取历史消息列表 var conversationType = RongIMLib.ConversationType.PRIVATE; //单聊,其他会话选择相应的消息类型即可。 var targetId = app.data_targetid; // 想获取自己和谁的历史消息，targetId 赋值为对方的 Id。 var timestrap = null; // 默认传 null，若从头开始获取历史消息，请赋值为 0 ,timestrap = 0; var count = 20; // 每次获取的历史消息条数，范围 0-20 条，可以多次获取。 RongIMLib.RongIMClient.getInstance().getHistoryMessages(conversationType, targetId, timestrap, count, { onSuccess: function(list, hasMsg) { // list => Message 数组。 // hasMsg => 是否还有历史消息可以获取。 console.log('history-获取消息数据:' + JSON.stringify(list)); console.log('history-是否还有历史消息可以获取:' + hasMsg); app.data_cacheArray[app.data_targetid] = app.data_cacheArray[app.data_targetid].concat(list); app.data_messageList = app.jsonSort(app.data_cacheArray[app.data_targetid], 'sentTime'); app.state_history = hasMsg; }, onError: function(error) { console.log('history-获取消息数据失败:' + error); } }); }, jsonSort: function(array, field, reverse) { //对消息列表进行实践倒序排序，数组长度小于2 或 没有指定排序字段或不是json格式数据if(array.length < 2 || !field || typeof array[0] !== "object") return array; //数字类型排序if(typeof array[0][field] === "number") { array.sort(function(x, y) {return x[field] - y[field] }); } //字符串类型排序if(typeof array[0][field] === "string") { array.sort(function(x, y) {return x[field].localeCompare(y[field]) }); } //倒序if(reverse) { array.reverse(); }return array; }, sendMessageText: function(message) { //发送文本消息 var msg = new RongIMLib.TextMessage({ //表情转文本 content: app.emojiToText(message), extra: "附加信息" }); // 单聊,其他会话选择相应的消息类型即可。 var conversationtype = RongIMLib.ConversationType.PRIVATE; // 目标 Id var targetId = app.data_targetid; RongIMClient.getInstance().sendMessage(conversationtype, targetId, msg, { onSuccess: function(message) { //message 为发送的消息对象并且包含服务器返回的消息唯一Id和发送消息时间戳 console.log("发送文本消息成功:" + JSON.stringify(message)); //更新会话列表 app.getUserList(); //更新消息列表 app.updateMessage(message); }, onError: function(errorCode, message) { var info = ''; switch(errorCode) {case RongIMLib.ErrorCode.TIMEOUT: info = '超时';break;case RongIMLib.ErrorCode.UNKNOWN: info = '未知错误';break;case RongIMLib.ErrorCode.REJECTED_BY_BLACKLIST: info = '在黑名单中，无法向对方发送消息';break;case RongIMLib.ErrorCode.NOT_IN_DISCUSSION: info = '不在讨论组中';break;case RongIMLib.ErrorCode.NOT_IN_GROUP: info = '不在群组中';break;case RongIMLib.ErrorCode.NOT_IN_CHATROOM: info = '不在聊天室中';break; default: info = x;break; } console.log('发送失败:' + info); } }); }}表情接口
1，初始化表情接口
<!-- 作者：1979788761@qq.com 时间：2019-01-30 描述：引入Emoji表情插件--><script src="//cdn.ronghub.com/RongEmoji-2.2.6.min.js"></script>//初始化表情RongIMLib.RongIMEmoji.init(); 2，实现表情接口各类操作方法
textToEmoji: function(message) { //文本转emoji表情return RongIMLib.RongIMEmoji.symbolToEmoji(message);},emojiToText: function(message) { //emoji表情转文本return RongIMLib.RongIMEmoji.emojiToSymbol(message);},getEmoji: function() { //获取Emoji表情列表 app.data_emojiList = RongIMLib.RongIMEmoji.list; console.log('获取Emoji表情列表');},clickEmoji: function(emojiSymbol) { //点击表情输入文本框 console.log('选择了Emoji表情列表:' + emojiSymbol); app.text_message += emojiSymbol; app.state_emoji = false;},showEmoji: function(state) {if(app.data_targetid != '') { //显示或隐藏emoji表情面板 console.log('显示或隐藏emoji表情面板:' + state); app.state_emoji = state; }},