# Client-Side Ad Insertion (CSAI)

Note

This feature is available only to ByteArk Video Cloud for Business customers. Please contact sales@byteark.com if you would like to use it.

ByteArk Player supports Client-Side Ad Insertion (CSAI), inserting ads into live-streaming sessions while viewers watch.

# Requirements

An HLS live-streaming URL with Ad Insertion enabled by ByteArk
An ad server that supports ad break duration requests

# Enable CSAI

Enable CSAI by setting plugins.bytearkCsai in options when creating the player. Configure parameters per the options table below.

{
  fluid: true,
  poster: '/assets/samples/player/images/poster-big-buck-bunny.jpg',
  sources: [{
    title: 'Live Stream',
    src: '<LIVE_STREAM_URL>',
    type: 'application/x-mpegURL'
  }],
  plugins: {
    bytearkCsai: {
      debug: true,
      adTagUrl: '<AD_SERVER_URL>',
    }
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

# Options

Name	Type	Required	Description
debug	Boolean	No	Enable/disable debug mode
adTagUrl	String	Yes	Ad server URL that supports ad break duration requests
integration	String	No	Ad integration: `google-ima`
adTagParameters	Object	No	Key-value parameters to send to the ad server

# Example

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <div id="video-player"></div>
    <script src="https://byteark-sdk.cdn.byteark.com/player/v2/byteark-player.min.js"></script>
    <script>
      var player = bytearkPlayer('video-player', {
        fluid: true,
        sources: [{
          title: 'Live Stream',
          src: '<LIVE_STREAM_URL>',
          type: 'application/x-mpegURL'
        }],
        plugins: {
          bytearkCsai: {
            adTagUrl: '<AD_SERVER_URL>',
          }
        }
      });
    </script>
  </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

# Sending adTagParameters to Google Ad Manager

Add integration: 'google-ima' to the bytearkCsai plugin options.
Add adTagParameters with the keys and values you want to send. See the VAST ad tag URL parameters documentation (opens new window).

Note

If a key in adTagParameters matches one in the adTagUrl query string, the value from adTagParameters overrides it.

# Using macros for Google Ad Manager

{
  ...
  integration: 'google-ima',
  adTagParameters: {
    url: '[url]'
  }
}

1
2
3
4
5
6
7

Supported macros

Macro	Type	Value	Description
url	String	`[url]`	Current page URL where the video is playing

← Advertisement HLS ClearKey →