Playback

Guide to Decoding and Playback of Streaming Content

The final stage of the streaming workflow is taking the stream and playing it back for the end user. Similar to broadcasting, decoding the stream for playback is supported with a viewer for a wide range of devices and environments.

✓ Hosted streaming player with low-code drop-in support for many applications.

✓ Interactive playback for streams that support dynamic tracks, multiple layers, multiple views, and playback events.

✓ Support with Client SDKs for building custom playback viewers for Web, iOS, Android, React-Native, Flutter, Unity Plugins, Unreal Player Plugin, or desktop environments.

✓ Preview streams with poster images and thumbnails.

REST and GraphQL APIs that provide analytics for tracking individual streams and user bandwidth tracking for who is viewing a stream.

✓ Broad support is made possible through implementations of WebRTC HTTP Egress Protocol (WHEP).

Start building

Client SDKs

Playback streaming media

The previous stages of Capture, Broadcast, and Distribution all lead up to making the content available for the end-user to view.

Using the streaming viewer

Dolby.io Dashboard Viewer
The quickest and easiest way to test playback is to use your account dashboard. The streaming viewer is built into the Dolby.io Dashboard, so you can test out streaming right away. To build a more customized application, the Client SDKs provide support for the most popular programming platforms.

How-to Create Subscriber Tokens
To broadcast, you need a publishing token. Similarly, to support playback in your application, you will need to be able to generate a subscriber token. This can be done either in a web application or with an API.

Previewing a stream

How-to Add a Poster Image
A poster image is a graphic that lets the audience know that a session exists but that a broadcast has not yet begun.

How-to Provide Thumbnail Image Previews
A thumbnail is a static frame image that is captured at regular intervals during a broadcast. The thumbnail image offers a preview of what is being streamed to allow users to preview what is being presented before joining.

Interactive viewer features

How-to Create a Multi-view Web Application
When more than one streaming source is being broadcast, the viewer is capable of presenting a lower-resolution preview of each incoming feed. The application can then let the user choose from these multi-view options.

Source and Layer Selection
For some applications, you may need to create more than one experience. The multi-view application can allow a host to choose which source layer should be sent as the primary stream that will be distributed for end-user playback. This feature can create the effect of switching between camera feeds and make dynamic cuts over the duration of the stream.

📘

Audience Participation

You can allow viewers of a stream to participate and share their own audio and video by using our Communications APIs that allow for a bi-directional media stream to send and receive.

Integrating third-party capabilities

How-to Add Captions with Web Captioner
Tools such as Web Captioner can be used to integrate advanced features and behaviors, such as text captions, to supplement the audio and video stream.

You can find examples of more third-party viewer integrations, such as Adding Graphics with Singular.live on the developer blog.

Playback events and analytics

Webhooks
A webhook is a registered URL that will be called back from the Dolby.io platform with details about an event as it occurs. You can create webhooks for when a thumbnail is generated, a recording is complete, or when streams begin and end.

Viewer events
Viewer events occur when a component of a stream changes, such as when a new source is published, simulcast layer information has changed, etc.

Syndication

Syndication refers to the process of distributing or sharing content with multiple streaming partners while tracking and analyzing viewer data on bandwidth consumption.

Streaming analytics
The account dashboard provides data-rich information about streaming usage for your individual account. There are also REST and GraphQL endpoints to generate custom reports and behaviors by querying that data.

Playback on devices

The WebRTC-HTTP Egress Protocol (WHEP) is an IETF standard developed to leverage the capabilities of WebRTC to distribute and playback content onto a WebRTC-enabled device over HTTP. WHEP addresses problems with Real-time Streaming by removing translation layers during decoding.

Real-time Streaming Monitor apps were created to allow your users to quickly and easily view live streams powered by Dolby.io. Plug in your Dolby.io subscriber token to view streams on any Apple iOS, iPadOS, tvOS, or Android TV device.

Download one of these apps or create and customize your own Real-time Streaming Monitor apps with a native Client SDK.

Learn more