How to use server-relayed WebRTC group calls to record 1:1 voice & video calls in the cloud (JavaScript)

Junyoung Lim profile picture
Junyoung Lim
Software Engineer
  • Tutorial Type: Advanced
  • Reading Time: 15 min
  • Building Time: N/A
Chat SDK v4 2x

Swift, Kotlin, and TypeScript SDKs

Build in-app chat, calls, and live streaming

WebRTC-based P2P video calls: Building feature-rich in-app video calls with a video call API

Sendbird Calls is a highly abstracted API that allows developers to build feature-rich in-app voice and video calls in web and mobile apps without being bogged down by low-level WebRTC and media infrastructure details.

In this tutorial, you’ll learn how to use Sendbird’s video call API to record 1-1 calls in the cloud by using a virtual room for group calls.

Reconciling P2P WebRTC calls with cloud recording by using a video call API

The Sendbird video call SDKs support direct and group calls. Direct calls, also referred to as 1-1 calls or one-on-one calls, can either be peer-to-peer (p2p) or server-relayed. The peer-to-peer connection is always preferred for quality, security, and cost reasons. That’s why our platform will always default to p2p when possible to reduce cost and optimize privacy.

Because p2p voice and video calls establish a direct connection between two devices, cloud recording is not possible. Calls can be recorded only on either device. Cloud recording of a 1–1 call, however, requires a media-server connection. There is a simple way to circumvent this limitation: you can use the Sendbird video call API to host a server-relayed group call with only 2 participants and record the media content in the cloud.

Prerequisites for P2P call recording

To get the most out of this tutorial, you will need:

  1. A free Sendbird account. Set this up in the Sendbird dashboard.

  2. Familiarity with JavaScript.

Let's get started! 💻

Step 1: Create a room for your P2P video call

First, let’s create a room from which calls will take place. Two users will join this room and talk to each other in a 1-1 call. With the Sendbird video call API, set the room type and create the room.

Step 2: Enter a room

The caller (the person who initiates the call) will now need to enter the room. When a user enters the room, they will be automatically connected to the Sendbird server.

Step 3: WebRTC signaling: Invite the callee

In 1-1 or direct calls, the caller (the person who initiates the call) sends a ringing signal to the callee (the person who is called). The callee then has to accept or reject the incoming call.

In a group call, you can mimic this by sending an invitation to the callee. Sending an invitation to join the room will send an event to the callee. Similar to a 1-1 call, the callee can either accept or decline.

Refer to the following code to invite the callee using their user ID as the `inviteeId`.

At this point, you may want to show a dialing screen to notify the user that they are dialing the callee.

Step 4: Receive an invitation

When the callee receives an invitation, they will receive an event that contains information about the room.

When the event is delivered to the SDK, SendBirdCall’s `onInvitationReceived` will be called. Then, the callee can either accept or decline the invitation.

Step 5: Accept or decline the invitation

Accepting or declining the invitation will send a response to the caller to let them know if the callee has chosen to accept or decline the invitation.

You can also receive event handlers about the callee’s response to the invitation as shown below:

Step 6: Connect the users

After accepting the invitation, the callee has to enter the room to be finally connected with the caller in the same room.

The callee enters the room as shown below:

After entering the room, the two users will be automatically connected, and each other’s media streams will be viewable. When a user enters and gets connected to the room, the following event handlers will be called. You can add UI updates to these event handlers to show the user when the callee accepts the call, and begins and finishes connecting to the room.

Tutorial Method and Description table

Build in-app P2P video calls with Sendbird's video call API

And that’s a wrap! You now know how to record 1-1 video calls in the cloud using Sendbird’s video call API. You’ve learned how to:

  • Use the video call API to create and enter a room

  • Signal to your correspondent an incoming call with push notifications

  • Allow the callee to respond

  • Host a call between the two participants in a room

If you need more help with the material in the tutorial, please see our docs. If you have questions, please reach out to us via the Sendbird community or through your support plan. Don’t hesitate to contact us - our experts are here to help.

Happy group calls building and cloud recording! ☁️