This article demonstrates how to implement a breakout room solution for the Video SDK for Web. Similar to Zoom Meetings, a participant can only be in one Video SDK session at a time, but you can bounce back and forth between sessions.

On this page#

• Initialize the SDK
• Join the main session
• Join the breakout session
• Return to the main session
• List sessions and participants

Initialize the SDK#

The first step to building a breakout room flow is to initialize the SDK. You only have to do this once.

client.init('US-en', 'CDN')

Join the main session#

Join the main session.

function joinMainSession() {
    client.join(topic, signature, userName, password)
}

Join the breakout session#

When the time comes to hop into the breakout room, display a button that says join breakout room or similar. Once clicked, leave the main session, and join the breakout session.

function joinBreakoutSession() {
    client.leave()
    client.join(topic, signature, userName, password)
}

If there is no participant in the main session, it will close after a session timeout. You can still rejoin it, but getChatHistory will not return the previous messages. Alternatively, you can disable the session timeout by modifying the sessionIdleTimeoutMins. See the Reference for details. If a participant remains in the main session, it will not close, so getChatHistory will still be available.

As a best practice, you should regenerate the signature each time you join a session.

Return to the main session#

To return to the main session, leave the breakout session and join the main session:

function rejoinMainSession() {
    client.leave()
    client.join(topic, signature, userName, password)
}

List sessions and participants#

With the APIs, you can display the session information and participants. This is useful for listing the breakout sessions and the members of each session.

GET Sessions#

Endpoint: GET https://api.zoom.us/v2/videosdk/sessions

Request Header:

{
    "Authorization": "Bearer {{VIDEOSDK_JWT_TOKEN}}"
}

Response Body:

{
    "from": "2019-08-24",
    "to": "2019-08-24",
    "page_size": 30,
    "next_page_token": "suQA5LvDBnH5No5OYD7mqpJuFzJqUOHK8U2",
    "sessions": [
        {
        "id": "sfk/aOFJSJSYhGwk1hnxgw==",
        "session_name": "Main Session",
        "start_time": "2022-08-24T12:15:22Z",
        "end_time": "2022-08-24T14:15:22Z",
        "duration": "30:00",
        "user_count": 10,
        "has_voip": true,
        "has_video": true,
        "has_screen_share": true,
        "has_recording": true,
        "has_pstn": true,
        "session_key": "abc123"
        },
        {
        "id": "asdftFJSJSYhGwk1hnxgw==",
        "session_name": "JavaScript",
        "start_time": "2022-08-24T12:15:22Z",
        "end_time": "2022-08-24T14:15:22Z",
        "duration": "30:00",
        "user_count": 12,
        "has_voip": true,
        "has_video": true,
        "has_screen_share": true,
        "has_recording": true,
        "has_pstn": true,
        "session_key": "def456"
        }
        // ...
    ]
}

Get session participants#

To get session participants, send a GET request to the session /users endpoint.

Endpoint: GET https://api.zoom.us/v2/videosdk/sessions/{sessionId}/users

Request Header:

{
    "Authorization": "Bearer {{VIDEOSDK_JWT_TOKEN}}"
}

Response Body:

{
    "page_size": 12,
    "next_page_token": "suQA5LvDBnH5No5OYD7mqpJuFzJqUOHK8U2",
    "users": [
        {
            "id": "32dsfsd4g5gd",
            "name": "exampleuser",
            "device": "Windows",
            "ip_address": "127.0.0.1",
            "location": "New York",
            "network_type": "Wifi",
            "microphone": "Plantronics BT600",
            "speaker": "Plantronics BT600",
            "camera": "FaceTime HD Camera",
            "data_center": "SC",
            "connection_type": "P2P",
            "join_time": "2022-08-24T12:15:22Z",
            "leave_time": "2022-08-24T14:15:22Z",
            "user_key": "myUserKey"
        }
    // ...
    ]
}

Session webhooks#

You can also receive webhook notifications when session or participant actions occur, for example, when the session starts or ends, a participant joins or leaves the session and more. Webhooks are POST requests to your server with JSON payloads. They are useful for keeping your user interface of session lists and participant information updated automatically, instead of repeatedly calling the Video SDK APIs.

Here is an example payload when a participant joins a session.

{
    "event": "string",
    "event_ts": "integer [int64]",
    "payload": {
    "account_id": "string",
    "object": {
        "id": "string",
        "user": {
        "id": "string",
        "name": "string",
        "join_time": "string [date-time]"
        }
    }
    }
}

For more information, see the full Video SDK API and webhook references.