最近在开发一个业务需求,在小程序项目中增长IM即时通话功能。本次开发使用的是腾讯云的即时通讯。这里简答记录一下在使用腾讯云过程当中基本操做。web
基本配置:小程序原生开发 + 腾讯云(小程序 / WEB端共用通用文档) 有一个点挺重要:若是是首次使用腾讯云文档,必定要过文档(并且尽量多看几遍,这很重要,直接决定了你后期的实现方式)。在官方给出的文档中,小程序端是一个直播间的例子,而当时接到的需求是相似微信沟通这种聊天方式的(会话列表,会话详情)。
当时跑完了小程序的案例,以为收获不大。而web端的例子却把各个方法涵盖的比较全面,且往后还能够配合小程序联调。
本次作一个简短的分享,以便总结经验。小程序
首先按照官方文档,在项目中引入IM的js文件,一个webim_handler.js是方法文件,一个webim_wx.js是IM接口文档。微信
而后,在小程序项目中,app.js全局方法中,注册IM登录方法,使其在每次进入小程序调用该方法,判断小程序的登录态。app
简单说一下,IM登录方法调用webim.login(loginInfo, listeners, options,cbOk,cbErr)
。按照官方SDK写入该方法须要的参数。
这里主要说一下监听listeners
消息的几个主要方法:onMsgNotify() (监听到新消息时触发。这个方法基本是必填的,须要注意到是,不包括群系统消息),在这个方法中触发小程序的监听新消息事件,在其业务逻辑相关页面收到新消息事件触发,而后在经过SDK方法获取SessMap。
这里简答说一下,SessMap是一个记录未读消息的对象(在即时通信功能中很重要哦!),里面以各个未读消息id为key值,其value值为当前未读消息的基本信息,好比,当前未读联系人id,昵称,未读消息数等。(不了解SessMap的同窗应该好好看文档哦!)code
关于样式,业务逻辑,各位同窗自行解决了(小程序端在样式上也有坑,好比使用小程序原生的textarea组件定焦最后一条消息,软键盘弹起等,网上均可以搜到教程,这里不作叙述)。
当你完成上面步骤时,应该已经实现基本的会话沟通了(即时接展现消息是重点,发送消息比较简单)。这时,若是你也有会话列表(至关于微信中的“微信”页),会话详情(至关于微信中的“聊天”页)。你会发现会话列表页中展现的未读消息计数在从会话详情页返回时没有消息。这就须要在调 webim.setAutoRead(selSess, true, true)
已读上报接口。在进入会话详情页时,调用该接口触发sessMap中对应key值的清空。cdn
群聊 (群系统消息:进群,退群,修改群昵称需展现在会话详情页) 这里在app.js的im登录方法中linsters中监听onGroupSystemNotifys
方法,根据SDK找到适合本身的方法。对象
关于踩坑:未读计数在小程序点击胶囊按钮退出,隐藏到后台;web端的刷新页面都会清空sessMap。这里官方给出的解释是:通用版(web/ 小程序)SDK没有作本地存储。blog
到这里,一套IM的核心流程已经出炉了。后期在与各自的需求结合到一块儿就行了。同窗们结合各自业务中跳转到会话详情页后确认好聊天对象基本上就已经完成需求到核心功能了。今日,整理分享出来,方便你们往后查看,节约时间精力。
最后: 谢谢你们阅读,若是以为对你有帮助,请给做者一点小小的鼓励, 点个赞或者收藏吧。 有须要沟通的请联系我: 微信( wx9456d) 邮箱( allan_liu986@163.com )
教程