Faster Integration with UI KitsIf you’re using CometChat UI Kits, voice and video calling can be quickly integrated:
- Incoming & outgoing call screens
- Call buttons with one-tap calling
- Call logs with history
Prerequisites
Before integrating the Calls SDK, ensure you have:- CometChat Account: Sign up and create an app to get your App ID, Region, and API Key
- CometChat Users: Users must exist in CometChat to use calling features. For testing, create users via the Dashboard or REST API. Authentication is handled by the Calls SDK - see Authentication
- Browser Requirements: See Browser Compatibility below
- Permissions: Camera and microphone permissions for video/audio calls
Browser Compatibility
The Calls SDK requires a modern browser with WebRTC support:| Browser | Minimum Version | Notes |
|---|---|---|
| Chrome | 72+ | Full support |
| Firefox | 68+ | Full support |
| Safari | 12.1+ | Full support |
| Edge | 79+ | Chromium-based |
| Opera | 60+ | Full support |
| Samsung Internet | 12+ | Full support |
Requirements
- HTTPS: Required for camera/microphone access in production. Localhost is exempt during development.
- WebRTC: The browser must support WebRTC APIs (
getUserMedia,RTCPeerConnection) - JavaScript: ES6+ support required
Mobile Browsers
| Browser | Support |
|---|---|
| Chrome for Android | ✅ Full support |
| Safari for iOS | ✅ iOS 12.1+ |
| Firefox for Android | ✅ Full support |
| Samsung Internet | ✅ Full support |
Framework Integrations
Get started quickly with framework-specific guides that include complete setup, authentication, and working call implementations:React
Context provider pattern with hooks
Vue
Composables and reactive state management
Angular
Service-based architecture with RxJS
Next.js
SSR handling with App Router and Pages Router
Ionic
Cross-platform with Angular, React, and Vue
Call Flow
Features
Call Layouts
Tile, Sidebar, and Spotlight view modes for different call scenarios
Recording
Record call sessions for later playback
Call Logs
Retrieve call history and details
Participant Management
Mute, pin, and manage call participants
Screen Sharing
Share your screen with other participants
Virtual Background
Apply blur or custom image backgrounds
Raise Hand
Signal to get attention during calls
Idle Timeout
Automatic session termination when alone in a call
Architecture
The SDK is organized around these core components:| Component | Description |
|---|---|
CometChatCalls | Main entry point for SDK initialization, authentication, session management, and call actions |
CallAppSettings | Configuration object for SDK initialization (App ID, Region) |
CallSettings | Configuration object for individual call sessions |
addEventListener | Method to register event listeners for session, participant, media, and UI events |
Sample App
React
React sample app
Angular
Angular sample app
Vue
Vue sample app
Svelte
Svelte sample app
Ionic
Ionic sample app
Changelog
View the latest releases and changes