Subscribe: Basics

This guide shows how to detect available streams in a session, subscribe to them, and unsubscribe when done. You’ll listen for new streams, attach them to your UI, and clean up correctly.

Detect streams

Listen for new streams in a session so you can subscribe as they appear.

The Session object dispatches a streamCreated event when a new stream (other than your own) is created in a session. A stream is created when a client publishes a stream to the session. The streamCreated event is also dispatched for each existing stream in the session when you first connect. This event is defined by the StreamEvent, which has a stream property, representing stream that was created:

You can subscribe to any stream. See the next section.

Subscribe to a stream

Use the session to subscribe to a remote stream and render it in your UI.

To subscribe to all streams in the session, add an OTSubscriber object as a chile of the OTSession object:

After the client connects to the session, the OTSubscriber object adds views for subscriber videos when other clients streams become available in the session.

The OTSubscriber object dispatches a connected event when a subscriber successfully starts streaming. It dispatches an error event if there is an error subscribing. Set an eventHandlers prop of the OTSubscriber component, and set the connected and error properties of that object to callback functions:

Unsubscribe (JavaScript)

To stop playing a stream you are subscribed to:

The Subscriber object is destroyed, and the stream display is removed from the HTML DOM.