uniapp小程序对接腾讯IM即时通讯无ui集成(1)

首先需要完成一些准备工作。

1.注册腾讯云账号

腾讯云 注册账号后搜索im即时通讯,新创建一个应用。

2.uniapp创建项目

腾讯云无ui集成文档

按照文档步骤下载完这两个包后打开项目。有下图这两个包就算完成了开始工作。

3.APP目录进行引入和集成

c 复制代码
<script>
	import TIM from '@tencentcloud/chat';
	import TIMUploadPlugin from 'tim-upload-plugin';
	let options = {
		SDKAppID: 0 // 接入时需要将0替换为您的即时通信 IM 应用的 SDKAppID
	};
	// 创建 SDK 实例,`TIM.create()`方法对于同一个 `SDKAppID` 只会返回同一份实例
	uni.$TUIKit = TIM.create(options); // SDK 实例通常用 tim 表示
	uni.$TUIKit.setLogLevel(1); // 普通级别,日志量较多,接入时建议使用
	uni.$TUIKit.registerPlugin({
		'tim-upload-plugin': TIMUploadPlugin
	});
	uni.$TUIKitTIM = TIM;
	uni.$TUIKitEvent = TIM.EVENT;
	uni.$TUIKitVersion = TIM.VERSION;
	uni.$TUIKitTypes = TIM.TYPES; // 监听系统级事件
	export default {
		onLaunch: function() {
			console.log('App Launch')
		},
		onShow: function() {
			console.log('App Show')
		},
		onHide: function() {
			console.log('App Hide')
		}
	}
</script>

<style>
	/*每个页面公共css */
</style>
相关推荐
汤姆yu5 小时前
基于微信小程序的垃圾分类系统
微信小程序·小程序
每天都想着怎么摸鱼的前端菜鸟6 小时前
uniapp开发app 实现简易的路由拦截器
vue.js·uni-app
随笔记6 小时前
uniapp中获取设备wifi列表,已连接wifi信息
前端·javascript·uni-app
lqj_本人6 小时前
鸿蒙OS&UniApp微服务架构实践:从设计到鸿蒙部署#三方框架 #Uniapp
架构·uni-app·harmonyos
胡斌附体6 小时前
uniapp中view标签使用范围
uni-app·跨平台·标签·view·范围
ZouNiMei7 小时前
使用uniapp的nvue开发地图map功能踩坑记录
前端·uni-app
ywyy679810 小时前
小程序定制开发:从需求到落地,打造企业专属数字化入口
大数据·网络·人工智能·小程序·短剧
Mr.Liu610 小时前
小程序32-简易双向数据绑定
前端·微信小程序·小程序
说私域10 小时前
短视频平台差异视角下开源AI智能名片链动2+1模式S2B2C商城小程序的适配性研究——以抖音与快手为例
人工智能·小程序·开源·零售
发现你走远了13 小时前
『uniapp』添加桌面长按快捷操作 shortcuts(详细图文注释)
uni-app