Signed Call Web SDK

Learn how to integrate Signed Call Web SDK into your website and CRM portal.

Overview

CleverTap provides in-app calls via its Signed Call Web SDK, which means you can make and receive calls on any webpage or device with an internet connection and the Signed Call Web SDK. This document shows you how to integrate the Signed Call Web SDK and manage calls. To know more about the Signed Call feature, refer to Signed Call.

Browser Requirements

Following are the basic browser requirements for the Signed Call Web SDK to work:

Browser Name

Version Number

Google Chrome

V55 and above

Microsoft Edge

V15 and above

Mozilla Firefox

V43 and above

Opera

V43 and above

Safari

Does not support

Integrate the CleverTap Web SDK

The Signed Call Web SDK uses CleverTap SDK for analytics. For that, Signed Call Web SDK requires an active CleverTap instance as a parameter during the SDK initialization. If the CleverTap instance is unavailable, the Signed Call Web SDK returns an error ERR_MISSING_INITPARAMETERS, and the Signed Call Web SDK does not initialize.

To integrate the CleverTap Web SDK, refer to the CleverTap Web SDK Integration Guide.

📘

Minimum Supported Version

The Signed Call Web SDK integrates with CleverTap SDK v1.2.0 or higher.

Integrate Signed Call Web SDK

To integrate the Signed Call Web SDK, use the Node Package Manager (NPM).
You can add the Signed Call Web SDK as an npm to your web app.
Use the following npm command to install the package:

npm install clevertap-signed-call

Import the installed package as follows:

import {initSignedCall} from 'clevertap-signed-call'

Initialize and Authenticate Signed Call Web SDK

Create a new instance of a SignedCallClient by calling the initSignedCall() function. This function returns a promise object whose then() and catch() can be utilized for the following scenarios:

Scenario 1: If the promise resolves successfully, the then() method receives SignedCallClient as a response, meaning that the Signed Call Web SDK is initialized successfully.

Scenario 2: If the promise is rejected, the catch() method receives an error, meaning that the Signed Call Web SDK initialization failed.

The syntax for initializing and authenticating the Signed Call Web SDK is as follows:

let SignedCallClient

initSignedCall(
  {
    accountId: <string>,
    apikey: <string>,
    cuid: <string>,
    clevertap: <clevertap sdk instance>,
    name: <string / optional>,
    ringtone: <string / optional>
  }
).then(client => SignedCallClient = client).catch(err => console.log(err))

The options parameter in the initSignedCall function expects a JSON object with the following properties:

Properties

Description

Type

Notes

accountId

The Account ID is available on the CleverTap dashboard.

String

Required

apikey

The API Key is available on the CleverTap dashboard.

String

Required

cuid

Unique user ID of the person making a call.
Validation rules:

  • The cuid must range between 5 and 50 characters.
  • The cuid is case sensitive, and only '_' is allowed as a special character.
  • The cuid parameter cannot be of the number-number type, that is, a number followed by another number separated with a special character. For example, org_25 is allowed, but 91_8899555 is not allowed.
  • You must use a unique cuid for every device.

String

Required

clevertap

The CleverTap Web SDK instance.

Object

Required

name

The name of the initiator.
Validation rule:

  • The name must range between 3 and 50 characters.

String

Optional

ringtone

The URL of the calling ringtone. The default ringtone plays if this parameter is not provided.

String

Optional

Make a Signed Call

The dialing screen displays when the SignedCallClient from the init() function invokes the call() method to make an outbound call.
This method returns a promise object whose then() and catch() can be utilized for the following scenarios:

Scenario 1: When the call is answered, the outgoing call screen transitions into the ongoing call screen. After the transition, the then() method receives an over status and indicates that the call is completed successfully.

Scenario 2: The declined and missed statuses received by the catch() method indicate that the receiver rejected the call (declined) or did not answer the call (missed).

The call() parameters are as follows:

Parameters

Description

Type

Notes

receiver

It is the receiver's cuid. For example: receiver = “Some_Unique_ID”.

String

Required

context

It specifies the context of the call. For example, Trainer is calling, Grocer is calling, Tutor is calling, and so on.

String

Required

callOptions

It is a JSON object with the following properties:

  • receiver_image (string): This URL displays the receiver's image on the outgoing call screen.
  • initiator_image (string): This URL displays the initiator's image on the incoming call screen.

