文档概览/

观看一场直播

本文档主要介绍如何使用 RoomEngine SDK 观看一场直播。

前提条件

在使用 RoomEngine SDK 前，您需要先登录 SDK，以便后续功能正常使用。

拉取直播列表

您可以调用 TUILiveListManager 插件的 fetchLiveList 接口获取当前直播间的列表，然后选择预览或加入观看。该接口采用分页拉取的方式返回数据，需要传递以下两个参数：
cursor：分页拉取游标，首次调用请传递空字符串，后续调用请使用前一次返回的 nextCursor 值。
count：建议将每次分页请求的条数设置为20。
Swift
Java
Web
import RTCRoomEngine

guard let liveListManager = TUIRoomEngine.sharedInstance().getExtension(extensionType: .liveListManager) as? TUILiveListManager else {
    return
}

let cursor = ""  // 分页拉取游标，首次调用请传递空字符串，后续调用请使用前一次返回的 nextCursor
let count = 20   // 推荐每次分页拉取 20 条记录

liveListManager.fetchLiveList(cursor: cursor, count: count) { nextCursor, liveInfoList in
    // 拉取直播间列表成功
    // nextCursor：续拉游标
    // liveInfoList：直播间列表
} onError: { code, message in
    // 拉取直播间列表失败
}
String cursor = "";     // 分页拉取游标，首次调用请传递空字符串，后续调用请使用前一次返回的 nextCursor，即 result.cursor
int count = 20;         // 推荐每次分页拉取 20 条记录

TUILiveListManager liveListManager = (TUILiveListManager)TUIRoomEngine.sharedInstance().getExtension(TUICommonDefine.ExtensionType.LIVE_LIST_MANAGER);
liveListManager.fetchLiveList(cursor, count, new TUILiveListManager.LiveInfoListCallback() {
    @Override
    public void onSuccess(TUILiveListManager.LiveInfoListResult result) {
        // 拉取直播间列表成功
        // result.cursor：续拉游标
        // result.liveInfoList：直播间列表
    }
    @Override
    public void onError(TUICommonDefine.Error error, String message) {
        // 拉取直播间列表失败
    }
});
TUIRoomEngine.once('ready', () => {
  const roomEngine = new TUIRoomEngine();
  const liveListManager = roomEngine.getLiveListManager();
  const liveList = [];
  let cursor = '';
  let count = 20;
  let result;
  do {
    result = await liveListManager.fetchLiveList({ cursor, count });
    liveList.push(...result.liveInfoList);
    cursor = result.cursor;
  } while(cursor !== '');
});

预览直播间画面

在获取直播间列表后，您可以在加入前预览直播画面，选择感兴趣的直播间后再正式进入。

开始预览

要预览直播间画面，可以调用 TUILiveListManager 插件的 startPreloadVideoStream 接口，该接口需要传递以下 3 个参数：
roomId：您可以直接从获取的直播间列表中找到直播间 roomId。
isMuteAudio：是否静音，预览直播间画面时，通常关闭音频播放，建议您设置为 true。
videoView: 请提前创建视频预览控件，并将其添加到界面中，同时完成布局设置。
Swift
Java
Web
import RTCRoomEngine

guard let liveListManager = TUIRoomEngine.sharedInstance().getExtension(extensionType: .liveListManager) as? TUILiveListManager else {
    return
}

let roomId = "video_100001"  // 请替换成您自己的房间 ID
let muteAudio = true         // 预览直播间画面时，通常关闭音频播放，建议您设置为 true

let preloadVideoView = UIView()     
// ...将 preloadVideoView 添加到您的视图上并对其进行布局

liveListManager.startPreloadVideoStream(roomId: roomId, isMuteAudio: muteAudio, view: preloadVideoView) { roomId in
    // 开始预览播放
} onLoading: { roomId in
} onError: { roomId, code, message in
    // 预览失败
}
String roomId = "video_100001";  // 请替换成您自己的房间 ID
boolean muteAudio = true;        // 预览直播间画面时，通常关闭音频播放，建议您设置为 true

TUIVideoView preloadVideoView = new TUIVideoView(context);
// ...将 preloadVideoView 添加到您的视图上并对其进行布局

TUILiveListManager liveListManager = (TUILiveListManager)TUIRoomEngine.sharedInstance().getExtension(TUICommonDefine.ExtensionType.LIVE_LIST_MANAGER);
liveListManager.startPreloadVideoStream(roomId, muteAudio, preloadVideoView, new TUIRoomDefine.PlayCallback() {
    @Override
    public void onPlaying(String roomId) {
        // 开始预览播放
    }
    @Override
    public void onLoading(String roomId) {
    }
    @Override
    public void onPlayError(String roomId, TUICommonDefine.Error error, String message) {
        // 预览失败
    }
});
const roomEngine = new TUIRoomEngine();
const liveListManager = roomEngine.getLiveListManager();
await liveListManaer.startPreloadVideoStream({
  roomId: 'roomId',
  isMuteAudio: true,
  view: 'remote_preview_camera'  // view 为播放远端用户流的 div 元素的 id
});

关闭预览

