帮你快速理解、总结文档立即下载

uni-app 完整版

最近更新时间:2026-07-21 16:34:26

我的收藏
本文介绍如何快速跑通 IM Demo 来体验消息发送功能。


关键概念

针对用户不同场景的诉求和体积要求,我们推出了多个版本的 UI 组件 ,您可以根据实际业务需求选择集成最适合的版本。
功能区分
聊天组件(标准版
聊天组件(完整版
登录&登出
用户资料与管理
消息列表
文本&自定义消息
图片&视频消息
历史消息
会话列表
未读消息计数
群组功能
语音&文件消息
-
消息引用/撤回/转发
-
消息已读回执
-
联系人列表
-
云端搜索
-
体积大小
0.65 MB
1.30 MB

前提条件

开通服务

即时通信 IM 控制台 > 应用管理 单击创建新应用,获取 SDKAppID 和 SDKSecretKey,在后续的步骤(配置 Demo)中会用到。


开发环境要求

HBuilderX 需要升级到最新版本
TypeScript / JavaScript (TUIKit 使用 ts 语言开发,支持在 js 或者 ts 项目中集成
Vue2/Vue3
sass(sass-loader 版本 ≤ 10.1.1)
node(12.13.0 ≤ node,推荐使用 Node.js 官方 LTS 版本 16.17.0)
npm(版本请与 node 版本匹配)

操作步骤

步骤1:获取 Demo

1. 打开终端,克隆仓库。
2. 安装依赖。
Vue3
Vue2
cd ./Miniprogram/professional-vue3
cd ./Miniprogram/professional-vue2
npm install

步骤2:配置 Demo

打开 debug/GenerateTestUserSig-es.js 文件,将开通服务时获取到对应的 SDKAppID 和 SDKSecretKey 填入其中。


步骤3:跑通 Demo

1. HBuilder 中导入项目。

2. 运行到微信开发者工具,勾选运行时是否压缩代码


步骤4:发送第一条消息

登录
会话列表
聊天界面




Debug 脚本的作用

出于体积和安全双重因素考虑,请在发布前删除项目目录下 /TUIKit/debug 文件夹。在开发阶段为了方便开发,项目提供生成本地 UserSig 的脚本文件存放于 TUIKit/debug 文件夹中,但这并不安全,该方法中 SECRETKEY 很容易被反编译逆向破解,一旦您的密钥泄露,攻击者就可以盗用您的腾讯云流量,因此该方法仅适合本地跑通 Demo 和功能调试。因此,请在项目发布前删除 Debug 脚本,使用后台生成 UserSig,具体原因和操作步骤请参考文档:生成 UserSig

联系我们

如遇任何问题,可联系 官网售后 反馈,享有专业工程师的支持,解决您的难题。