Using the DataTrack API

In this guide, we will show you how to use the DataTrack API to send messages between Participants connected to a Room. With the DataTrack API you will be able to build powerful collaboration features such as whiteboarding, screen annotations, shared augmented reality apps and more. Read below to learn more.

Overview

The DataTrack API lets you create a DataTrack channel which can be used to send low latency messages to zero or more receivers subscribed to the data. DataTracks have the following properties.

  • DataTracks are unidirectional.
  • DataTracks have built-in mechanisms to support reliable transmission. Check out the section on Configuring DataTrack reliablity.
  • Recommended maximum payload size of data sent over the DataTrack is 16KiB.
  • string or byte data can be sent over the DataTrack.
  • The DataTrack API supports both Peer-to-peer Rooms and Group Rooms.

In the next section we will show you how to use the DataTrack API with the JavaScript SDK.

Using the DataTrack API

Create a local DataTrack

The LocalDataTrack is a Track that represents data that can be published to a Room by the LocalParticipant

var Video = require(`twilio-video`);
var dataTrack = new Video.LocalDataTrack();

Connect to a Room and Publish the DataTrack

Next, we want to publish the DataTrack we created earlier to the room we connect to

var token = getAccessToken();
    Video.connect(token, {
    name: 'my-whiteboard-room',
    tracks: [dataTrack]
});

Send messages over the DataTrack

Call the send method on the DataTrack object to begin transmitting data over the DataTrack.

dataTrack.send("Hello World!");

Receiving messages

Now that we are sending messages over the DataTrack, we want our RemoteParticipants to subscribe to the published DataTrack and receive those messages.

When a track is added to a Room, the trackAdded event is fired on the RemoteParticipant object. In the trackAdded event listener function, you want to look for the added DataTrack by checking the track.kind. Once you have the track object, you can extract the message payload.

function trackAdded(participant, track) {
    console.log(Participant "${participant.identity}" added ${track.kind} Track ${track.sid});
    if (track.kind === 'data') {
        track.on('message', data => {
        const { mouseDown, mouseCoordinates: { x, y } } = JSON.parse(data);
    });
}}

Take a look at this Quickstart Application to learn more.

Configuring DataTrack reliability

DataTracks are intended for low-latency communication between Participants. Importantly, to optimize for lowest latency possible, delivery of DataTrack messages is not guaranteed. You can think of them more like UDP messages, rather than TCP.

You can configure the retry parameters for your DataTrack with the following options:

  • maxPacketLifeTime sets the time in milliseconds during which the DataTrack will transmit or retransmit a message until that message is acknowledged.
  • maxRetransmits sets the maximum number of retransmit attempts that will be made.

In Group Rooms, DataTrack connections are established between Participants via the media server. Under the hood, there is one connection between a local Participant to the Media server and a second connection from the Media server to the remote Participant. Twilio’s media server configures the same maxPacketLifeTime value on each remote Participant's connection. Therefore you should set the maxPacketLifetime to half the acceptable max lifetime for each message you send.

Need some help?

We all do sometimes; code is hard. Get help now from our support team, or lean on the wisdom of the crowd browsing the Twilio tag on Stack Overflow.