您可以调用 TUILiveListManager 插件的 stopPreloadVideoStream 并传入直播间 ID 来结束直播间画面预览。
Swift
Java
Web
import RTCRoomEngine

guard let liveListManager = TUIRoomEngine.sharedInstance().getExtension(extensionType: .liveListManager) as? TUILiveListManager else {
    return
}

let roomId = "video_100001"  // 请替换成您自己的房间 ID
liveListManager.stopPreloadVideoStream(roomId);
String roomId = "video_100001";  // 请替换成您自己的房间 ID

TUILiveListManager liveListManager = (TUILiveListManager)TUIRoomEngine.sharedInstance().getExtension(TUICommonDefine.ExtensionType.LIVE_LIST_MANAGER);
liveListManager.stopPreloadVideoStream(roomId);
const roomEngine = new TUIRoomEngine();
const liveListManager = roomEngine.getLiveListManager();
await liveListManager.stopPreloadVideoStream({ roomId: 'roomId' });

进入直播间

请调用 TUILiveListManager插件的 joinLive接口并传入直播间 ID 加入直播间。加入成功后，请调用 TUIRoomEngine 的 muteRemoteAudioStream 接口开启主播音频播放。
Swift
Java
Web
import RTCRoomEngine

let roomId = "video_100001"

guard let liveListManager = TUIRoomEngine.sharedInstance().getExtension(extensionType: .liveListManager) as? TUILiveListManager else {
    return
}
        
liveListManager.joinLive(roomId: roomId, onSuccess: { liveInfo in
    // 加入直播间成功
    let sdkAppId = "xxxx"                                       // 请替换成您自己 APP 的 sdkAppID
    let userId = "livekit_" + sdkAppId + "_feedback_" + roomId  // 固定格式："livekit_sdkAppId_feedback_roomId"
    TUIRoomEngine.sharedInstance().muteRemoteAudioStream(userId, isMute: false)
}, onError: { code, message in
    // 加入直播间失败
})
String roomId = "video_100001";

TUILiveListManager liveListManager = (TUILiveListManager)TUIRoomEngine.sharedInstance().getExtension(TUICommonDefine.ExtensionType.LIVE_LIST_MANAGER);
liveListManager.joinLive(roomId , new TUILiveListManager.LiveInfoCallback() {
    @Override
    public void onSuccess(TUILiveListManager.LiveInfo liveInfo) {
        // 加入直播间成功，
        String sdkAppId = "xxxx";                                     // 请替换成您自己 APP 的 sdkAppID
        String userId = "livekit_" + sdkAppId + "_feedback_" + roomId;// 固定格式："livekit_sdkAppId_feedback_roomId"
        TUIRoomEngine.sharedInstance().muteRemoteAudioStream(userId, false);
    }

    @Override
    public void onError(TUICommonDefine.Error error, String message) {
        // 加入直播间失败
    }
});
TUIRoomEngine.once('ready', () => {
  const roomEngine = new TUIRoomEngine();
  const liveListManager = roomEngine.getLiveListManager();
  const roomId = 'live_room';
  await liveListManager.joinLive(roomId);
  const sdkAppId = "xxxx";  // 请替换成您自己 APP 的 sdkAppID
  const userId = "livekit_" + sdkAppId + "_feedback_" + roomId;
  await roomEngine.muteRemoteAudioStream({userId: userId, isMute: false }) 
});
注意：
如果您在预览直播间时已开启音频播放，加入直播间成功后无需再次调用 muteRemoteAudioStream。
调用 muteRemoteAudioStream时，第一个参数 userId的格式为 livekit_sdkAppId_feedback_roomId，其中 sdkAppId 需替换为您当前应用的 SDKAppID，roomId为当前直播间的房间 ID。

离开直播间

您可以通过调用 TUILiveListManager 插件的 leaveLive 接口，传入直播间 ID 来离开直播间并结束观看。
Swift
Java
Web
import RTCRoomEngine

guard let liveListManager = TUIRoomEngine.sharedInstance().getExtension(extensionType: .liveListManager) as? TUILiveListManager else {
    return
}
        
liveListManager.leaveLive { TUILiveStatisticsData in
    print("success")   
} onError: { code, message  in
    print("failure, code:\(code), message:\(message)")      
}
TUILiveListManager liveListManager = (TUILiveListManager)TUIRoomEngine.sharedInstance().getExtension(TUICommonDefine.ExtensionType.LIVE_LIST_MANAGER);
liveListManager.leaveLive(new TUILiveListManager.StopLiveCallback() {
    @Override
    public void onSuccess(TUILiveListManager.LiveStatisticsData statisticData) {
        Log.i("sdk", "success");
    }

    @Override
    public void onError(TUICommonDefine.Error error, String message) {
        Log.i("sdk", "failure code:" + error + ",message:" + message);
    }
});
TUIRoomEngine.once('ready', () => {
  const roomEngine = new TUIRoomEngine();
  const liveListManager = roomEngine.getLiveListManager();
  await liveListManager.leaveLive();
});

WebRTC Trtc Logo
Copyright © 2013-2025 Tencent RTC. All Rights Reserved.
  1. 隐私条款
  3. 法律
  5. Cookie政策
  7. 腾讯云