效果展示

您可以 下载 安装我们的 Demo 体验互动直播的能力效果，包括互动连麦、主播 PK、低延时观看、弹幕聊天等 TRTC 在互动直播场景下的相关能力。

如需快速接入视频互动直播功能，您可以直接基于我们提供的 Demo 进行修改适配，也可以使用我们提供的 TRTCLiveRoom 组件并实现自定义 UI 界面。

复用 Demo 的 UI 界面

步骤1：创建新的应用

1. 登录实时音视频控制台，选择【开发辅助】>【快速跑通Demo】。
2. 输入应用名称，例如 TestLiveRoom ，单击【创建】。

注意：

本功能同时使用了腾讯云 实时音视频 TRTC 和 即时通信 IM 两个基础 PaaS 服务，开通实时音视频后会同步开通即时通信 IM 服务。 即时通信 IM 属于增值服务，详细计费规则请参见 即时通信 IM 价格说明。

步骤2：下载 SDK 和 Demo 源码

1. 根据实际业务需求下载 SDK 及配套的 Demo 源码。
2. 下载完成后，单击【已下载，下一步】。
   

步骤3：配置 Demo 工程文件

1. 进入修改配置页，根据您下载的源码包，选择相应的开发环境。
2. 找到并打开 iOS/TRTCScenesDemo/TXLiteAVDemo/Debug/GenerateTestUserSig.h 文件。
3. 设置 GenerateTestUserSig.h 文件中的相关参数：
   • SDKAPPID：默认为0，请设置为实际的 SDKAppID。
   • SECRETKEY：默认为空字符串，请设置为实际的密钥信息。
   
4. 粘贴完成后，单击【已复制粘贴，下一步】即创建成功。
5. 编译完成后，单击【回到控制台概览】即可。

注意：

• 本文提到的生成 UserSig 的方案是在客户端代码中配置 SECRETKEY，该方法中 SECRETKEY 很容易被反编译逆向破解，一旦您的密钥泄露，攻击者就可以盗用您的腾讯云流量，因此该方法仅适合本地跑通 Demo 和功能调试。
• 正确的 UserSig 签发方式是将 UserSig 的计算代码集成到您的服务端，并提供面向 App 的接口，在需要 UserSig 时由您的 App 向业务服务器发起请求获取动态 UserSig。更多详情请参见 服务端生成 UserSig。

步骤4：运行 Demo

使用 Xcode（11.0及以上的版本）打开源码工程 iOS/TRTCScenesDemo/TXLiteAVDemo.xcworkspace，单击【运行】即可开始调试本 Demo。

步骤5：修改 Demo 源代码

源码中的 trtcliveroomdemo 文件夹包含两个子文件夹 ui 和 model，ui 文件夹中均为界面代码，如下表格列出了各个 swift 文件或文件夹及其所对应的 UI 界面，以便于您进行二次调整：

实现自定义 UI 界面

源码 中的 trtcliveroomdemo 文件夹包含两个子文件夹 ui 和 model，model 文件夹中包含可重用的开源组件 TRTCLiveRoom，您可以在TRTCLiveRoom.swift 文件中看到该组件提供的接口函数，并使用对应接口实现自定义 UI 界面。

步骤1：集成 SDK

视频通话组件 TRTCLiveRoom 依赖 TRTC SDK 和 IM SDK，您可以按照如下步骤将两个 SDK 集成到项目中。

方法一：通过 cocoapods 仓库依赖

pod 'TXIMSDK_iOS'
pod 'TXLiteAVSDK_TRTC'

说明：

两个 SDK 产品的最新版本号，可以在 TRTC 和 IM 的 Github 首页获取。

方法二：通过本地依赖
如果您的开发环境访问 cocoapods 仓库较慢，您可以直接下载 ZIP 包，并按照集成文档手动集成到您的工程中。

步骤2：配置权限

在 info.plist 文件中需要添加 Privacy > Camera Usage Description， Privacy > Microphone Usage Description 申请摄像头和麦克风权限。

步骤3：导入 TRTCLiveRoom 组件

