Skip to main content

CSAI (Client-Side Ad Insertion)

import { createPlayer, PlayerConfig } from '@quickplay/rn-qp-nxg-player';

CSAI Overview​

Client-Side Ad Insertion (CSAI) delivers ads by having the client (video player) request ads from the ad server when it reaches ad markers in the stream or manifest (HLS/DASH).

Basic CSAI Setup​

let playerConfig: PlayerConfig = {
  ...
  adTagUrl: "<Ad URL>",
}

let player = await createPlayer(playerConfig);

IMA Ad Rendering Configuration​

The IMAAdRenderingConfiguration class provides options to configure IMA ad rendering. This configuration is only applicable for CSAI.

  • playAdsAfterTimeSeconds: Skip ads scheduled before this time (in seconds). Useful for resuming playback from a saved position. Default: null (IMA SDK default).
  • focusSkipButtonWhenAvailable (Android only): If true, the skip button will auto-focus when available (useful for TV/controller navigation). Default: null (IMA SDK default).

Example usage:

let adRenderingConfiguration = {
  playAdsAfterTimeSeconds: 300, // Resume from bookmark (seconds)
  focusSkipButtonWhenAvailable: true, // Auto-focus skip button (Android only)
}

let playerConfig: PlayerConfig = {
  ...
  adRenderingConfiguration: adRenderingConfiguration
}

Note: These settings are optional and can be customized as needed.