在线KTV 歌房概述,架构,应用数据流及实现方式

1、即构平台与 KTV 场景介绍

即构流媒体服务平台为 KTV 歌房应用场景提供全方位支持，包括：

• 优秀的终端技术，支持高清、无回声强降噪音频

  稳定可靠的流媒体网络既支持低延迟实时互动需求，也支持跨区域大量分发场景

  强大灵活的定制接口，支持自定义音效、视频采集与滤镜处理等高级功能

1.1 KTV 场景

单人MV轮麦

房间内人员都可以进行点歌并排麦，歌手按照麦序单人进行唱歌。该方式的歌词显示方式有：背景图+字幕、MV唱片。

多麦直播 KTV

房间内人员都可以进行点歌并排麦，歌手按照麦序单人进行唱歌。该方式的歌词显示方式有:背景图+字幕、MV唱片。房间内等待上麦的人员可以进行聊天互动、点评等。

双人 KTV 模式

主唱和副唱合唱，观众可以听到主唱和副唱的合唱效果。由于网络延迟不可控，此场景下主唱听不到副唱的声音，副唱可以听到主唱。该方式的歌词显示方式：字幕。

以上几种模式中，核心的 KTV 场景功能需求有：

• 伴奏音乐/MV播放

  伴奏与歌声混音

  音乐与歌词同步

  主唱与听众互动

即构 SDK 对以上需求提供了接口支持，只需简单编码即可实现这些核心需求。业务方结合简单信令控制，就可以串起 KTV 的各种模式的业务流程。

1.2 体验 App

下载

即构提供 KTV 体验 App，支持 iOS 及 Android 平台，请扫码安装：

用法

安装 KTV 后，客户可以体验到 KTV 功能，包括独唱、合唱、观众听歌、MV歌房等。启动后，在主界面的房间列表中找到正在直播的 KTV 房间，加入这些房间并参与互动;或者创建自己的歌房，然后使用 KTV 功能。

2、即构平台架构及 KTV 应用数据流示意

业务方通过通过 ZegoLiveRoom SDK 接口使用即构平台服务。SDK 提供了音视频采集、处理、编解码、渲染等多媒体核心功能，并封装了即构媒体传输网络服务、房间信令及消息服务等功能。

2.1 多媒体流

即构 SDK 把采集我方的音视频，编码后发送到 Zego 实时网络，此步骤被称为“推流”。同时，Zego SDK 从 Zego 实时网络中接收对方的音视频数据流，解码得到对方的声音与画面，此步骤被称作“拉流”。

2.2 SDK 多媒体架构

SDK 多媒体架构图如下所示：

上图描述了即构 SDK 内部工作架构，支持 KTV 场景的主要需求：

1. 提供媒体流的发送与接收，让 KTV 各方能够进行音视频互动;

2. 提供媒体播放器，支持 MP3/MP4 等流行媒体格式文件的伴奏音乐播放;并支持在线资源播放;

3. 支持将伴奏音乐与麦克风混音;

4. 支持在媒体数据中注入非媒体数据，实现歌词同步功能。

2.3 KTV 场景数据流动

2.3.1 单人 MV 模式数据流动

此模式时单主播直播模式扩展，仅在主播端加入伴奏音乐播放推流部分。

主唱

1. 登录 KTV 房间，同房间的用户可以互动

2. 开始推流

3. 播放伴奏音乐 MV，并随着音乐唱歌

4. 将歌词进度信息放入媒体流中

普通观众

1. 登录 KTV 房间

2. 拉主唱的流，听到 KTV 并提取歌词

2.3.2 多麦直播模式数据流动

此模式为连麦直播模式扩展，仅在主唱的端加入伴奏音乐播放及推流部分。

主唱

1. 登录 KTV 房间，同房间的用户可以互动

2. 开始推流

3. 播放伴奏音乐 MV，并随着音乐唱歌

4. 将歌词进度信息放入媒体流中

5. 拉麦主的流，听评论

麦主

1. 登录 KTV 房间

2. 拉主唱的流，提取歌词信息

3. 推流参与评论互动

普通观众

1. 登录 KTV 房间

2. 拉主唱的流，提取歌词

3. 拉麦主的流，听评论

2.3.3 双人 KTV 模式数据流动

下图描述的是双人 KTV 模式的数据流示意图：

整体流程如下：

主唱

1. 登录 KTV 房间，同房间的用户可以互动

2. 开始推流

3. 播放伴奏音乐 MV，并随着音乐唱歌

4. 将歌词进度信息放入媒体流中

5. 拉互动观众的纯音频流，与副唱合唱

互动观众

1. 登录 KTV 房间

2. 拉主唱的流，提取歌词信息

3. 推流，并混入主唱流的声音

4. 推一路纯麦克风采集音频流给主唱，让主唱听到其演唱

普通观众

1. 登录 KTV 房间

2. 拉主唱的流，提取歌词

3. 拉副唱的流，听 KTV 合唱

3、SDK集成指引

即构对 KTV App 终端的技术支持，集成在了 ZegoLiveRoom SDK 中。具体功能实现包括 SDK 初始化，推流、拉流、播放伴奏音乐、歌词同步、主唱与副唱合唱、等功能，请开发者根据项目业务需求参考。详细实现方式点击https://www.zego.im/html/document/#Application_Scenes/ZegoKTV/Overview查看。