Share this
by Bart Van Oosterhout on March 23, 2023
React Native makes it possible for developers to build mobile and smart TV apps using just JavaScript, without the need for knowledge of native platforms. However, when it comes to video playback, many media and entertainment companies still face challenges in implementing premium features and integrations for third-party DRM, analytics, and ad insertion solutions across both iOS and Android platforms.
At THEO, we're enabling developers to create high-quality video playback experiences in React Native apps using only JavaScript, without the need for separate iOS and Android engineering teams.
We, at THEO, are excited to announce the release of our content protection (DRM) API on top of the THEOplayer React-Native SDK! This integration provides our users with a powerful and flexible solution for securing their premium content across platforms.
With our DRM API, developers can now enable digital rights management capabilities for their React Native applications, including playback policies, license acquisition, and content encryption. This allows them to protect their content from unauthorized access and piracy, while providing their users with a seamless viewing experience.
Moreover, we have an extensive list of ready-made integrations with third-party DRM solutions available to really make it easy to get started, and to accelerate your time-to-market!
What is the ContentProtectionIntegration API?
THEOplayer supports Fairplay, PlayReady and Widevine by default. In many cases however, developers are working with a multi-DRM vendor that requires a tailored integration approach. THEOplayer already includes a large number of pre-integrated solutions through partnerships with multi-DRM vendors. In addition, because there is no one-fits-all approach, an API is available that allows you to build custom DRM integrations. It gives the possibility to alter the DRM process by hooking into key points of the DRM flow, such as right before creating certificate and license request bodies, or right after receiving the responses.
The sequence diagram below depicts a simplified version of the DRM flow and how a custom integration can intervene at certain key points.
On the THEOplayer GitHub you can find a repository with a number of ready-made DRM integrations built on top of this API and ready to use in your project. This includes integrations with Axinom DRM, Microsoft Azure DRM, CastLabs DRMtoday, Comcast DRM, EZDRM, Irdeto Control, BuyDRM KeyOS, Nagra DRM, VuDRM, Verimatrix MultiDRM, Core DRM and Arris Titanium DRM.
How to implement a custom DRM integration for the THEOplayer React-Native SDK?
The implementation of a custom DRM integration for react-native-theoplayer is almost identical to the implementation for the Web SDK, and is explained in detail on our THEOplayer DRM integrations repository. This repository also contains a number of examples for well-known multi-DRM vendors.
Once the custom DRM integration is created, it needs to be registered up-front as follows:
|
import { ContentProtectionRegistry } from 'react-native-theoplayer'; |
Finally, the integrationId used on registration (in this case "myCustomDRM") should be added to the sourceDescription so that THEOplayer knows which integration to use for this source. Any additional integrationParameters needed by the custom integration can be passed here as well.
|
const source = { |
Visit our website or contact us to learn more about how to get started with THEOplayer in your React Native app.