Skip to main content
Version: v2

OptiView Ads on React Native

The React Native integration is independently versioned. This guide targets react-native-theoplayer 11.4.0, while the OptiView Player SDK root is 11.6.1.

Prerequisites​

  1. Obtain an OptiView Player license compatible with OptiView Ads from the player portal.
  2. Install react-native-theoplayer 11.4.0 and enable the THEOads platform feature.

Set THEOplayer_extensionTHEOads = true in gradle.properties.

Integration​

player.source = {
  sources: {
    src: 'CHANNEL-MONETIZED-HLS-URL',
    type: 'application/x-mpegurl',
    hlsDateRange: true,
  },
  ads: [
    {
      integration: 'theoads',
      networkCode: 'NETWORK-CODE',
      customAssetKey: 'CUSTOM-ASSET-KEY',
      adTagParameters: { key: 'value' },
    },
  ],
};

React Native supports adTagParameters, but does not expose breakManifestUrl. Use the platform's OptiView Player integration for Break Manifest handling and the channel's monetized HLS URL.

Verify​

Load the channel's monetized HLS source and start playback. Confirm that the platform integration schedules a break from the Break Manifest or SSAI cues, the ad renders, and the OptiView impression appears in the portal.

More information​