Voice JavaScript SDK: Twilio.Call

A Twilio.Call object represents a call to or from Twilio. You never instantiate a Call directly, but a Call instance is passed to the event handlers for errorEvent and incomingEvent, returned when you invoke device.connect(), and returned via the device.calls accessor.

const device = new Device(token);

// Make an outgoing call
async function makeOutgoingCall() {
  const call = await device.connect();
}

// or handle an incoming call
device.on('incoming', call => {});

Table of Contents

• Methods
• Events
• Properties
• Accessors
• EventEmitter Methods and Properties

Methods

This section contains descriptions of the methods available on a Call instance.

call.accept(acceptOptions)

Accepts an incoming voice call, initiates a media session for the Call instance. Returns void.

The optional acceptOptions parameter is a JavaScript object that allows you to configure the WebRTC connection and the MediaStream.

The properties of the acceptOptions object are listed in the table below. Both properties are optional.

Example:

const acceptOptions = {
  rtcConfiguration: {...}
  rtcConstraints: {...}
};

// This could be invoked by the user clicking 
// an "Answer Incoming Call" button
call.accept(acceptOptions)

The call.status() will be set to connecting while the media session for the Call instance is being set up.

The call.status() will change to open once the media session has been established.

call.disconnect()

Close the media session associated with the Call instance. Returns void.

call.getLocalStream()

Get the local MediaStream being used by the Call instance. Returns void.

This contains the local Device instance's audio input.

call.getRemoteStream()

Get the remote MediaStream. Returns the remote MediaStream if set. Otherwise, returns undefined.

This contains the remote caller's audio, which is being received locally and output through the local user's speakers.

call.ignore()

Ignore a pending call without alerting the dialing party. Returns void.

This method will stop incoming sound for the local Device instance and set the call.status() to closed.

This method will not send a hangup message to the dialing party.

The dialing party will continue to hear ringing until another Device instance with the same identity accepts the Call or if the Call times out.

call.isMuted()

Returns a Boolean indicating whether the input audio of the local Device instance is muted.

call.mute(shouldMute?)

Mutes or unmutes the local user's input audio based on the Boolean shouldMute argument you provide.

shouldMute defaults to true when no argument is passed.

// Passing true or no argument will mute 
// the local device's input audio
call.mute(true);
call.mute();


// Unmute the input audio
call.mute(false);

call.postFeedback(score?, issue?)

Creates a Feedback resource for the Call resource associated with the Call instance. If no parameters are passed, Twilio will report that feedback was not available for this call. Returns an empty Promise.

Posting the feedback using this API will enable you to understand which factors contribute to audio quality problems.

Twilio will be able to correlate the metrics with perceived call quality and provide an accurate picture of the factors affecting your users’ call experience.

For a high-level overview of your call feedback, you can use the FeedbackSummary Resource.

Example:

// Pass feedbackScore only
call.postFeedback(5); 

// Pass feedbackScore and feedbackIssue
call.postFeedback(2, 'dropped-call');

// Pass no arguments when user declines to provide feedback 
call.postFeedback(); 

call.reject()

Reject an incoming call. Returns void.

This will cause a hangup to be issued to the dialing party.

call.sendDigits(digits)

Play DTMF tones. This is useful when dialing an extension or when an automated phone menu expects DTMF tones. Returns void.

The digits parameter is a string and can contain the characters 0-9, *, #, and w. Each w will cause a 500-millisecond pause between digits sent.

The SDK only supports sending DTMF digits. It does not raise events if DTMF digits are present in the incoming audio stream.

call.sendMessage(message)

Note: This method is part of the Call Message Events feature. The feature is in Public Beta.

Send a message to the server-side application.

The call.sendMessage() method takes an argument object with the following properties:

Send a message to the server-side application:

// the Call is active 

const messageObject = {
   content: { key1: 'This is a messsage from the client side'},
   messageType: 'user-defined-message', 
   contentType: "application/json"        
}

call.sendMessage(messageObject)

If the message was successfully sent to Twilio (which will then send the message to the subscription callback endpoint), the messageSent event will be emitted by the Call instance.

call.status()

Return the status of the Call instance.

The possible status values are as follows:

Events

This section describes the different events that can be emitted by a Call instance. Using event handlers allow you customize the behavior of your application when an event occurs, such as updating the UI when a call has been accepted or disconnected.

accept Event

Emitted when an incoming Call is accepted. For outgoing calls, the 'accept' event is emitted when the media session for the call has finished being set up.

The event listener will receive the Call instance.

Listen for the 'accept' event:

