本文档将向您介绍 TUILiveKit 的主要功能，帮助您快速设置和运行示例项目，让您在 10 分钟内就能开启一场高质量的在线直播。
 |  |
步骤1：环境准备
Node.js 版本：Node.js ≥ 16.19.1（推荐使用官方 LTS 版本，npm 版本请与 node 版本匹配）。
支持 WebRTC APIs 的现代浏览器，详情可以查看支持列表。
步骤2：下载 Demo
1. 打开终端复制输入示例命令克隆 仓库。
git clone https://github.com/Tencent-RTC/TUILiveKit.git
2. 安装依赖
cd TUILiveKit/Web/web-vite-vue3
npm install
步骤3：配置 Demo
1. 激活 TUILiveKit 服务。获取 SDKAppID 和 SDKSecretKey。
2. 打开 TUILiveKit/Web/web-vite-vue3/src/config/basic-info-config.js 文件，并输入激活服务时获得的 SDKAppID 和 SDKSecretKey：
步骤4：跑通 Demo
启动项目
1. 在终端中输入命令，运行 Demo。
#cd TUILiveKit/Web/web-vite-vue3npm run dev
注意：
体验功能
观众观看
1. 如果您是第一次打开，将会显示登录页面。之后运行都会显示直播列表页面。
2. 登录成功后，显示的是直播列表的页面。
3. 点击直播封面进入直播间。直播间内可以观看视频，发送弹幕，查看观众列表等。
主播推流
1. 切换到推流页面
修改导航栏的 URL 地址为 
http://localhost:5173/#/live-pusher，即可进入推流页面。2. 开始直播
2.1 推流支持推横屏或者竖屏流功能，这里介绍下推竖屏流的功能，您也可以点击页面下方竖屏按钮，切换成横屏。 
2.2 点击添加摄像头或者图片按钮，添加媒体源到页面中，并点击开始直播按钮，开启一场直播。
3. 互动和管理
3.1 可以点击下方的连观众按钮，接受或者拒绝观众的连麦申请。
3.2 您也可以根据需要，改变当前直播的视频布局。点击视频下方的布局按钮，在连观众布局中选择一种，点击确认后生效。
5. 其他文档
常见问题
