![Create React App Officially Deprecated Amid React 19 Compatibility Issues](https://cdn.sanity.io/images/cgdhsj6q/production/04fa08cf844d798abc0e1a6391c129363cc7e2ab-1024x1024.webp?w=400&fit=max&auto=format)
Security News
Create React App Officially Deprecated Amid React 19 Compatibility Issues
Create React App is officially deprecated due to React 19 issues and lack of maintenance—developers should switch to Vite or other modern alternatives.
clevertap-directcall
Advanced tools
CleverTap provides In-App calls via its Direct Call Web SDK, which means you can make calls on any webpage if a device has an internet connection and the Direct Call Web SDK. This section shows how to integrate the Direct Call Web SDK and manage calls.
There are two ways to integrate the Direct Call Web SDK:
Include the following <script>
tag at the bottom of the HTML code of your webpage:
<script src='https://path/clevertap-directcall.umd.js'></script>
<body>
<!-- html -->
</body>
<script scr="https://path/clevertap-directcall.umd.js"></script>
<script>
let DirectCallClient
DirectCallSDK.initDirectCall(
{
accountId: <string>,
apikey: <string>,
cuid: <string>,
clevertap: <clevertap sdk instance>,
name: <string / optional>,
ringtone: <string / optional>
}).then(client => DirectCallClient = client).catch(err => console.log(err))
</script>
You can add the Direct Call Web SDK as an npm to your web app.
npm install clevertap-directcall-web-sdk --save
import {initDirectCall} from 'clevertap-directcall'
let DirectCallClient
initDirectCall(
{
accountId: <string>,
apikey: <string>,
cuid: <string>,
clevertap: <clevertap sdk instance>,
name: <string / optional>,
ringtone: <string / optional>
}
).then(client => DirectCallClient = client).catch(err => console.log(err))
The options parameter in the initDirectCall
function expects a JSON object with the following properties:
Properties | Description |
---|---|
accountId (string, required) | The Account ID is available from the dashboard. |
apikey (string, required) | The API Key is available from the dashboard |
cuid (string, required) | Unique user ID of the person making a call. Validations: - 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. |
clevertap (required) | The Clevertap Web SDK instance. |
name (string, optional) | The name of the caller. - The name must range between 3 and 50 characters. |
The dialing screen displays when the DirectCallClient
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:
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.
The declined
and missed
statuses received by the catch()
method indicate whether the receiver rejected the call (decline) or did not answer the call (miss).
The call()
parameters are as follows:
Parameter | Description |
---|---|
receiver (required) | It is a string of cuid For example: receiver = 'some_unique_id' |
context (required) | It specifies the context of the call. For example, Trainer is calling, Grocer is calling, Tutor is calling, and so on. |
callOptions (optional) | It is a JSON object with the following properties: receiver_image (string, optional): This URL displays the receiver's image on the outgoing call screen. initiator_image (string, optional): This URL displays the initiator's image on the incoming call screen. |
This functionality depends on user behaviour i.e. if one of the user in a call presses the hangup button on the ongoing call screen, the call termination by default is managed by the sdk.
Only in the case of a metered call, when a business wants end a call after a specific duration, then they must maintain a timer in the app and call the DirectCallClient.hangup()
function programatically at an appropriate time.
DirectCallClient.hangup()
Logout the DirectCallClient via calling DirectCallClient.logout()
method. It ends all the connections, and to make a new call, you must repeat the Initialization and Authentication steps.
DirectCallClient.logout()
<body>
<!-- your html -->
</body>
<script type="text/javascript">
var clevertap = { event: [], profile: [], account: [], onUserLogin: [], notifications: [], privacy: [] };
clevertap.account.push({ id: 'clevertap_project_id' }, 'clevertap_project_region');
clevertap.privacy.push({ optOut: false });
clevertap.privacy.push({ useIP: false });
(function () {
var wzrk = document.createElement('script');
wzrk.type = 'text/javascript';
wzrk.async = true;
wzrk.src = "https://cdn.jsdelivr.net/gh/CleverTap/clevertap-web-sdk/clevertap.js"
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(wzrk, s);
})();
</script>
<script src="./dist-umd/directcall-sdk.umd.js"></script>
<script type="text/javascript">
// initilize sdk
function initSDK() {
DirectCallSDK.initDirectCall({
accountId, //string, required
apikey, // string, required
cuid, // string,required
clevertap, // clevertap instance, required
name, // string, optional
ringtone // string, optional
})
.then((client) => {
DirectCallClient = client;
})
// error handling
.catch(err => console.error(err));
}
function call() {
let callOptions = {
receiver_image: "", // optional, string
initiator_image: "" // optional, string
};
/**
* callee {string, required}: cuid whom you are calling
* context {reason, required}: reason of call
* callOptions {optional}
* */
DirectCallClient.call(callee, context,calloptions)
.then((response) => {
console.log("Call response : ", response);
})
.catch((error) => {
console.error(error);
});
}
// Hangup a call automatically after 20000ms
setTimeout((DirectCallClient.hangup()), 20000)
// Logout the sdk
let logout = function () {
DirectCallClient.logout();
}
</script>
import {initDirectCall} from 'clevertap-directcall'
//initiate the sdk
initDirectCall({
accountId, //string, required
apikey, // string, required
cuid, // string,required
clevertap, // clevertap instance, required
name, // string, optional
ringtone // string, optional
}).then(client => DirectCallClient = client).catch(err => console.error(err))
// make a call
function call() {
let callOptions = {
receiver_image: "", // optional, string
initiator_image: "" // optional, string
};
/**
* callee {string, required}: cuid whom you are calling
* context {reason, required}: reason of call
* callOptions {optional}
* */
DirectCallClient.call(callee, context,calloptions)
.then((response) => {
console.log("Call response : ", response);
})
.catch((error) => {
console.error(error);
});
}
// Hangup a call automatically after 20000ms
setTimeout((DirectCallClient.hangup()), 20000)
// Logout the sdk
let logout = function () {
DirectCallClient.logout();
}
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 | Direct Call SDK is unable to find the Account ID associated with CleverTap. |
ERR_MISSING_CT_ID | Direct Call SDK cannot find the CleverTap ID. |
ERR_INVALID_CREDENTIALS | Direct Call's account ID or API Key is incorrect. |
ERR_ALREADY_SIGNEDIN | The cuid entered is currently connected elsewhere. |
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 could not occur successfully because the internet is lost. |
404 | The receiver's cuid is offline. |
Q. Do we place the directcall-sdk <script>
, in the <body>
or <meta>
tag of the webpage?
A. Place the directcall-sdk <script>
in the <body>
tag.
Q. Is Direct Call accountId
and apikey
the same as CleverTap's accountId and token
?
A. No. Direct Call accountId and apikey are different from CleverTap's accountId and token. You can find these details under your dashboard's Direct Call section.
Q. I am getting an EER_MISSING_CT_ID
error even after passing the correct CleverTap instance to the directcall-sdk?
A. This error occurs due to the following reasons:
FAQs
A javaScript sdk for VOIP calling
The npm package clevertap-directcall receives a total of 0 weekly downloads. As such, clevertap-directcall popularity was classified as not popular.
We found that clevertap-directcall demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Create React App is officially deprecated due to React 19 issues and lack of maintenance—developers should switch to Vite or other modern alternatives.
Security News
Oracle seeks to dismiss fraud claims in the JavaScript trademark dispute, delaying the case and avoiding questions about its right to the name.
Security News
The Linux Foundation is warning open source developers that compliance with global sanctions is mandatory, highlighting legal risks and restrictions on contributions.