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

uni-app 客户端

最近更新时间:2026-09-23 18:23:46
我的收藏
本文将为您介绍如何快速跑通视频直播 Demo。跟随本文档,您可以在 10 分钟内跑通 Demo,并最终体验一个完备 UI 界面的视频直播功能。
主播直播页
连麦管理页
观众观看页




环境准备

HBuilderX:HBuilderX 是 uni-app 官方的集成开发环境(IDE),我们需要用它来导入、配置和运行我们的 Demo。
两个移动设备: Android 5.0 以上的设备 / iOS 13.0 及以上设备。
说明:
HBuilderX 4.64 和 4.65 版本对 UTS 插件打包存在已知兼容性问题,建议使用 4.75 或更高版本。

操作步骤

步骤1:获取 Demo 代码

git clone https://github.com/Tencent-RTC/TUIKit_uni-app.git
cd TUIKit_uni-app/App

步骤2:导入项目并配置 AppID

1. 打开 HBuilderX,选择文件 > 导入 > 从本地目录导入,导入 TUIKit_uni-app/App 目录。

2. 打开 manifest.json > 基础配置,重新获取 uni-app 的 AppID。




步骤3:配置 IM 应用信息

将 开通服务 中获取的 SDKAppID 和 SDKSecretKey,赋值到 /App/debug/GenerateTestUserSig.js 文件中的对应变量。
// Your SDKAppID
let SDKAppID = 0;
// Your SDKSecretKey
let SDKSECRETKEY = "";

步骤4:编译并运行 Demo

1. 制作自定义调试基座

制作自定义调试基座,在 HBuilderX 顶部菜单栏选择运行 > 运行到手机或模拟器 > 制作自定义调试基座。
说明:
首次制作自定义基座需要下载 Gradle 依赖,Android 通常需要 10~20 分钟,iOS 需要 5~10 分钟。过程中请勿中断。



说明:
为什么要制作自定义调试基座?
因为我们的多人视频会议 Demo 使用了原生的音视频能力(通过 UTS 插件实现),这超出了 HBuilderX 标准基座(一个通用的 App 壳子)的功能范围。因此,我们需要制作一个包含了这些原生插件的“专属”运行环境,这就是“自定义调试基座”。

2. 使用自定义基座运行项目

使用自定义基座运行项目,基座制作成功后,HBuilderX 控制台会有提示。然后,再次单击顶部菜单 “运行” -> “运行到手机或模拟器”,在弹出的设备选择窗口中,务必勾选“使用自定义调试基座”,然后选择您的真机设备并单击运行。




步骤4:开始直播运行。

1. 登录/注册 userID(由您定义)。
注意:
TUILiveKit 不支持同一个 UserID 多端登录,在多人协作开发时, “1”、“123”、“111” 这种简单的 UserID 很容易被占用,导致登录失败,因此建议在调试时设置辨识度较高的 UserID。为了使您可以体验完整的视频直播流程,请将 Demo 分别在两台设备上登录两个用户,一方作为主播,一方作为观众。
2. 选择直播场景。

3. 主播开启直播。
单击主页底部中间的按钮,即可进入开播预览页面,再单击开始直播按钮即可开始直播了。
直播列表页
主播预览页
主播开播页



4. 观众加入直播间。
您可以在另外一台设备上,使用不同的 userID 登录作为观众进行体验,您只需单击直播列表里任意一个房间,也可以通过输入 liveID 进入特定直播间,即可观看直播,您也可以在直播间跟主播进行连麦、赠送礼物,发送互动消息等等。
直播列表页
礼物选择页
观众观看页