Share this URL:

or open in a new tab.

It's this easy...

Build our demo app in 25 lines of code.

// Initialize API key, session, and token...
// Think of a session as a room, and a token as the key to get in to the room
// Sessions and tokens are generated on your server and passed down to the client
var apiKey = "1127";
var sessionId = "2_MX4xMTI3fn5XZWQgTWF5IDIyIDEwOjI3OjQ1IFBEVCAyMDEzfjAuODA3MjU4fg";
var token = "T1==cGFydG5lcl9pZD0xMTI3JnNpZz1mNmZmYjlhZDI0NzJlZjg2OWEzOTljOGNmYzY1YjVhMDZiZWQ4NjQwOnNlc3Npb25faWQ9Ml9NWDR4TVRJM2ZuNVhaV1FnVFdGNUlESXlJREV3T2pJM09qUTFJRkJFVkNBeU1ERXpmakF1T0RBM01qVTRmZyZjcmVhdGVfdGltZT0xMzY5MjQzNjY1Jm5vbmNlPTU2MDA0OSZyb2xlPXB1Ymxpc2hlcg==";

// Enable console logs for debugging
TB.setLogLevel(TB.DEBUG);

// Initialize session, set up event listeners, and connect
var session = TB.initSession(sessionId);
session.addEventListener('sessionConnected', sessionConnectedHandler);
session.addEventListener('streamCreated', streamCreatedHandler);
session.connect(apiKey, token);
function sessionConnectedHandler(event) {
  var publisher = TB.initPublisher(apiKey, 'myPublisherDiv');
  session.publish(publisher);

  // Subscribe to streams that were in the session when we connected
  subscribeToStreams(event.streams);
}

function streamCreatedHandler(event) {
  // Subscribe to any new streams that are created
  subscribeToStreams(event.streams);
}

function subscribeToStreams(streams) {
  for (var i = 0; i < streams.length; i++) {
    // Make sure we don't subscribe to ourself
    if (streams[i].connection.connectionId == session.connection.connectionId) {
      return;
    }

    // Create the div to put the subscriber element in to
    var div = document.createElement('div');
    div.setAttribute('id', 'stream' + streams[i].streamId);
    document.body.appendChild(div);

    // Subscribe to the stream
    session.subscribe(streams[i], div.id);
  }
}

IRC Live Chat

Have a quick question? Chat with TokBox Support on IRC. Join chat