이 페이지는 현재 영어로만 제공되며 한국어 버전은 곧 제공될 예정입니다. 기다려 주셔서 감사드립니다.
Watch a live

This document primarily introduces how to use the RoomEngine SDK to watch a live stream.
Prerequisites
Before using the RoomEngine SDK, you need to login to the SDK so that the feature works normally.
Pulling Live Stream List
You can call the TUILiveListManager plug-in's fetchLiveList API to obtain the current live streaming room list, and then select preview or join to watch. This API uses paged pull to return data and requires both parameters below:
cursor: The paged pull cursor. Pass an empty string for the first call, and use the nextCursor value returned from the previous call for subsequent calls.
count: It is recommended to set the number of items per pagination request to 20.
Swift
Java
Web
import RTCRoomEngine
﻿
guard let liveListManager = TUIRoomEngine.sharedInstance().getExtension(extensionType: .liveListManager) as? TUILiveListManager else {
    return
}
﻿
let cursor = ""  // Paged pull cursor. Pass an empty string for the first call, and use the nextCursor returned from the previous call for subsequent calls.
let count = 20   // Recommend pulling 20 records per paged pull
﻿
liveListManager.fetchLiveList(cursor: cursor, count: count) { nextCursor, liveInfoList in
    // Pull live room list successfully
    // nextCursor: continued pulling cursor
    // liveInfoList: live room list
} onError: { code, message in
    // Pull live room list failed
}
String cursor = "";     // Paged pull cursor. Pass an empty string for the first call, and use the nextCursor (result.cursor) returned from the previous call for subsequent calls.
int count = 20;         // Recommend pulling 20 records per paged pull
﻿
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) {
        // Pull live room list successfully
        // result.cursor: continued pulling cursor
        // result.liveInfoList: live room list
    }
    @Override
    public void onError(TUICommonDefine.Error error, String message) {
        // Pull live room list failed
    }
});
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 !== '');
});
Previewing Live Streaming Room Visuals
After obtaining the live room list, you can preview the live stream before joining, then select the room you're interested in and officially enter.
Start Preview
To preview the live streaming room visuals, you can call the TUILiveListManager plug-in's startPreloadVideoStream API. This API requires the following 3 parameters:
roomId: You can directly find the roomId from the obtained live room list.
isMuteAudio: Whether to mute. Normally, audio playback is turned off when previewing live streaming room visuals. It is recommended to set this to true.
videoView: Create the video preview control in advance and add it to the interface, completing the layout settings at the same time.
Swift
Java
Web
import RTCRoomEngine
﻿
guard let liveListManager = TUIRoomEngine.sharedInstance().getExtension(extensionType: .liveListManager) as? TUILiveListManager else {
    return
}
﻿
let roomId = "video_100001"  // replace with your own room ID
let muteAudio = true  // Normally, audio playback is turned off when previewing live streaming room visuals. It is recommended to set this to true.
﻿
let preloadVideoView = UIView()     
// ...add preloadVideoView to your view and perform layout
﻿
liveListManager.startPreloadVideoStream(roomId: roomId, isMuteAudio: muteAudio, view: preloadVideoView) { roomId in
    // Start preview playback
} onLoading: { roomId in
} onError: { roomId, code, message in
    // preview failed
}
String roomId = "video_100001";  // replace with your own room ID
boolean muteAudio = true;  // Normally, audio playback is turned off when previewing live streaming room visuals. It is recommended to set this to true.
﻿
TUIVideoView preloadVideoView = new TUIVideoView(context);
// ...add preloadVideoView to your view and perform layout
﻿
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) {
        // Start preview playback
    }
    @Override
    public void onLoading(String roomId) {
    }
    @Override
    public void onPlayError(String roomId, TUICommonDefine.Error error, String message) {
        // preview failed
    }
});
const roomEngine = new TUIRoomEngine();
const liveListManager = roomEngine.getLiveListManager();
await liveListManaer.startPreloadVideoStream({
  roomId: 'video_100001',
  isMuteAudio: true,
  view: 'remote_preview_camera'  // view is the id of the div element for remote user stream playback
});
Closing Preview 
You can call the TUILiveListManager plug-in's stopPreloadVideoStream and input the live streaming room ID to end the screen preview.
Swift
Java
Web
import RTCRoomEngine
﻿
guard let liveListManager = TUIRoomEngine.sharedInstance().getExtension(extensionType: .liveListManager) as? TUILiveListManager else {
    return
}
﻿
let roomId = "video_100001"  // replace with your own room ID
liveListManager.stopPreloadVideoStream(roomId);
String roomId = "video_100001";  // replace with your own room 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: 'video_100001' });
Entering Live Room
Call the TUILiveListManager plug-in's joinLive API and input the live streaming room ID to join the room. After joining successfully, call the TUIRoomEngine's muteRemoteAudioStream API to enable audio playback.
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
    // Successfully joined the live room
    let sdkAppId = "xxxx"                                       // Replace with your own APP's sdkAppID
    let userId = "livekit_" + sdkAppId + "_feedback_" + roomId  // Fixed format: "livekit_sdkAppId_feedback_roomId"
    TUIRoomEngine.sharedInstance().muteRemoteAudioStream(userId, isMute: false)
}, onError: { code, message in
    // Failed to join the live room
})
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) {
        // Successfully joined the live room
        String sdkAppId = "xxxx";                                     // Replace with your own APP's sdkAppID
        String userId = "livekit_" + sdkAppId + "_feedback_" + roomId; // Fixed format: "livekit_sdkAppId_feedback_roomId"
        TUIRoomEngine.sharedInstance().muteRemoteAudioStream(userId, false);
    }
﻿
    @Override
    public void onError(TUICommonDefine.Error error, String message) {
        // Failed to join the live room
    }
});
TUIRoomEngine.once('ready', () => {
  const roomEngine = new TUIRoomEngine();
  const liveListManager = roomEngine.getLiveListManager();
  const roomId = 'live_room';
  await liveListManager.joinLive(roomId);
  const sdkAppId = "xxxx";  // Replace with your own APP's sdkAppID
  const userId = "livekit_" + sdkAppId + "_feedback_" + roomId;
  await roomEngine.muteRemoteAudioStream({userId: userId, isMute: false }) 
});
Note:
If audio playback is enabled when previewing the live room, no need to call muteRemoteAudioStream again after successfully joining the live streaming room.
Call muteRemoteAudioStream. The first parameter userId format is livekit_sdkAppId_feedback_roomId. Among them, sdkAppId should be replaced with your current application's SDK AppID, and roomId is the room ID of the present live streaming room.
Exiting Live Streaming Room
You can call the TUILiveListManager plug-in's leaveLive API and input the live streaming room ID to leave the room and stop watching.
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();
});
﻿