This example uses a test version of Prebid.js hosted on our CDN that is not recommended for production use. It includes all available adaptors. Production implementations should build from source or customize the build using the Download
page to make sure only the necessary bidder adaptors are included.
Line 11 to 14: Pre-define
Because we have no way of knowing when all the bids will be returned from prebid we can’t be sure that the browser will reach the point where
invokeVideoPlayer is defined before bidsBackHandler fires and tries to call it. To prevent a
invokeVideoPlayer not defined error, we pre-define it before we make the call to prebid, and redefine it later on with the code to create the player and play the ad. In this first version it simply stores the winning vast to use later.
Line 20 to 36: Create a video ad unit
Create a video ad unit to request bids for. The
code is the name we’ll use to refer to this ad unit throughout the prebid code. Make sure you include the
mediaType: 'video' and replace the
placementId with your own valid placement ID.
Line 36 to 52: Log the bids for debugging
Log information about the bids to the console, including whether any bids were returned. This isn’t strictly necessary, but is useful for debugging.
Line 54 to 73: Add the ad units and request bids
Add the ad units you want to request bids for to prebid, and then call
requestBids(), passing in a json object. In the json object, define the
bidsBackHandler callback which will run once all the bids are returned.
Line 60 to 70: Build masterVideoTag and call invokeVideoPlayer
Once we have the bids back,
bidsBackHandler will be called. Inside this callback, we create the masterVideoTag and pass it to the video player by calling
Line 112 to 128: Include Kaltura player script
Add the script for your Kaltura player. This will be part of the code you will copy paste from Kaltura.
Line 112 to 128: Embed the Kaltura Player
kWidget.embed() and pass in a JSON object of your player settings. Most of this JSON object will be part of the code you will copy paste from Kaltura.
Line 118 to 121: Add vast settings to the player settings
flashVars, add another key called
"vast" and pass in a JSON object with the position you want to play your ad, and the url of the ad, which in this case will be the
url we got back from prebid.
Line 124 to 127: Add a ready callback and get a reference to the player
Add a ready callback to the player settings. This allows us to get a reference to the player, stored in the variable
kdp in order to interact with it later.
Line 131 to 134: Account for page speed
If prebid returned bids before the browser reached the end of the page, the first version of
invokeVideoPlayer will have been called from
bidsBackHandler so the winning vast tag will be stored in tempTag. If that’s the case, we want to call the ‘real’ version of
invokeVideoPlayer with the stored url to create the player and play the ad. If
tempTag is not defined, that means the browser reached the end of the page before the bids came back from prebid, meaning the ‘real’ version of
invokeVideoPlayer was already called.