Prebid Video | Instream Example with JW Player (Hosted)

An example of an instream pre-roll ad using Prebid.js and JW Player (Hosted).

Place this code in the page header.


<script async src="//acdn.adnxs.com/prebid/not-for-prod/1/prebid.js"></script>
<script type="text/javascript" src="http://ssl.p.jwpcdn.com/player/v/7.2.4/jwplayer.js"></script>
<script type="text/javascript">
	jwplayer.key = "YEUwUA9wRFeDcydr"; //Test Key - replace this with your own valid JWPlayer license key
</script> <script> var pbjs = pbjs || {}; pbjs.que = pbjs.que || []; // define invokeVideoPlayer in advance in case we get the bids back from prebid before the entire page loads
var tempTag = false; var invokeVideoPlayer = function(url) { tempTag = url; } var videoAdUnit = { code: 'video1', mediaTypes: { video: { playerSize: [640, 480], context: 'instream' } }, bids: [{ bidder: 'appnexus', params: { placementId: 13232361, // Add your own placement id here
video: { skipppable: true, playback_method: ['auto_play_sound_off'] } } }] }; pbjs.que.push(function() { pbjs.addAdUnits(videoAdUnit); // add your ad units to the bid request
pbjs.setConfig({ debug: true, cache: { url: 'https://prebid.adnxs.com/pbc/v1/cache' } }); pbjs.requestBids({ bidsBackHandler: function(bids) { var videoUrl = pbjs.adServers.dfp.buildVideoUrl({ adUnit: videoAdUnit, params: { iu: '/19968336/prebid_cache_video_adunit', cust_params: { section: 'blog', anotherKey: 'anotherValue' }, output: 'vast' } }); invokeVideoPlayer(videoUrl); } }); }); </script>

Place this code in the page body.


<!--player div-->
<div id="playerContainerJW" style='width:640px; height:480px; border:1px solid black;'></div>
<script>
	var jwPlayerInstance = jwplayer("playerContainerJW");
	
	invokeVideoPlayer = function(url) {
	    jwPlayerInstance.setup({
	        "file": "http://video-demo.appnexus.com/pbjs/JWPlayerDemo/AppNexus_Summit_Video_HighRes.mp4",
	        "width": 640,
	        "height": 480,
	        "autostart": true,
	        "mute": true,
	        "advertising": {
	            client: "vast",
	        }
	    });
	
	    jwPlayerInstance.on('beforePlay', function() {
	        jwPlayerInstance.playAd(url);
	    })
	}
	
	if (tempTag) {
	    invokeVideoPlayer(tempTag);
	    tempTag = false;
	}

</script>