If you want to insert ads before delivering a live stream each time an end-user requests it, you're in the right place. At least to implement a first test stream and understand the principles of live pre-rolls... Note : if you prefer to watch our video tutorial, scroll to the end of this page.

A Live Pre-Roll Service is based on a content - a live stream - and uses an ad server to identify the ads that have to be inserted. In this article, we will set a pre-roll ad insertion service for a live stream by going through the following steps:

Create a Live stream as a Source
Create an ad server as a Source
Create an ad insertion Service
Preview the service & retrieve the output URL

If you want to implement a Service but you don’t have relevant Sources yet, we provide Sources samples you can use in your own tests. These samples can also be aded in your account with the shortcut button "create samples" in the Source tab of the webapp.

Create a live stream as a Source

Sample: [https://origin.broadpeak.io/bpk-tv/bpkiofficial/default/index.mpd](https://origin.broadpeak.io/bpk-tv/bpkiofficial/hlsv3/index.m3u8)

This source delivers the live content you want to manipulate. Find the "Source" tab and click on the "create new" button.

The small status box indicates that the Source is valid and match input requirements, including being a dynamic Source (as opposed to a VOD asset).

Create an ad server as a Source

Sample: https://bpkiovast.s3.eu-west-1.amazonaws.com/vastbpkio20s

An ad server Source is an HTTP url to an ad server that returns a VAST payload, often called a "VAST tag". The payload returned provides one or more commercials that have to be inserted in the stream. In this example, we keep it simple: the VAST always returns a single ad of 20 seconds.

Usually, the ad server is a third-party that dynamically returns different ads, usually depending on the user profile or some other playback context. This decision is made thanks to query parameters that are part of the request made to the ad server. Some usually come from the player's request to match ads with user's profile. The "queries" field is there to set this behavior. To keep things simple, we don't use this option in our current scenario.

Create an ad insertion Service

Once we have our 2 main components - a live source and an ad server - created as sources, we can start building our Service. Several ad insertion scenarios are possible. Here we want to insert ads before streaming the live content: it's the pre-roll feature.

We need to activate the Transcoding option. Transcoding is useful when ads are not encoded yet. In such situation, a transcoding profile is necessary to transform the original ads in a format that is compatible with the live stream. The transcoding profile is part of your account settings; if your account needs some, please reach out to the support team. If your ads are already encoded, be sure that they are encoded with the same profile as your live Source.

Preview your Service and retrieve the output URL

Is our service ready to operate ? Let's check that with the preview page, from your service list.

The preview page streams the original live Source on the left side, and on the right side, the manipulated streams, with the ad inserted before the live content. The ad replaces the original content in the manipulated stream, so when the output url switches to the live, both streams are aligned.

The output service URL can be used in any other web video player.

❗️
Important
The very first time the platform get in touch with an ad that needs to be transcoded, the transcoding processs may take few seconds. To guarantee a good user experience, the insertion won't happen during this transcoding period. So you may have to reload the preview page few seconds after your first try to be able to see the preroll ad insertion in the output stream.

Video tutorial

Want the same story but in our tutorial video? Here is it!