產品經理的需求是,App端須要集成騰訊雲IM來接收消息。在技術層面有兩個實現方案:javascript
- 若是App端只須要收發IM消息,不涉及遠程推送功能,則能夠使用騰訊雲IM的WebSDK來實現。
- 但若是App端除了接收IM消息以外,還須要接收騰訊雲的遠程推送消息,因爲HBuilder默認只集成了個推和小米推送,並未集成騰訊雲的推送功能,此時只能本身去集成iOS/Android的SDK來實現。WebSDK沒法實現遠程推送。
配置騰訊雲通訊IM後臺
首先須要登陸騰訊雲通訊後臺並進行配置,生成AppID和AccountType。html
H5+集成騰訊雲IM的WebSDK
注意:WebSDK沒法獲取遠程推送,只能收發消息。
下載WebSDK,解壓並將js文件放入項目工程中。
App端要想實現雲通訊,首先須要先登陸騰訊雲。將webim.js引入到html頁面,並調用webim.login()函數。java
<script type="text/javascript" src="js/imsdk/webim.js"></script> <script type="text/javascript" charset="utf-8"> webim.login({ sdkAppID: "1234567890", //填入後臺生成的AppID appIDAt3rd: "1234567890", //填入後臺生成的AppID identifier: userId, //用戶惟一標示 userSig: userSig, //用戶簽名 accountType: "12345" //填入後臺生成的AccountType }, { "onMsgNotify": onMsgNotify //指定一個接收並處理IM消息的函數 }, { isAccessFormalEnv: true, isLogOn: false }, function (resp) { mui.toast("IM登陸成功!!!" + resp); }, function (err) { mui.toast("IM登陸失敗。" + err.ErrorInfo); } ); </script>
webim.login()函數須要填入相關信息,以及指定用於響應IM消息的函數,以及登陸成功和失敗的回調函數,具體請參閱webim.login接口文檔。
下一步就是建立響應IM消息的函數。web
//監聽新消息事件 //newMsgList 爲新消息數組,結構爲[Msg] function onMsgNotify(newMsgList) { // console.warn(newMsgList); var newMsg; //獲取全部聊天會話 // var sessMap = webim.MsgStore.sessMap(); for (var j in newMsgList) {//遍歷新消息 newMsg = newMsgList[j]; var elems = newMsg.getElems();//獲取消息包含的元素數組 for (var i in elems) { let elem = elems[i]; let type = elem.getType();//獲取元素類型 let content = elem.getContent();//獲取元素對象 switch (type) { case webim.MSG_ELEMENT_TYPE.TEXT: const messageText = content.getText(); alert("收到IM消息:" + messageText); //進行處理 break; // case webim.MSG_ELEMENT_TYPE.FACE: // html += convertFaceMsgToHtml(content); // break; // case webim.MSG_ELEMENT_TYPE.IMAGE: // html += convertImageMsgToHtml(content); // break; // case webim.MSG_ELEMENT_TYPE.SOUND: // html += convertSoundMsgToHtml(content); // break; // case webim.MSG_ELEMENT_TYPE.FILE: // html += convertFileMsgToHtml(content); // break; // case webim.MSG_ELEMENT_TYPE.LOCATION://暫不支持地理位置 // //html += convertLocationMsgToHtml(content); // break; // case webim.MSG_ELEMENT_TYPE.CUSTOM: // html += convertCustomMsgToHtml(content); // break; // case webim.MSG_ELEMENT_TYPE.GROUP_TIP: // html += convertGroupTipMsgToHtml(content); // break; default: webim.Log.error('未知消息元素類型: elemType=' + type); break; } } } }
集成iOS/Android的騰訊雲通訊IMSDK
待整理數組