Using Player Enhancements for Live SSAI with Brightcove Player
Introduction
Brightcove's Player Enhancements for Live SSAI allows you to improve the ad breaks in live streams with ad counts, ad countdown timers, click through ads and companion ads. These live streams can be played using Brightcove Player.
If you are new to this feature, see the following:
Steps
To play live streams with player enhancements using the Brightcove Player, follow these steps:
-
Create or choose an existing player from the Video Cloud Studio's Players module.
-
Brightcove Player needs to be configured with the SSAI plugin. Follow the Add the SSAI plugin steps described in the Implementing SSAI programmatically section of the SSAI plugin document.
- Follow the workflow in the Implementing Player Enhancements for Live SSAI document, up through and including creating your playback token.
- Choose an implementation:
- Continue with the workflow in the the Implementing Player Enhancements for Live SSAI document.
Standard embed code
When publishing a video from Video Cloud Studio's Media module, you can use the standard embed code to play your live stream. Follow these steps:
- From the Media module, select your remote video for live streaming and publish it with an SSAI-enabled player.
- Copy the standard embed code and paste it into your web page.
-
In the
<iframe>
tag, you should see ansrc
attribute. To the end of this, add theadConfigId
URL parameter with the value of your playback token.<iframe src="https://players.brightcove.net/6027103979001/IqljF4Olr_default/ index.html?videoId=6089818309001&adConfigId=live.aaB61234aabbccdd567890" allowfullscreen="" allow="encrypted-media" width="960" height="540"> </iframe>
- Your player is ready to play your live stream.
Advanced embed code
When publishing a video from Video Cloud Studio's Media module, you can use the advanced embed code to play your live stream. Follow these steps:
- From the Media module, select your remote video for live streaming and publish it with an SSAI-enabled player.
- Copy the advanced embed code and paste it into your web page.
-
In the
<video-js>
tag, add adata-ad-config-id
attribute with the value of your playback token.<video-js data-account="6027103979001" data-player="IqljF4Olr" data-embed="default" controls="" data-video-id="6089818309001" data-ad-config-id="live.aaB61234aabbccdd567890" data-playlist-id="" data-application-id="" width="960" height="540"> </video-js> <script src="https://players.brightcove.net/6027103979001/IqljF4Olr_default/index.min.js"></script>
- Your player is ready to play your live stream.
Live SSAI source
Unlike VOD SSAI sources, Live SSAI sources do not include an initial VMAP. This is because Live SSAI streams don't know in advance when ad breaks will be included. Instead, ad breaks are triggered from cue points that you add to the live job.
Brightcove Live SSAI streams start with a standard HLS manifest URL with a specific naming scheme:
https://.../playlist_ssaiM.m3u8
The SSAI plugin looks for the _ssaiM.m3u8
suffix and the normal HLS MIME type
When publishing a video from Video Cloud Studio's Media module, you can play a Live SSAI stream as follows:
- From the Media module, select your remote video for live streaming and publish it with an SSAI-enabled player.
- Copy the advanced embed code and paste it into your web page.
-
To your page code, add the following code:
<video-js id="myPlayerID" data-account="6027103979001" data-player="IqljF4Olr" data-embed="default" controls="" data-video-id="" data-playlist-id="" data-application-id="" width="960" height="540"> </video-js> <script src="https://players.brightcove.net/6027103979001/IqljF4Olr_default/index.min.js"></script> <script> videojs.getPlayer('myPlayerID').ready(function() { var myPlayer = this; myPlayer.src({ type: 'application/x-mpegURL', src: 'https://path/to/playlist_ssaiM.m3u8' }) }); </script>
- Your player is ready to play your live stream.