> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-agent-native-development.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Join Session

> Join CometChat Calls SDK v5 sessions on JavaScript with session IDs, call tokens, participant setup, and in-call UI launch.

Join a call session using one of two approaches: the quick start method with a session ID, or the advanced flow with manual token generation for more control.

## Overview

The CometChat Calls SDK provides two ways to join a session:

| Approach | Best For | Complexity |
| - | - | - |
| **Join with Token** | Most use cases - recommended approach | Low - Two-step process |
| **Generate Token Separately** | Custom token management, pre-generation, caching | Medium - Separate token handling |

<Note>
  Both approaches require a container element in your HTML where the call interface will be rendered.
</Note>

## Container Setup

Add a container element to your HTML where the call interface will be rendered:

```html theme={null}
<div id="call-container" style="width: 100%; height: 100vh;"></div>
```

The call UI will be dynamically rendered inside this container when you join the session.

## Generate Token

Generate a call token for the session. Each token is unique to a specific session and user combination.

```javascript theme={null}
const sessionId = "SESSION_ID";

try {
  const result = await CometChatCalls.generateToken(sessionId);
  console.log("Token generated:", result.token);
  // Use the token to join the session
} catch (error) {
  console.error("Token generation failed:", error.errorDescription);
}
```

| Parameter | Type | Description |
| - | - | - |
| `sessionId` | String | Unique identifier for the call session |

The method returns an object with:

| Property | Type | Description |
| - | - | - |
| `token` | String | The generated call token |

<Note>
  The `generateToken()` method uses the auth token of the currently logged-in user. Ensure a user is logged in before calling this method.
</Note>

## Join Session

Use the generated token to join the session along with your call settings and container element.

```javascript theme={null}
const container = document.getElementById("call-container");

const callSettings = {
  sessionType: "VIDEO",
  layout: "TILE",
  startAudioMuted: false,
  startVideoPaused: false,
};

const result = await CometChatCalls.joinSession(callToken, callSettings, container);

if (result.error) {
  console.error("Failed to join session:", result.error);
} else {
  console.log("Joined session successfully");
}
```

| Parameter | Type | Description |
| - | - | - |
| `callToken` | String | Previously generated call token |
| `callSettings` | Object | Configuration for the session (see [Session Settings](/calls/javascript/session-settings)) |
| `container` | HTMLElement | Container element for the call UI |

The method returns an object with:

| Property | Type | Description |
| - | - | - |
| `data` | undefined | Undefined on success |
| `error` | Object \| null | Error details if join failed |

## Complete Example

```javascript theme={null}
const sessionId = "SESSION_ID";
const container = document.getElementById("call-container");

// Step 1: Generate token
try {
  const tokenResult = await CometChatCalls.generateToken(sessionId);
  
  // Step 2: Configure session settings
  const callSettings = {
    sessionType: "VIDEO",
    layout: "TILE",
    startAudioMuted: false,
    startVideoPaused: false,
  };

  // Step 3: Join session
  const joinResult = await CometChatCalls.joinSession(
    tokenResult.token, 
    callSettings, 
    container
  );

  if (joinResult.error) {
    console.error("Failed to join session:", joinResult.error);
  } else {
    console.log("Joined session successfully");
  }
} catch (error) {
  console.error("Error:", error);
}
```

<Note>
  All participants joining the same call must use the same session ID.
</Note>

## One Session at a Time

`CometChatCalls` is a singleton that holds a single active session. Joining a second session while one is in progress is not supported - leave the current session first, wait for `onSessionLeft`, then join the next one.

```javascript theme={null}
CometChatCalls.addEventListener("onSessionLeft", async () => {
  const { token } = await CometChatCalls.generateToken(nextSessionId);
  await CometChatCalls.joinSession(token, callSettings, container);
});

CometChatCalls.leaveSession();
```

This is also why `leaveSession()` and the other [actions](/calls/javascript/actions) take no session ID - they always apply to the session that is currently active. See [Single Active Session](/calls/javascript/overview#single-active-session) for the full behavior.

## Error Handling

Common errors when joining a session:

| Error Code | Description |
| - | - |
| `ERROR_SDK_NOT_INITIALIZED` | SDK not initialized - call `init()` first |
| `ERROR_AUTH_TOKEN_MISSING` | User not logged in or auth token invalid |
| `ERROR_SESSION_ID_MISSING` | Session ID is null or empty |
| `VALIDATION_ERROR` | Invalid call settings |


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.