Tutorial: Interactive Live Streaming

Interactive Live Streaming

Function Description

This article mainly introduces how to implement the audio and video call function of the interconnection live broadcast scene.

Anchor

The process of implementing audio and video calls on the anchor side is basically the same as the implementation process of the TRTC.TYPE.SCENE_RTC scene. Refer to: Start integrating audio and video calls.

The main difference is the screne and role parameters set when entering the room. Refer to the following sample code:

await trtc.enterRoom({ sdkAppId, userId, userSig, roomId, scene: TRTC.TYPE.SCENE_LIVE, role: TRTC.TYPE.ROLE_ANCHOR });

Audience

Enter the room as an audience

Set the role parameter to TRTC.TYPE.ROLE_AUDIENCE.

await trtc.enterRoom({ roomId, sdkAppId, userId, userSig, scene: TRTC.TYPE.SCENE_LIVE, role: TRTC.TYPE.ROLE_AUDIENCE })

Play remote audio

By default, the SDK will automatically play remote audio, and you do not need to call the API to play remote audio.

Play remote video

Listen to the TRTC.EVENT.REMOTE_VIDEO_AVAILABLE event before entering the room. When you receive this event, play the remote video stream through trtc.startRemoteVideo().

trtc.on(TRTC.EVENT.REMOTE_VIDEO_AVAILABLE, ({ userId, streamType }) => {
  // To play the video, you need to place an HTMLElement in the DOM, which can be a div tag, assuming its id is `${userId}_${streamType}`
  const view = `${userId}_${streamType}`;
  trtc.startRemoteVideo({ userId, streamType, view });
});

Connect with the anchor for interaction

The audience role does not have the permission to publish audio and video, so if the audience wants to interact with the anchor, they need to switch to the anchor role using switchRole and then publish audio and video streams.

// Switch to the anchor to go on the air
await trtc.switchRole(TRTC.TYPE.ROLE_ANCHOR);
// Turn on the microphone after going on the air
await trtc.startLocalAudio();
// Turn on the camera after going on the air
await trtc.startLocalVideo();
// After the interaction is over, call exitRoom to exit the room and end the interaction.
await trtc.exitRoom();