React Native Video Player

React-native-video is basically a package that allows a video component to be shown/used within React Native.

The react-native-video player is easily configurable with Axinom DRM.

This sample application demonstrates how to use Axinom DRM for playback using React Native Video Player. This project uses react-native-video npm package.

Prerequisites

In order to use this sample the following prerequisities should be met:

Registration can be performed from the following link: https://www.axinom.com/products/drm.

Documentation on this can be found here: https://github.com/Axinom/drm-quick-start.

You can install react-native-video npm package using npm i react-native-video. For further information please refer to https://www.npmjs.com/package/react-native-video.

Setup

You can find the sample codes in our github repo.

This repo consists of a working react native video player. You can clone the sample code and build the code using Xcode or Android Studio. Then you can transfer the build file to your device and try out the playback.

From the scratch

You can install react-native-video npm package using npm i react-native-video. For further information please refer to https://www.npmjs.com/package/react-native-video.

To intgrate DRM, you need to specify the DRM details in the video element in the App.js file.

1. Widevine & Playready

   drm= {{
       type: '<DRM_Type>',
       licenseServer:'<License_server_url>',
       headers: {
           'X-AxDRM-Message':'<token>',
           'Content-Type': 'application/octet-stream'
       }
   }}

2. Fairplay

drm= {{
    type: 'fairplay',
    licenseServer:'https://drm-fairplay-licensing.axprod.net/AcquireLicense',
    certificateUrl: 'https://vtb.axinom.com/FPScert/fairplay.cer',
    headers: {
        'X-AxDRM-Message':'<token>',
        'Content-Type': 'application/octet-stream'
    }
}}

note

The code needs to be edited according to the README.md file that can be found in https://github.com/Axinom/drm-quick-start-react-native/blob/main/README.md

Using Simulator

Important: Protected streams cannot be played back on Simulator.