微信小程序集成融云 SDK （即时通讯）集成必备条件

关注

发布于: 2021 年 03 月 16 日

前言

最近公司需要用微信小程序做一个能够让用户沟通的功能，经过前期筛选和对比，最后还是选择了使用融云的即时通讯，下面是我用小程序首次集成融云的 SDK 碰到的问题，在此做个记录方便自己查看，同时也给有需要的同学作为参考。前端小鸟一枚，立誓要成为前端菜鸟，不足地方留言指出，小子谢过。

准备工作

1.官网注册（https://www.rongcloud.cn/）

进入开发者后台 - 创建应用 - 获取 appkey （很重要！很重要！很重要！）

获取用户 token ，一开始我很费解为什么要获取 token ？token 是什么？怎么获取 token？（暴击三连问 o(╥﹏╥)o）简单来说就是用户的身份标识。这里就不一一解答了，直接看官网地址 - token 就行了，里面说的很清楚。
对于在前端开发阶段，还没有和后端对接时，推荐使用融云开发者后台中的 API 调用（在调试方面，真的太好用了）传入正确的参数即可

下载 SDK

注意：小程序 SDK 需要开通小程序服务后，在开发者后台中获取

但是在文档中又看到说 3.x 小程序与 Web SDK 相同，那用 Web 端的 SDK 也是可以的咯，为什么还要开通服务才能获取呢，算了！能用就行

开始集成

1、首先要需在微信公众平台配置以下合法域名（配置详情请点击这里），微信小程序如何配置合法域名应该不需要说了吧

2、SDK 初始化

开发者在使用融云 SDK 所有功能之前，开发者必须先调用此方法初始化 SDK。在应用整个生命周期中，开发者只需要将 SDK 初始化一次

var im = RongIMLib.init({

复制代码

  appkey: ' '  // 这里就是咋们在开发者后台获得到的 appkey

复制代码

});

复制代码

3、设置监听

监听消息、状态、会话列表的变化
注意：当设置多个 im.watch 的时候, 当收到一条消息后, 每个 watch 都会监听到此消息，所以会出现发一条消息，但是会重复收到这条消息
解决：在全局设置监听一次即可，不要放在组件生命周期中，防止每次组件重载都设置一次

var conversationList = []; // 当前已存在的会话列表

复制代码

im.watch({

复制代码

  conversation: function(event){

复制代码

    var updatedConversationList = event.updatedConversationList; // 更新的会话列表

复制代码

    console.log('更新会话汇总:', updatedConversationList);

复制代码

    console.log('最新会话列表:', im.Conversation.merge({

复制代码

        conversationList,

复制代码

        updatedConversationList

复制代码

      }));

复制代码

},

复制代码

  message: function(event){

复制代码

    var message = event.message;

复制代码

    console.log('收到新消息:', message);

复制代码

},

复制代码

  status: function(event){

复制代码

    var status = event.status;

复制代码

    console.log('连接状态码:', status);

复制代码

});

复制代码

4、连接融云

连接方法在应用的整个生命周期，也只需要调用一次即可，重复连接会报错
敲重点！敲重点！敲重点！除初始化、监听以外，所有方法都必须在 connect 成功之后再调用

var user = {

复制代码

  token: '' // 可以在开发者后台中调用 获取 token 来获得

复制代码

};

复制代码

// im 来自 RongIMLib.init 返回的实例，例如：var im = RongIMLib.init({ appkey: ' ' });

复制代码

im.connect(user).then(function(user) {

复制代码

  console.log('链接成功, 链接用户 id 为: ', user.id);

复制代码

}).catch(function(error) {

复制代码

  console.log('链接失败: ', error.code, error.msg);

复制代码

});

复制代码

连接成功之后就可以发送消息，获取会话列表和历史消息方法等等

需要注意的是：获取会话列表和历史消息需要开通 IM 商用版 - 单群聊云存储功能。

直接贴代码了：

//获取会话列表

复制代码

im.Conversation.getList().then(function(conversationList) {

复制代码

  console.log('获取会话列表成功', conversationList);

复制代码

});

复制代码

//发送消息：单聊文本消息

复制代码

var conversation = im.Conversation.get({

复制代码

  targetId: 'user1',

复制代码

  type: RongIMLib.CONVERSATION_TYPE.PRIVATE

复制代码

});

复制代码

conversation.send({

复制代码

  messageType: RongIMLib.MESSAGE_TYPE.TEXT, // 'RC:TxtMsg'

复制代码

  content: {

复制代码

    content: 'Hello RongCloud' // 文本内容

复制代码

}).then(function(message){

复制代码

  console.log('发送文字消息成功', message);

复制代码

});

复制代码

//获取历史消息

复制代码

var conversation = im.Conversation.get({

复制代码

  targetId: 'user1',

复制代码

  type: RongIMLib.CONVERSATION_TYPE.PRIVATE

复制代码

});

复制代码

var option = {

复制代码

  timestrap: +new Date(),

复制代码

  count: 20

复制代码

};

复制代码

conversation.getMessages(option).then(function(result){

复制代码

  var list = result.list; // 历史消息列表

复制代码

  var hasMore = result.hasMore; // 是否还有历史消息可以获取

复制代码

  console.log('获取历史消息成功', list, hasMore);

复制代码

});

复制代码

最后退出，断开连接

im.disconnect().then(function() {

复制代码

  console.log('断开链接成功');

复制代码

});

复制代码

集成融云 SDK 整个流程还是蛮简单、清晰的，想继续了解细节可以去看看融云的开发文档，地址：https://docs.rongcloud.cn/v4/views/im/noui/guide/quick/include/web.html?match=imlib-mini

发布于: 2021 年 03 月 16 日阅读数: 6

融云 RongCloud

关注

还未添加个人签名 2021.01.26 加入

还未添加个人简介

发布

暂无评论

创作场景

微信小程序集成融云 SDK （即时通讯） 集成必备条件

前言

准备工作

但是在文档中又看到说 3.x 小程序与 Web SDK 相同，那用 Web 端的 SDK 也是可以的咯，为什么还要开通服务才能获取呢，算了！能用就行

开始集成

融云 RongCloud

评论

微信小程序集成融云 SDK （即时通讯）集成必备条件