Object

Optional

Call Button Handling

Before initiating the call, verify whether the Signed Call services are enabled. Use the following isEnabled() method that returns Boolean data type:

if (SignedCallClient.isEnabled()) {
  SignedCallClient.call(receiver, context, callOptions).then(response => {
  // if the call has been answered
  console.log("call status is: ",response)
  }).catch (err => {
   // if the call is either missed or declined 
  console.log("call status is: ", err)
  })
}

Call Hangup Functionality

The hangup() function ends an ongoing call. The hangup functionality is user-driven, and ending the call depends on the user. For example, if one of the users in a call clicks the call hangup button from the ongoing call screen, the Signed Call Web SDK calls the hangup() function internally to end the call.

In the case of a metered call, when a business wants to end the call after a specific duration, it must maintain a timer in the app and call the SignedCallClient.hangup() function at the appropriate time.

SignedCallClient.hangup()

Logout the Signed Call Web SDK

The logout function disables the Signed Call Web SDK's calling feature by calling the SignedCallClient.logout() method. After calling the logout() function, you must repeat the Initialization and Authentication steps to make a new call.

SignedCallClient.logout()

Example

The following example describes the implementation of Signed Call Web SDK Initialization, Make Call, Hangup Call (for metered connection), and Logout functions of the clevertap-signed-call via Node Package Manager (NPM):

import {initSignedCall} from 'clevertap-signed-call'

  //initiate the sdk
  initSignedCall({
      accountId, //string, required
      apikey, // string, required
      cuid, // string,required
      clevertap, // clevertap instance, required
      name, // string, optional
      ringtone // string, optional
  }).then(client => SignedCallClient = client).catch(err => console.error(err))

  // make a call
  function call() {
    let callOptions = {
      receiver_image: "", // optional, string
      initiator_image: "" // optional, string
    };

    /**
     * receiver {string, required}: cuid whom you are calling
     * context {reason, required}: reason of call
     * callOptions {optional}
     * */
    if (SignedCallClient.isEnabled()) {
      SignedCallClient.call(receiver, context,calloptions)
      .then((response) => {
        console.log("Call response : ", response);
      })
      .catch((error) => {
        console.error(error);
      })
    } else {
      // wait for sdk to be enabled or re-initiate the sdk
    }
  }

    // Hangup a call automatically after 20000ms 
    setTimeout((SignedCallClient.hangup()), 20000)

    // Logout the sdk 
    let logout = function () {
      SignedCallClient.logout();
    }

Errors

The following table lists the different errors and their probable causes:

Error

Reason

ERR_MISSING_INITPARAMETERS

One (or more) mandatory parameter is missing in SDK Initialization and Authentication.

ERR_INVALID_INITPARAMETERS

Parameters are not valid.

ERR_MISSING_CT_ACCOUNTID

Signed Call Web SDK is unable to find the Account ID associated with CleverTap.

ERR_MISSING_CT_ID

Signed Call Web SDK cannot find the CleverTap ID.

ERR_INVALID_CREDENTIALS

The Account ID or API Key provided to the Signed Call is incorrect.

ERR_ALREADY_SIGNEDIN

The cuid is currently connected to another device.

ERR_MIC_UNAVAILABLE

Microphone permission denied.

ERR_OUTGOING_CALL_IN_PROGRESS

If a call is already in progress, then another can only be initiated if the current call is over, missed, declined, or canceled.

ERR_INVALID_CALL_PARAMETERS

The parameters provided in Make Call are incorrect.

ERR_INTERNET_LOST

The call did not occur successfully due to the loss of internet connection.

404

The receiver's cuid is offline.

FAQ

Q. Is Signed Call accountId and apikey the same as CleverTap's accountId and token?

A. No. Signed Call accountId and apikey differ from CleverTap's accountId and token. You can find these details under your dashboard's Signed Call Settings.

Q. What if I get an ERR_MISSING_CT_ID error even after passing the correct CleverTap instance to the clevertap-signed-call?

A. This error may occur if:

  • The CleverTap SDK's region and accountId parameters are incorrect.
  • CleverTap SDK is not initialized.
    Ensure that these details are correct and if this issue persists, raise an issue at CleverTap Support.