uniapp开发小程序使用腾讯云IM(初始化配置,登录,监听,加群)

以前没有使用过IM,由于需要所以刚接触了IM,开发过程也碰到了许多坑,不多说直接上代码

初始化配置main.js

import TIM from './utils/tim-wx.js';//这两个文件自行去腾讯云下载
import COS from "./utils/cos-wx-sdk-v5.js";
let options = {SDKAppID: 0 // 接入时需要将0替换为您的即时通信 IM 应用的 SDKAppID ,id要去腾讯云控制台获得
};
// 创建 SDK 实例，`TIM.create()`方法对于同一个 `SDKAppID` 只会返回同一份实例
let tim = TIM.create(options); // SDK 实例通常用 tim 表示
// 设置 SDK 日志输出级别，详细分级请参见 setLogLevel 接口的说明
// tim.setLogLevel(0); // 普通级别，日志量较多，接入时建议使用
tim.setLogLevel(1); // release 级别，SDK 输出关键信息，生产环境时建议使用
// 注册 COS SDK 插件
tim.registerPlugin({'cos-wx-sdk': COS});
Vue.prototype.tim = tim

登录IM及监听消息和获取消息列表

//监听IM消息
this.onMessageReceived = function message(event){// event.data - 存储 Message 对象的数组 - [Message]console.log(event.data)
};
this.tim.on(TIM.EVENT.MESSAGE_RECEIVED, this.onMessageReceived);
//登录IM
let promise = this.tim.login({userID: IM账号id,userSig: 秘钥
});
promise.then((imResponse)=>{//监听IM处于ready状态,IM没有处于ready状态时,发送消息,会发不出去报错this.onSdkReady =(event)=>{//监听消息列表this.onConversationListUpdated = (event)=>{console.log(event.data); // 包含 Conversation 实例的数组};this.tim.on(TIM.EVENT.CONVERSATION_LIST_UPDATED, this.onConversationListUpdated);};this.tim.on(TIM.EVENT.SDK_READY, this.onSdkReady);
}).catch(function(imError) {console.warn('login error:', imError); // 登录失败的相关信息
});

注意:监听IM消息可以反复监听,本人用IM来做直播间的聊天室,开发时就出现过发一条消息,其他用户会接收多条的情况,不需要监听时注意要取消监听,而且IM里的所有监听,都不要使用匿名函数,否则取消监听时不会生效

监听IM消息,接收的是json格式,使用时需要转一下格式

加入IM聊天群

let goGroup = this.tim.joinGroup({groupID: 群组id,type: TIM.TYPES.GRP_AVCHATROOM//要加入群组的类型//TIM.TYPES.GRP_PUBLIC：公开群//TIM.TYPES.GRP_CHATROOM：聊天室//TIM.TYPES.GRP_AVCHATROOM：音视频聊天室
});
goGroup.then((imResponse)=> {switch (imResponse.data.status) {case TIM.TYPES.JOIN_STATUS_WAIT_APPROVAL: // 等待管理员同意console.log('管理员')break;case TIM.TYPES.JOIN_STATUS_SUCCESS: // 加群成功// console.log('加群成功'); // 加入的群组资料break;case TIM.TYPES.JOIN_STATUS_ALREADY_IN_GROUP: // 已经在群中console.log('已经在群中')break;default:console.log('啥也没干')break;}
}).catch((imError)=>{console.warn('加入群组失败', imError); // 申请加群失败的相关信息
});

注意:IM官方文档给的是,加入群组后,再加入其它群组,会把上一个群组给顶掉,由于我们公司app那边也加了IM,可能是安卓那边接收消息解析不到位,小程序不退群,直接加入下一个群组这种操作,多次操作后,会把安卓给干的崩溃掉,所以本人建议,加入下一个群组时,最好把上一个群退掉,然后再加入下一个群组

由于本人第一次接触IM,开发过程中碰到了许多坑,填坑也填了好久,文章中如果有不对的地方,欢迎各位大牛指点,谢谢!

uniapp开发小程序使用腾讯云IM(初始化配置,登录,监听,加群)相关推荐

uni-app开发小程序-引用腾讯地图选点
官方入口文档入口:https://lbs.qq.com/miniProgram/plugin/pluginGuide/subway 以下概述: 1.插件申请接入: 在腾讯公众平台中, "微信 ...
【微信小程序】uniapp开发小程序如何使用微信云托管或云函数进行云开发
一. 申请微信云托管这个不用说吧必须的,官方地址在这.直接进去申请就行. 但是前提是你得会创建docker file,学习掌握一些基本的docker知识,会让你创建环境变得简单一点.环境创建完成之后 ...
uniapp开发小程序，引入腾讯兔小巢插件，兔小巢页面导航头部样式错乱问题
uniapp开发小程序,引入腾讯兔小巢插件,导航头部样式错乱问题 uniapp开发小程序,引入腾讯兔小巢插件,导航头部样式错乱问题 uniapp开发微信小程序,所有页面头部导航都是自定义的,引入腾讯兔 ...
微信小程序接入腾讯云IM即时通讯（获取聊天历史记录开发步骤）
微信小程序接入腾讯云IM即时通讯(获取聊天历史记录开发步骤) 1.先看文档: 获取 C2C 历史消息 :https://cloud.tencent.com/document/product/269/1 ...
微信小程序开通腾讯云开发环境
目录微信小程序开通"腾讯云"开发环境注册腾讯云账号配置开发环境微信小程序开通"腾讯云"开发环境这里强调以下,标题是"腾讯云"开发环 ...
微信小程序基于腾讯云对象存储的图片上传
在使用腾讯云对象存储之前,公司一直使用的是传统的FTP的上传模式,而随着用户量的不断增加,FTP所暴露出来的问题也越来越多,1.传输效率低,上传速度慢.2.时常有上传其他文件来攻击服务器,安全上得不到 ...
微信小程序授权腾讯云
前言: 如果之前没有授权过腾讯云,现在在开发者工具页面已经没有腾讯云选项,只有一个腾讯位置服务. 在开发者工具里面也没有腾讯云按钮(我这是己经授权才出现的,之前并没有) 但是目前的项目并不想使用云开发 ...
uni-app 开发小程序,使用到u-charts.js时会出现弹框或下拉框部分与图标重叠的情况(还有在解决过程中出现 vasToTempFilePath: fail canvas is empty)
如下图,是我用uni-app开发小程序时出现视图与弹框或下拉框重叠的效果图,在微信开发工具上显示正常,但到了真机上就这样. 解决措施: 在小程序中canvas层级过高,导致z-index也无法让弹窗置 ...
微信小程序利用腾讯云IM发送语音 + 图片
微信小程序利用腾讯云IM发送语音 + 图片能做到这里说明你已经可以发送普通文本了如果没有的话可以看一下我的上一篇文章有完整的讲解效果图语音聊天发送图片传送 → 发送图片发送语音 ** ...

uniapp开发小程序使用腾讯云IM(初始化配置,登录,监听,加群)

uniapp开发小程序使用腾讯云IM(初始化配置,登录,监听,加群)相关推荐

最新文章

热门文章