VideoJS

Requirements

For ad support in VideoJS, you might need extra 3rd party plugins:

One for managing the lifecycle of ads, handling errors, switching from the ad to the content, triggering the proper events (like ad starting, ad 50% through, ad ended, etc)
One for setting up the ads, "telling" VideoJS what to play in an ad slot and communicating with the ad manager.

Our VideoJS plugin assumes you're using videojs-contrib-ads so it listens for events generated by it. If your VideoJS plugin stack differs you might have to either use our custom events functionality or get in touch with us to add support for your plugin stack.

NOTE

Because the apiKey is set to an invalid value on the demo page you will receive a 401 Unauthorized HTTP message back for every message sent to our collector endpoint. This will not happen in a production environment when using a valid key.

Load

The plugin url is in the form

https://cdn.watchingthat.net/***.wtat.plugin-vjs_ima.min.js

You must replace *** with the Watching That customer ID received from us.

<script src="https://url/to/videojs.min.js"></script>
<script src="https://url/to/videojs-contrib-ads/videojs.ads.min.js"></script>
<script src="https://cdn.watchingthat.net/***.wtat.plugin-vjs_ima.min.js"></script>

Init

Once the plugin has been loaded you can then start it:

<script>
const player = videojs('content_video');
player.wtAdTracer({ apiKey: '<api key you got from WatchingThat>' });
</script>

See the Plugin Configuration Reference for the options you can use to start the plugin (only apiKey is required).