React Native SDK Integration Guide

Prerequisites

Download the CONNECT Player React Native SDK; see Downloading the SDK.

opy-react-native-1.15.x-react-otvplayer-0.67.4.zip
opy-react-native-1.15.x-react-otvplayer-0.72.4.zip
opy-react-native-1.15.x-examples.zip

Homebrew or Chocolatey package managers must be available on your system.

The Android, JS and Apple native SDKs are embedded within the files delivered in this plugin.

This pattern is repeated for both 0.72.4 and 0.67.4 compatible variants.

CODE

opy-react-native-<plugin-version>-otvplayer-<react-native-version>.zip
└──┐
   ├──OTVPlayer.d.ts
   ├──OTVPlayerTypes.d.ts
   ├──package.json
   ├──react-otvplayer.min.js
   ├──React-otvplayer.podspec
   ├──ios
   │  ├──libRNOTVPlayer.a
   │  ├──OPYSDKFPS.framework
   │  │  ├──Info.plist
   │  │  └<folders for each supported architecture> 
   │  ├──RNOTVPlayer-tvOS-Bridging-Header.h
   │  └──react-otvplayer
   │     ├──RNOTVPlayer-tvOS-Bridging-Header.h
   │     ├──ReactOtvplayer.m
   │     ├──ReactOtvplayer.swift
   │     └──ReactOtvplayer.xcodeproj    
   ├──tvos
   │  ├──libRNOTVPlayerTvOS.a
   │  └──OPYSDKFPSTv.framework
   │     ├──OPYSDKFPSTv
   │     ├──Info.plist
   │     └<folders for each supported architecture>
   ├──android
   │  ├──libs
   │  │  ├──react-otvplayer-debug.aar
   │  │  ├──react-otvplayer-release.aar
   │  │  ├──otvsdk.aar
   │  │  └──build.gradle
   │  ├──src
   │  │  └──main
   │  │     ├──java
   │  │     │   └──com
   │  │     │      └──nagra
   │  │     │         └──otvplayer
   │  │     │            └──react
   │  │     │               └──plugin
   │  │     │                  └──RNOtvPluginPackage.java
   │  │     └──AndroidManifest.xml
   │  └──build.gradle
   └──web
      ├──index.js
      ├──react-otvplayer.js
      ├──react-otvplayer-debug.js
      └──react-otvplayer.js.LICENSE.txt

Development environment

NAGRA recommends using Mac for development purposes; instructions for setting up on Windows are also provided.

For Android and Apple platforms, see the React Native document Setting up the development environment and follow React Native CLI Quickstart (not Expo CLI Quickstart).
For Web/HbbTV, see the React Native for Web document Installation and follow Create React App (not Expo).

The plugin has been developed using the following dependency versions. NAGRA recommends using the following versions or higher:

Node 18.19.0
Yarn 1.22.10
CocoaPods 1.10.1

The plugin variant otvplayer-0.72.4 is built with [email protected], and it is compatible with [email protected]. See Installing a Mac development environment for more information.

The plugin variant otvplayer-0.67.4 does not support tvOS.

Steps common to all platforms

The package.json file for your applications needs to include reference to the location of the contents of the zip.

Example

As a reference to a relative file path:

package.json

JS

  "dependencies": {
    "@nagra/react-otvplayer": "file:../react-otvplayer-plugin",
  ...

Support

Apple iOS/tvOS 12.0 and above releases are supported; iOS/tvOS simulators are not supported.
Android 5.0 and above is supported; Android emulators are not supported.

Using the plugin

NAGRA recommends viewing the pages relevant to the features you wish to implement to start using SDK features. A good starting point is the Playback of clear content feature page, which will give you a player capable of unencrypted playback.