As you can see in the above example, the component will request permissions
for video/audio input - so it prompts the user for access to their microphone
and camera upon component mount.The
getUserMedia
browser API used to get the video/audio is only available in
secure contexts (HTTPS).Features
- Synchronizes state with the HTML5 video element
- Keyboard hotkeys (
B
to toggle whether the broadcast is enabled,L
to toggle audio,V
to toggle video,D
to broadcast display media,C
for next video source,M
for next audio source) - Adheres to WAI-ARIA design patterns
- Handles all common browser APIs, and old WebKit/Firefox APIs (see caniuse)
The Broadcast above will work with only keyboard shortcuts, without any custom
controls.
Anatomy
Import the components and piece the parts together.Props
The component accepts most props suitable for a HTML5video
tag, except for
src
and poster
which are managed internally or provided explicitly through
props.
Data Attributes
data-livepeer-video
Serves to identify the component’s role within the Broadcast.
data-enabled
Indicates the enabled state of the broadcast, "true"
when broadcasting is
enabled and "false"
when it is not.