拷贝 iOS/TRTCScenesDemo/TXLiteAVDemo/TRTCLiveRoomDemo/model 目录中的所有文件到您的项目中。

步骤4：创建并登录组件

1. 调用 TRTCLiveRoom 的 init 接口可以创建一个 TRTCLiveRoom 组件的实例对象。
2. 创建一个 TRTCLiveRoomConfig 对象，该对象可以设置 useCDNFirst 和 CDNPlayDomain 属性：
   • useCDNFirst 属性：用于设置观众观看方式。true 表示普通观众通过 CDN 观看，计费便宜但延时较高。false 表示普通观众通过低延时观看，计费价格介于 CDN 和连麦之间，但延迟可控制在1s以内。
   • CDNPlayDomain 属性：在 useCDNFirst 设置为 true 时才会生效，用于指定 CDN 观看的播放域名，您可以登录直播控制台 >【域名管理】页面中进行设置。
3. 调用 login 函数完成组件的登录，请参考下表填写关键参数：

   参数名	作用
   sdkAppId	您可以在 实时音视频控制台 中查看 SDKAppID。
   userId	当前用户的 ID，字符串类型，只允许包含英文字母（a-z、A-Z）、数字（0-9）、连词符（-）和下划线（_）。
   userSig	腾讯云设计的一种安全保护签名，获取方式请参考 如何计算 UserSig。
   config	全局配置信息，请在登录时初始化，登录之后不可变更。 useCDNFirst 属性：用于设置观众观看方式。true 表示普通观众通过 CDN 观看，计费便宜但延时较高。false 表示普通观众通过低延时观看，计费价格介于 CDN 和连麦之间，但延迟可控制在1s以内。 CDNPlayDomain 属性：在 useCDNFirst 设置为 true 时才会生效，用于指定 CDN 观看的播放域名，您可以登录直播控制台 >【域名管理】页面中进行设置。
   callback	登录回调，成功时 code 为0。

   class LiveRoomController: UIViewController {
       let mLiveRoom = TRTCLiveRoom()
   }
   //useCDNFirst：true 表示普通观众通过 CDN 观看，false 表示普通观众通过低延时观看
   //CDNPlayDomain：表示 CDN 观看时配置的播放域名
   let config = TRTCLiveRoomConfig(useCDNFirst: useCDNFirst, cdnPlayDomain: yourCDNPlayDomain)
   mLiveRoom.login(SDKAPPID, userID, userSig, config) { (code, error) in
       if code == 0 {
           //登录成功
       }
   }

步骤5：主播端开播

1. 主播执行 步骤四 登录后，可以调用setSelfProfile设置自己的昵称和头像。
2. 主播在开播前可先调用startCameraPreview开启摄像头预览，界面上可以配置美颜调节按钮调用，通过getBeautyManager进行美颜设置。

   说明：

   非企业版 SDK 不支持变脸和贴图挂件功能。

3. 主播调整美颜效果后，可以调用createRoom创建新的直播间。
4. 主播调用startPublish开始推流。如需支持 CDN 观看，请在 login 时传入的TRTCLiveRoomConfig参数中指定useCDNFirst和CDNPlayDomain并在startPublish时指定直播拉流用的 streamID。

// 1.主播设置昵称和头像
mLiveRoom.setSelfProfile(name: "A", avatarURL: "faceUrl", callback: nil)
// 2.主播开播前预览并设置美颜参数
let view = UIView()
parentView.add(view)
mLiveRoom.startCameraPreview(frontCamera: true, view: view, callback: nil)
mLiveRoom.getBeautyManager().setBeautyStyle(.nature)
mLiveRoom.getBeautyManager().setBeautyLevel(6)
// 3.主播创建房间
let param = TRTCCreateRoomParam(roomName: "测试房间", coverUrl: "")
mLiveRoom.createRoom(roomID: 123456789, roomParam: param) { [weak self] (code, error) in
if code == 0 {
// 4.主播开启推流并将流发布到 CDN
self?.mLiveRoom.startPublish(streamID: mSelfUserId + "_stream", callback: nil)
}
}

步骤6：观众端观看

