Recording (Beta)

CometChat Calling SDK v4 - Stable Release - Recording for React Native

Quick Reference - Start and stop call recording:

// Start recording
CometChatCalls.startRecording();

// Stop recording
CometChatCalls.stopRecording();

// Or enable auto-recording via CallSettings
new CometChatCalls.CallSettingsBuilder()
  .startRecordingOnCallStart(true)
  .showRecordingButton(true)
  .build();

Available via: SDK | UI Kits

Overview

This section guides you through implementing call recording for voice and video calls.

Once you have decided to implement Ringing or Call Session and followed the steps to implement them, a few additional listeners and methods will help you quickly implement call recording in your app.

You need to make changes in the CometChatCalls.OngoingCallListener constructor and add the required listeners for recording. Please make sure your callSettings is configured accordingly for Ringing or Call Session.

A basic example of how to make changes to implement recording:

JavaScript

const callListener = new CometChatCalls.OngoingCallListener({
  onRecordingStarted: recordingStartedBy => {
      console.log("Listener => onRecordingStarted:", recordingStartedBy);
  },
  onRecordingStopped: recordingStoppedBy => {
      console.log("Listener => onRecordingStopped:", recordingStoppedBy);
  },
});

const callSettings = new CometChatCalls.CallSettingsBuilder()
  .enableDefaultLayout(true)
  .setIsAudioOnlyCall(false)
  .setCallEventListener(callListener)
  .build();

return (
  <View style={{height: '100%', width: '100%', position: 'relative'}}>
    <CometChatCalls.Component callSettings={callSettings} callToken={callToken} />
  </View>
);

TypeScript

const callListener = new CometChatCalls.OngoingCallListener({
  onRecordingStarted: recordingStartedBy => {
      console.log("Listener => onRecordingStarted:", recordingStartedBy);
  },
  onRecordingStopped: recordingStoppedBy => {
      console.log("Listener => onRecordingStopped:", recordingStoppedBy);
  },
});

const callSettings = new CometChatCalls.CallSettingsBuilder()
  .enableDefaultLayout(true)
  .setIsAudioOnlyCall(false)
  .setCallEventListener(callListener)
  .build();

return (
  <View style={{height: '100%', width: '100%', position: 'relative'}}>
    <CometChatCalls.Component callSettings={callSettings} callToken={callToken} />
  </View>
);

Settings for Call Recording

Setting	Description
showRecordingButton(showRecordingButton: boolean)	If set to true it displays the Recording button in the button Layout. Default value = false
startRecordingOnCallStart(startRecordingOnCallStart: boolean)	If set to true call recording will start as soon as the call is started. Default value = false

Start Recording

CometChatCalls.startRecording();

Stop Recording

CometChatCalls.stopRecording();

Downloading Recording

Currently, the call recordings are available on the CometChat Dashboard under the Calls Section.

Best Practices

• The ongoing call component automatically displays a recording badge when recording starts
• Use auto-recording for compliance use cases with startRecordingOnCallStart(true)
• If using a custom layout, track recording state using onRecordingStarted and onRecordingStopped listeners

Troubleshooting

• Recording button not visible: Ensure showRecordingButton(true) is set and enableDefaultLayout(true) is enabled
• onRecordingStarted / onRecordingStopped not firing: These listeners require JS SDK v3.0.8 or later
• Recording not found on Dashboard: Recordings may take a few minutes to process after the call ends

Next Steps

Call Session

Start and manage call sessions with full configuration options

Ringing

Implement a complete calling experience with incoming and outgoing call UI

Video View Customisation

Customize the main video container and participant tiles

Call Logs

Retrieve and display call history including duration and participants