Join Live Stream - JavaScript

Once, the live stream is configured, the next step is to join it. With our JS SDK, you can call the join() method. If you have not initialized the live stream yet, you can follow the guide here.

note

This page uses the following asynchronous methods. Refer to their API reference for the errors each Promise may reject with, and handle these rejections appropriately based on your use case.

• join()
• leave()

join()

• To join the live stream you can call the join() method wmethod on the created liveStream object.
• This method can be invoked after the ive stream is initialized using the initMeeting method.

Events associated with the join() method

Following events are received when a participant successfully joins the livestream.

• The Local Participant will receive the meeting-joined event, when the live stream is successfully joined.
• All the Remote Participants—including all the hosts and audience members—will receive the participant-joined event with the newly joined Participant object from the event callback.

let liveStream;

// Initialize Meeting
liveStream = VideoSDK.initMeeting({
  // ...
});

const joinBtn = document.getElementById("joinBtn");

joinBtn.addEventListener("click", async () => {
  // Joining Meeting
  try {
    await liveStream?.join();
  } catch (err) {
    console.error("join failed:", err);
  }
});

liveStream.on("meeting-joined", () => {
  console.log("liveStream Joined Successfully");
});

liveStream.on("participant-joined", (participant) => {
  console.log("New Participant Joined: ", participant.id);
});

leave()

• To leave the live stream you can call the leave() method on the created liveStream object.

note

This method can be called only after the live stream is joined successfully.

Events associated with the leave() method

Following callbacks are received when a participant leaves the live stream.

• The Local Participant will receive the meeting-left event, once they have successfully left the livestream.
• All the Remote Participants—including all the hosts and audience members—will receive the participant-left event with the Participant object of the user who left the livestream.

let liveStream;

// Initialize Meeting
liveStream = VideoSDK.initMeeting({
  // ...
});

const leaveBtn = document.getElementById("leaveBtn");

leaveBtn.addEventListener("click", async () => {
  try {
    await liveStream?.leave();
  } catch (err) {
    console.error("leave failed:", err);
  }
});

liveStream.on("meeting-left", () => {
  console.log("liveStream left Successfully");
});

liveStream.on("participant-left", (participant) => {
  console.log("Participant left: ", participant.id);
});

API Reference

The API references for all the methods and events utilized in this guide are provided below.

• join()
• meeting-joined event
• participant-joined event
• leave()
• meeting-left event
• participant-left event