1. 观众端执行 步骤四 登录后，可以调用setSelfProfile设置自己的昵称和头像。
2. 观众端向业务后台获取最新的直播房间列表。

   说明：

   Demo 中的直播间列表仅做演示使用，直播间列表的业务逻辑千差万别，腾讯云暂不提供直播间列表的管理服务，请自行管理您的直播间列表。

3. 观众端调用getRoomInfos获取房间的详细信息，该信息是在主播端调用createRoom创建直播间时设置的简单描述信息。

   注意：

   如果您的直播间列表包含了足够全面的信息，可跳过调用getRoomInfos相关步骤。

4. 观众选择一个直播间，调用enterRoom并传入房间号即可进入该房间。
5. 调用startPlay并传入主播的 userId 开始播放。
   • 若直播间列表已包含主播端的 userId 信息，观众端可直接调用startPlay并传入主播的 userId 即可开始播放。
   • 若在进房前暂未获取主播的 userId，观众端在进房后会收到主播onAnchorEnter的事件回调，该回调中携带主播的 userId 信息，调用startPlay即可播放。

// 1.假定您从业务后台获取房间列表为 roomList
var roomList: [UInt32] = GetRoomList()
// 2.通过调用 getRoomInfos 获取房间的详细信息
mliveRoom.getRoomInfos(roomIDs: roomList, callback: { (code, msg, list) in
if code == 0 {
// 获取到房间详细信息后，您可以在主播列表页面展示主播昵称、头像等相关信息
}
})
// 3.选择房间 roomid 进入
mliveRoom.enterRoom(roomID: roomID, callback: callback)
// 4.观众收到主播进房通知，开始播放
public func trtcLiveRoom(_ trtcLiveRoom: TRTCLiveRoom, onAnchorEnter userID: String) {
// 5.观众播放主播画面
mliveRoom.startPlay(userID: userID, view: renderView, callback: nil) 
}

步骤7：观众与主播连麦

1. 观众端调用requestJoinAnchor向主播端发起连麦请求。
2. 主播端会收到TRTCLiveRoomDelegate#onRequestJoinAnchor（即有观众请求与您连麦）的事件通知。
3. 主播端可以通过调用responseJoinAnchor决定是否接受来自观众端的连麦请求。
4. 观众端会收到TRTCLiveRoomDelegate#responseCallback事件通知，该通知会携带来自主播端的处理结果。
5. 如果主播同意连麦请求，观众端可调用startCameraPreview开启本地摄像头，随后调用startPublish启动观众端的推流。
6. 主播端会在观众端启动通知后收到 TRTCLiveRoomDelegate#onAnchorEnter （即另一路音视频流已到来）通知，该通知会携带观众端的 userId。
7. 主播端调用startPlay即可看到连麦观众的画面。

// 观众端：
// 1.观众端发起连麦请求
mliveRoom.requestJoinAnchor(reason: mSelfUserId + "请求和您连麦", responseCallback: { [weak self] (agreed, reason) in 
 // 4.主播接受了观众的请求
   if agreed {
        // 5.观众启动预览，开启推流
        self?.mliveRoom.startCameraPreview(frontCamera: true, view: localView, callback: nil)
        self?.mliveRoom.startPublish(streamID: streamID, callback: nil)
   }        
}, callback: callback)
// 主播端：
// 2.主播端收到连麦请求
public func trtcLiveRoom(_ trtcLiveRoom: TRTCLiveRoom, onRequestJoinAnchor user: TRTCLiveUserInfo, reason: String?, timeout: Double) {
// 3.同意对方的连麦请求
mliveRoom.responseJoinAnchor(userID: userID, agree: true, reason: "同意连麦")
}
// 6.主播收到连麦观众的上麦通知
public func trtcLiveRoom(_ trtcLiveRoom: TRTCLiveRoom, onAnchorEnter userID: String) {
// 7.主播播放观众画面
mliveRoom.startPlay(userID: userID, view: view, callback: nil)
}

步骤8：主播与主播 PK