call.on('accept', call => {
  console.log('The incoming call was accepted or the outgoing call's media session has finished setting up.');
});

audio Event

Emitted when the HTMLAudioElement for the remote audio is created. The handler function receives the HTMLAudioElement for the remote audio as its sole argument. This event can be used to redirect media if your environment supports it. See WebRTC redirection for more details.

cancel Event

Emitted when the Call instance has been canceled and the call.status() has transitioned to 'closed'.

A Call instance can be canceled in two ways:

1. Invoking call.ignore() on an incoming call
2. Invoking call.disconnect() on an outgoing call before the recipient has answered

Listen for the 'cancel' event:

call.on('cancel', () => {
 console.log('The call has been canceled.');
});

disconnect Event

Emitted when the media session associated with the Call instance is disconnected.

The event listener will receive the Call instance.

Listen for the 'disconnect' event:

call.on('disconnect', call => {
 console.log('The call has been disconnected.');
});

error Event

Emitted when the Call instance receives an error.

The event listener will receive a TwilioError object.

TwilioError

The format of the TwilioError returned from the error event is a JavaScript object with the following properties:

Listen for the 'error' event:

call.on('error', (error) => {
    console.log('An error has occurred: ', error);
});

See a list of common errors on the Voice SDK Error Codes Page.

messageReceived Event

Note: This method is part of the Call Message Events feature. The feature is in Public Beta.

Emitted when the Call instance receives a message sent from the server-side application.

The event listener receives a message object with the following properties:

Listen for the 'messageReceived' event:

call.on('messageReceived', (message) => {
  console.log('Message received:') 
  console.log(JSON.stringify(message.content));
});

messageSent Event

Note: This method is part of the Call Message Events feature. The feature is in Public Beta.

Emitted when the Call instance sends a message to the server-side application using the call.sendMessage() method.

The event listener receives a message object with the following properties:

Listen for the 'messageSent' event:

call.on('messageSent', (message) => {
  // voiceEventSid can be used for tracking the message
  const voiceEventSid = message.voiceEventSid;  
  console.log('Message sent. voiceEventSid: ', voiceEventSid)
});

Note: If call.sendMessage() was invoked and the 'messageSent' event was not emitted, check the Device instance's error handler.

mute Event

Emitted when the input audio associated with the Call instance is muted or unmuted.

The event listener will receive two arguments:

• a Boolean indicating whether the input audio for the Call instance is currently muted
• the Call instance

Listen for the 'mute' event:

call.on('mute', (isMuted, call) => {
 // isMuted is true if the input audio is currently muted 
 // i.e. The remote participant CANNOT hear local device's input

 // isMuted is false if the input audio is currently unmuted
 // i.e. The remote participant CAN hear local device's input

 isMuted ? console.log('muted') : console.log('unmuted');
});

reconnected Event

Emitted when the Call instance has regained media and/or signaling connectivity.

Listen for the 'reconnected' event:

call.on('reconnected', () => {
  console.log('The call has regained connectivity.')
});

reconnecting Event

Emitted when the Call instance has lost media and/or signaling connectivity and is reconnecting.

The event listener will receive a TwilioError object describing the error that caused the media and/or signaling connectivity loss.

You may want to use this event to update the UI so that the user is aware of the connectivity loss and that the SDK is attempting to reconnect.

Listen for the 'reconnecting' event:

call.on('reconnecting', (twilioError) => { 
  // update the UI to alert user that connectivity was lost
  // and that the SDK is trying to reconnect
  showReconnectingMessageInBrowser();

  // You may also want to view the TwilioError:
  console.log('Connectivity error: ', twilioError);
});

reject Event

Emitted when call.reject() was invoked and the call.status() is closed.

Listen for the 'reject' event:

call.on('reject', () => {
 console.log('The call was rejected.');
});

ringing Event

Emitted when the Call has entered the ringing state.

When using the Dial verb with answerOnBridge=true, the ringing state will begin when the callee has been notified of the call and will transition into open after the callee accepts the call, or closed if the call is rejected or cancelled.

The parameter hasEarlyMedia denotes whether there is early media available from the callee. If true, the Client SDK will automatically play the early media. Sometimes this is ringing, other times it may be an important message about the call. If false, there is no remote media to play, so the application may want to play its own outgoing ringtone sound.

Listen for the 'ringing' event:

call.on('ringing', hasEarlyMedia => {
  showRingingIndicator();
  if (!hasEarlyMedia) {
    playOutgoingRinging();
  }
});

sample Event

Emitted when the Call instance receives a WebRTC sample object. This event is published every second.

The event listener will receive the WebRTC sample object.

Listen for the 'sample' event:

call.on('sample', sample => {
    // Do something
});

Example of WebRTC Sample Data

{
  "audioInputLevel": 11122,
  "audioOutputLevel": 2138,
  "bytesReceived": 8600,
  "bytesSent": 8600,
  "codecName": "opus",
  "jitter": 0,
  "mos": 4.397229249317001,
  "packetsLost": 0,
  "packetsLostFraction": 0,
  "packetsReceived": 50,
  "packetsSent": 50,
  "rtt": 77,
  "timestamp": 1572301567032.327,
  "totals": {
    "bytesReceived": 63640,
    "bytesSent": 83936,
    "packetsLost": 0,
    "packetsLostFraction": 0,
    "packetsReceived": 370,
    "packetsSent": 488
  }
}

volume Event

Emitted every 50 milliseconds with the current input and output volumes on every animation frame.

The event listener will be invoked up to 60 times per second and will scale down dynamically on slower devices to preserve performance.

The event listener will receive inputVolume and outputVolume as percentages of maximum volume represented by a floating point number between 0.0 and 1.0 (inclusive). This value represents a range of relative decibel values between -100dB and -30dB.

Listen for the 'volume' event:

call.on('volume', (inputVolume, outputVolume) => {
    // Do something
});

You may want to use this to display volume levels in the browser. See the Voice JavaScript SDK quickstart GitHub repository for an example of how to implement this functionality.

warning Event

Emitted when a call quality metric has crossed a threshold.

The event listener will receive two arguments:

1. a string of the warning name (ex: 'high-rtt')
2. an object containing data on the warning

This event is raised when the SDK detects a drop in call quality or other conditions that may indicate the user is having trouble with the call. You can implement callbacks on these events to alert the user of an issue.

To alert the user that an issue has been resolved, you can listen for the warning-cleared event, which indicates that a call quality metric has returned to normal.

For a full list of conditions that will raise a warning event, check the Voice Insights SDK Events Reference page.

The example below shows how you can listen for and handle warning events.

call.on('warning', function(warningName, warningData) {
  if (warningName === 'low-mos') {
    showQualityWarningModal('We have detected poor call quality conditions. You may experience degraded call quality.');
    console.log(warningData);
    /* Prints the following
      {
        // Stat name
        "name": "mos",

        // Array of mos values in the past 5 samples that triggered the warning
        "values": [2, 2, 2, 2, 2],

        // Array of samples collected that triggered the warning.
        // See sample object format here https://www.twilio.com/docs/voice/client/javascript/connection#sample
        "samples": [...],

        // The threshold configuration.
        // In this example, low-mos warning will be raised if the value is below 3
        "threshold": {
          "name": "min",
          "value": 3
        }
      }
     */
  }
});

warning-cleared Event

Emitted when a call quality metric has returned to normal.

The event listener will receive one argument, the warning name as a string (ex: 'low-mos').

You can listen for this event to update the user when a call quality issue has been resolved. See example below.

call.on('warning-cleared', function(warningName) {
  if (warningName === 'low-mos') {
    hideQualityWarningModal();
  }
});

Properties

call.callerInfo

For calls that have undergone SHAKEN/STIR validation, call.callerInfo will return an object with an isVerified property.

If a caller's identity has been verified by Twilio and has achieved level A attestation, the call.callerInfo.isVerified property will be true.

console.log(call.callerInfo);

// PRINTS: 
// { isVerified: true }

If a call has failed validation or if the call achieves an attestation lower than level A, the call.callerInfo.isVerified property will be false.

console.log(call.callerInfo);

// PRINTS: 
// { isVerified: false }

For calls with no caller verification information, call.callerInfo will have a value of null.

console.log(call.callerInfo);

// PRINTS: 
// null

call.customParameters

Returns a Map object containing the custom parameters that were passed in the ConnectOptions.params property when invoking device.connect().

These custom parameters will be sent in the body of the HTTP request that Twilio will send to your TwiML App's Voice Configuration URL.

var params = {
  To: "+15554448888",
  aCustomParameter: "the value of your custom parameter"
};

const call = await device.connect({ params });

console.log(call.customParameters);

// PRINTS: 
// {'To' => '+15554448888', 'aCustomParameter' => 'the value of your custom parameter'}

call.parameters

Returns the Call parameters received from Twilio.

For incoming calls, the call.parameters may look like this:

console.log(call.parameters);

// PRINTS: 
// { 
//   From: "+15554448888", 
//   CallSid: "CAxxxx...", 
//   To: "client:YourDeviceIdentity", 
//   AccountSid: "ACxxxx..."
// }

For outgoing calls, the call may not yet have a CallSID. You can find the CallSID by waiting until the Twilio.Call instance has emitted the 'accept' event.

const call = await device.connect({ params });

console.log(call.parameters);

// PRINTS: 
// {}


// For outgoing calls, the "accept" event is emitted when the Call's media session has finished setting up. 
call.on("accept", () => {
  console.log(call.parameters)
});

// PRINTS:
// { CallSID: "CAxxxx..." }

Accessors

call.codec

Returns the audio codec used for the RTCPeerConnection associated with the Call instance.

Possible values are "opus" and "pcmu".

console.log(call.codec);

// Prints: 
// "pcmu"

call.direction

Returns the directonality of the Call instance.

Possible values are "INCOMING" and "OUTGOING".

An incoming call is one that is directed towards your Device instance.

An outgoing call is one that is made by invoking device.connect().

console.log(call.direction);

// Prints: 
// "OUTGOING"

EventEmitter Methods and Properties

A Call instance is an EventEmitter, so it provides a variety of event-related methods and properties. Although it will not be covered here, more information on EventEmitter functionality can be found in the full Node.js Events documentation. Alternatively, you can click on the method/property below to be taken to the pertaining documentation.