Live SDKs JavaScript v1
Live SDKs JavaScript
Live SDKs
JavaScript
Version 1

Start your first live

Copy link

Sendbird Live SDK for JavaScript offers a variety of functionalities for hosting and watching live events. As a live event's host, a user can create, share their media stream, and use the chat to communicate with other users watching the live event. Users can enter a live event as participants to watch the live event and use the chat to communicate with the live event's host as well as other users.


Requirements

Copy link

The minimum requirements for the Live SDK for JavaScript are:

  • Node
  • npm or yarn
  • WebRTC API supported browsers

Before you start

Copy link

Sendbird Live SDK provides live streaming feature and uses open channels from Sendbird Chat SDK for chat. Installing Sendbird Live SDK will automatically install the Chat SDK as well.

Before installing the Live SDK, create a Sendbird account to acquire an application ID which you will need to initialize the Live SDK. Go to Sendbird Dashboard and create an application by selecting Calls+Live in product type. Once you've created an application, go to Overview and you will see the Application ID.


Get started

Copy link

You can start building your a live event by installing the Live SDK first.

Step 1 Install the Live SDK

Copy link

You can install the Live SDK for JavaScript through npm in your node project directory root as below.

npm install @sendbird/live

Or you can install the Live SDK for JavaScript using yarn.

yarn add @sendbird/live

Step 2 Initialize the SendbirdLiveSDK instance

Copy link

To integrate the Live SDK in the client app, you need to first initialize the SendbirdLive instance using the SendbirdLive.init() method. Initialization requires your Sendbird application's Application ID, which can be found on the Sendbird Dashboard.

import { SendbirdLive } from '@sendbird/live';

SendbirdLive.init({ appId: APP_ID });

Note: The SendbirdLive.init() method must be called across the client app at least once. It is recommended to initialize the Live SDK when you first connect to your web app.

Step 3 Authenticate a user

Copy link

To start or enter a live streaming, you need to authenticate a user with the Sendbird server using their user ID through the authenticate() method.

try {
  await SendbirdLive.authenticate(USER_ID, ACCESS_TOKEN);
  // The user has been authenticated successfully and is connected to Sendbird server.
} catch (e) {
  // authentication failed.
}

Authenticating a user with the Live SDK will also authenticate the user in the Chat SDK. After authenticating the user, you can start or watch live events.

Step 4 Create a live event

Copy link

A live event can be created using the SendbirdLive.createLiveEvent() method, and configure information about the live event through the LiveEventCreateParams instance.

try {
  await SendbirdLive.createLiveEvent({
    userIdsForHost: [USER_ID],
    title: TITLE,
    COVER_URL: COVER_URL,
    CUSTOM_ITEMS: CUSTOM_ITEMS,
  });
} catch (e) {
  // failed to create live event
}

Step 5 Start your first live

Copy link

When a live event is created, you can choose to enter as a host or a participant.

try {
  await liveEvent.enterAsHost({
    turnAudioOn: true,
    turnVideoOn: true,
  });
} catch (e) {
  // failed to enter as a host
}

If you've entered as a host, you can start the live event by making the following call.

try {
  await liveEvent.startEvent();
  // The LiveEvent has started. Participants can now view the host's video.
} catch (e) {
  // failed to start the event
}

Step 6 Watch your first live

Copy link

When a host and participants enter the live event, you can stream the first live event for participants to watch with Sendbird Live. The host and participants also can actively engage in the live event by chatting with each other.

try {
  await liveEvent.enter();
} catch (e) {
  // failed to enter
}