1. 主播 A 调用requestRoomPK向主播 B 发起 PK 请求。
2. 主播 B 会收到TRTCLiveRoomDelegate onRequestRoomPK回调通知。
3. 主播 B 调用responseRoomPK决定是否接受主播 A 的 PK 请求。
4. 主播 B 接受主播 A 的请求，等待TRTCLiveRoomDelegate onAnchorEnter通知，调用startPlay显示主播 A。
5. 主播 A 收到responseCallback回调通知，PK 请求是否被同意。
6. 主播 A 请求被同意，等待TRTCLiveRoomDelegate onAnchorEnter通知，调用startPlay显示主播 B。

// 主播 A:
// 主播 A 创建12345的房间
mLiveRoom.createRoom(roomID: 12345, roomParam: param, callback: nil)
// 1.主播 A 向主播 B 发起 PK 请求
mLiveRoom.requestRoomPK(roomID: 54321, userID: "B", responseCallback: { (agree, reason) in
// 5.收到是否同意的回调
if agree {
}       
}, callback: callback)
// 主播 A 收到主播 B 进入回调
public func trtcLiveRoom(_ trtcLiveRoom: TRTCLiveRoom, onAnchorEnter userID: String) {
// 6.收到 B 进房的通知，播放 B 的画面
mLiveRoom.startPlay(userID: userID, view: view, callback: callback)
}
// 主播 B：
// 主播 B 创建54321的房间
mLiveRoom.createRoom(roomID: 54321, roomParam: param, callback: nil)
// 2.主播 B 收到主播 A 的消息
public func trtcLiveRoom(_ trtcLiveRoom: TRTCLiveRoom, onRequestRoomPK user: TRTCLiveUserInfo, timeout: Double) {
// 3.主播 B 回复主播 A 接受请求
mLiveRoom.responseRoomPK(userID: userID, agree: true, reason: reason)
}
public func trtcLiveRoom(_ trtcLiveRoom: TRTCLiveRoom, onAnchorEnter userID: String) {
// 4.主播 B 收到主播 A 进房的通知，播放主播 A 的画面
mLiveRoom.startPlay(userID: userID, view: view, callback: callback)
}

步骤9：实现文字聊天和弹幕消息

• 通过sendRoomTextMsg可以发送普通的文本消息，所有在该房间内的主播和观众均可以收到onRecvRoomTextMsg回调。
  即时通信 IM 后台有默认的敏感词过滤规则，被判定为敏感词的文本消息不会被云端转发。

  // 发送端：发送文本消息
  mLiveRoom.sendRoomTextMsg(message: "Hello Word!", callback: callback)
  // 接收端：监听文本消息
  mLiveRoom.delegate = self
  public func trtcLiveRoom(_ trtcLiveRoom: TRTCLiveRoom, onRecvRoomTextMsg message: String, fromUser user: TRTCLiveUserInfo) {
  debugPrint("收到来自\(user.userName)的文本消息:\(message)")
  }

• 通过sendRoomCustomMsg可以发送自定义（信令）的消息，所有在该房间内的主播和观众均可以收到onRecvRoomCustomMsg回调。
  自定义消息常用于传输自定义信令，例如用于点赞消息的发送和广播。

  // 发送端：您可以通过自定义Cmd来区分弹幕和点赞消息
  // eg:"CMD_DANMU"表示弹幕消息，"CMD_LIKE"表示点赞消息
  mLiveRoom.sendRoomCustomMsg(command: "CMD_DANMU", message: "Hello world", callback: nil)
  mLiveRoom.sendRoomCustomMsg(command: "CMD_LIKE", message: "", callback: nil)
  // 接收端：监听自定义消息
  mLiveRoom.delegate = self
  public func trtcLiveRoom(_ trtcLiveRoom: TRTCLiveRoom, onRecvRoomCustomMsg command: String, message: String, fromUser user: TRTCLiveUserInfo) {
  if "CMD_DANMU" == command {
    // 收到弹幕消息
    debugPrint("收到来自\(user.userName)的弹幕消息:\(message)")
  } else if "CMD_LIKE" == command {
    // 收到点赞消息
    debugPrint("\(user.userName)给您点了个赞！")
  }
  }