为什么80%的码农都做不了架构师？>>> 
需求：一个商城app,想通过阿里云旺实现和淘宝一样的多商家多客服的功能。
方案1：商城自营申请一个云旺id，商城下申请子客服给各个商家。
缺点：目前云旺一个appid可以申请一个主客服和5个子客服。想突破5个子客服需向淘宝申请。
方案2：每个商家申请一个appid,这样每个商家都可以有一个主客服和5个子客服。
缺点：用户在各个商家内不是互通的，需在每个商家云旺账号里同步用户数据。各个云旺id互通需向淘宝申请。
方案3：用阿里openim把客服当普通用户处理，商家通过网页和用户聊天。
缺点：客服不能用千牛，也自然没有智能分流等等，网页版比较简陋。
以下为方案3代码，比较简陋，仅作个人记录。
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>在线客服</title><style>.demo{position: absolute;right: 0;bottom: 0;width: 700px;height: 470px;}</style>
</head>
<body>
<div class="demo" id="J_demo"></div>
<!--[if lt IE 9]>
<script src="https://g.alicdn.com/aliww/ww/json/json.js" charset="utf-8"></script>
<![endif]-->
<!-- 自动适配移动端与pc端 -->
<script src="https://g.alicdn.com/aliww/??h5.imsdk/2.1.5/scripts/yw/wsdk.js,h5.openim.kit/0.4.0/scripts/kit.js" charset="utf-8"></script>
<script>// http://www.taobao.com/market/seller/openim/kit.php?uid=test0&to=test1&appkey=23018936&pwd=123456&fullscreenvar search = location.search.substring(1);var s = search.split('&'),kv;var result = {};for(var i = 0, len = s.length; i < len; i++){kv = s[i].split('=');result[kv[0]] = decodeURIComponent(kv[1]);}var touid = result.touid ? result.touid : 'gele66';// 在url上加上fullscreen参数,即可变为全屏if(result.fullscreen){var d = document.getElementById('J_demo');d.parentNode.removeChild(d);}window.onload = function(){WKIT.init({container: result.fullscreen ? null : document.getElementById('J_demo'),uid: 'gele_shop4',appkey: '24464156',credential: 'c3bb188708bffa9f11d476a0793fdc6e',touid: touid, theme: 'red',//groupId: '162074220',//sendMsgToCustomService:true, //使用客服模式, 默认值: falsetitle: '客服',sendBtn:true,logo: ' http://alm.com//seller_imgs/seller_logo/logo_thumb/1496688088943756398.jpg',avatar: 'http://alm.com//seller_imgs/seller_logo/logo_thumb/1496688088943756398.jpg',toAvatar:'https://img.alicdn.com/tps/TB1BsZ6JpXXXXaZXpXXXXXXXXXX-81-81.png',//pluginUrl: 'file:///F:/phpStudy/WWW/aa/user.html',customUrl: 'file:///F:/phpStudy/WWW/aa/user.html?touid='+touid //最近联系人页面});}</script>
</body>
</html><!--文档地址：http://baichuan.taobao.com/docs/doc.htm?spm=a3c0d.7629140.0.0.fFqC1D&treeId=41&articleId=103361&docType=1 一定要认真看一遍-->
<!--user.html-->
<!DOCTYPE html>
<html>
<head><title>最近联系人</title><style>.contact>div>a{display: block;height: 30px;}.contact>div>a>img{height: 30px;width: 30px;float: left;}.contact .chat-user-name{display: inline-block;font-size: 20px;margin-left: 3px;float: left;color:#9b9b9b;}.contact .chat-user{margin: 2px 0px;}.msg_num{display: none;float: left;height: 16px;min-width:16px;text-align: center;margin-left: 4px;color: white;margin-top: 5px;line-height: 16px;font-size: 8px;border-radius: 16px;background-color: #07bbef;}.current{background-color: #dc2a2e;}.current .chat-user-name{color:#fff;}</style>
</head>
<body><div class='contact'></div><script src="https://g.alicdn.com/aliww/h5.openim.sdk/1.0.6/scripts/wsdk.js"></script><script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script><script>function getQueryVariable(variable){var query = window.location.search.substring(1);var vars = query.split("&");for (var i=0;i<vars.length;i++) {var pair = vars[i].split("=");if(pair[0] == variable){return pair[1];}}return(false);}var openIm = null;function OpenIm() {}var touid = getQueryVariable("touid");var sdk = new WSDK();//登录im帐号OpenIm.prototype.imLogin = function () {sdk.Base.login({uid:'gele_shop4',appkey: '24464156',credential: 'c3bb188708bffa9f11d476a0793fdc6e',timeout: 5000, //登录超时时间success: function (data) {console.log('login success', data);openIm.imGetRecentContact();},error: function (error) {console.log('login fail', error);alert("消息获取失败,请刷新重试");}});}//设置与某人的消息已读OpenIm.prototype.setUserReadState = function () {var obj = this;sdk.Chat.setReadState({touid: touid,timestamp: Math.floor((+new Date()) / 1000),success: function (data) {console.log('设置已读成功', data);},error: function (error) {console.log('设置已读失败', error);}});}//获取一个月内的最近联系人OpenIm.prototype.imGetRecentContact = function () {var obj = this;sdk.Base.getRecentContact({count: 10,success: function (data) {//console.log(data);data = data.data;var list = data.cnts;var elementString='';list.forEach(function (item) {//获取到uidvar uid = sdk.Base.getNick(item.uid);elementString+='<div class="chat-user">';if(uid == touid){elementString+='<a uid='+uid+' class="current" >';}else{elementString+='<a uid='+uid+'>';}elementString+='<img class="chat-avatar" src="https://img.alicdn.com/tps/TB1BsZ6JpXXXXaZXpXXXXXXXXXX-81-81.png" >';elementString+='<div class="chat-user-name">'+uid+'</div><div class="msg_num n'+uid+'"></div></a></div>';})$('.contact').append(elementString);openIm.setUserReadState();//获取联系人未读消息数openIm.getUsersUnreadMsgCount();},error: function (error) {console.log('获取最近联系人及最后一条消息内容失败', error);}});}//获取联系人未读消息数OpenIm.prototype.getUsersUnreadMsgCount = function () {var obj = this;//var recentTribe = [];//var unReadTotals = 0; //未读消息总条数sdk.Base.getUnreadMsgCount({count: 10, //一次获取的条数success: function (data) {console.log(data);var list = data.data;list.forEach(function (item) {//前8位是chntribe表示群if (item.contact.substring(0, 8) === 'chntribe') {//recentTribe.push(item);} else {//document.write(item.contact.substring(8) + '在' + getLocalTime(item.timestamp) + ',');//document.write('给我发了' + item.msgCount + '条消息，最后一条消息是在' + getLocalTime(item.lastmsgTime) + '发的<br />');//unReadTotals += item.msgCount;if( touid != item.contact.substring(8)){$('.n'+item.contact.substring(8)).text(item.msgCount);$('.n'+item.contact.substring(8)).show();console.log(item.contact.substring(8) + '给我发了' + item.msgCount + '条消息');}}});//document.write('未读消息总条数：', unReadTotals);},error: function (error) {//document.write('获取未读消息的条数失败', error);}});}$(function () {openIm = new OpenIm();openIm.imLogin();//每10妙更新未读消息window.setInterval(function(){openIm.getUsersUnreadMsgCount();}, 10000);});$("body").delegate(".contact a","click",function(){touid = $(this).attr('uid');window.open('kit.html?touid='+touid, 'webcall', 'toolbar=no,status=no,scrollbars=0,resizable=0,menubar＝0,location=0,width=1000,height=700');});</script>
</body>
</html>
