In this guide, we demonstrate how to embed asset or live streams in your
application using a hosted version of the Livepeer Player.
If you are using React, consider using Livepeer React instead.
PLAYBACK_ID with your video’s playback id.
<iframe
src="https://lvpr.tv?v={PLAYBACK_ID}"
allowfullscreen
allow="autoplay; encrypted-media; picture-in-picture"
sandbox="allow-same-origin allow-scripts"
>
</iframe>
Low Latency
For livestreams, you may also specify &lowLatency=true in the query string -
this will enable livestreams to play back with low-latency WebRTC. If this does
not succeed in playing back (commonly due to a slow network or connectivity
issues), the embeddable player will automatically fall back to HLS playback.
Also, if the stream contains B-frames (or bidirectional frames, which are common
for users streaming with OBS or other streaming apps), the Player will
automatically fall back to HLS, so that out-of-order frames are not displayed.
This only applies to users who are playing livestreams.
OBS users should be instructed to use the Livepeer Studio stream profile, or
to manually turn off B-frames in their stream. See our Stream from
OBS docs for more information. Clipping
To enable clipping, &clipLength={seconds} can be passed, which will allow
viewers to clip livestreams. The length in seconds must be less than 120
seconds.
Constant Playback
The embed supports “constant” playback with constant=true, which means that
audio will not be distorted if the playhead falls behind the livestream. This is
usually used for music applications, where audio quality/consistency is more
important than latency.
Other Configs
You can also override the default muted and autoplay behavior with
&muted=false and/or &autoplay=false. These are set to true by default.
Looping can also be set with &loop=true.
