This module is currently supported for:
The Widevine Modular Custom Request DRM Handler handles the DRM setup for encrypted playback in the video player. This module provides developers an opportunity to modify the request and response of a Widevine license acquisition request. The following steps are performed whenever Widevine DRM authentication with custom license request is done in the video player of an application:
source.drmScheme
property must be set to "widevine_modular_custom_request"
for initialization of the Widevine DRM authentication process.
If the PlayerResource API is being used to play video, the loadSource
method call must include { drmScheme: "widevine_modular_custom_request" }
.DRM_POST_REQUEST_AVAILABLE
event with the following arguments:
tag: number or string
- The Video
component tag or the PlayerResource
tag corresponding to the request.drmRequestUrl
: The DRM request URL.
drmRequestUrl
is of string type.postData
: An array of bytes representing the data posted as the body of the request.headers
: An object for which the each property represents a header, where property name is the header key and the property value is the header value.drmRequestUrl
, postData
, and headers
, with any necessary modifications, to handle all license acquisition network calls to get the required license data.WidevineCustomRequestDrmHandler.NotifySuccess
.
Once the license data is provided to the video player, it is ready to play the DRM-protected media.NotifyFailure
must be emitted if any error occurs after the DRM_POST_REQUEST_AVILABLE
event is emitted by the video player, and before NotifySuccess
has been emitted by the App, to notify the video player of the error and stop the DRM request.
If there is an issue during the above flow, the Video
or VideoRef
component’s onErrorOccurred
function, or the PlayerResource
event error
, is called.
removeEventListener(type, handler)
Type: DrmEventName
- The name of the DRM event being listened to.handler: Function
- The call to the function that will handle the event.addEventListener(type, handler)
Type: DrmEventName
- The name of the DRM event to listen to.handler: Function
- The call to the function that will handle the event.notifySuccess(tag, array)
tag: number or string
- The video tag that returns the same tag passed into the Widevine DRM event being handled.array: licenseData
- The widevine license data.notifyFailure(tag)
tag: number or string
- The video tag that returns the same tag passed into the Widevine DRM event being handled.Include the following header file in the app’s main .cpp file, such as app.cpp
, to ensure the Widevine Custom Request DRM Handler module is included in the app:
#include <youireact/modules/drm/WidevineCustomRequestDrmHandlerModule.h>
The following code snippet illustrates how to initialize Widevine DRM playback with a custom license request by setting the DRM scheme to widevine_modular_custom_request
with a video source object:
// This corresponds to step 1 in the Video/VideoRef component
source: {
uri: "sourceuri://",
type: "HLS",
drmScheme: "widevine_modular_custom_request",
drmInfo: {
licenseAcquisitionUrl:"https://licenseUrl.com" // Where this URL is replaced with the Widevine License URL
}
}
The following code snippet illustrates the authentication process using the Widevine Custom Request DRM Handler module:
import { WidevineCustomRequestDrmHandler } from '@youi/react-native-youi';
var base64 = require('base-64');
export default class TestVideo extends Component {
constructor(props) {
super(props);
// Connect to the event listener to the WidevineCustomRequestDrmHandler module.
WidevineCustomRequestDrmHandler.addEventListener('DRM_POST_REQUEST_AVAILABLE', this.onWidevineDRMPostRequestAvailable);
}
// Handling of the DRM_POST_REQUEST_AVAILABLE event.
// This corresponds to step 2
onWidevineDRMPostRequestAvailable = (args) => {
// Use the arguments, which represent the information required for a POST request to carry out license acquisition network calls
// This corresponds to step 3
// In this case we're using an XMLHttpRequest to call the license request exactly as it would have been posted, but you can modify the license request and response as you wish
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("POST", args.drmRequestUrl, true);
// Configure the HTTP request to send and receive binary data
xmlhttp.responseType = "arraybuffer";
xmlhttp.setRequestHeader("Content-Type", "application/octet-stream");
// Set custom request headers if they're included
for (var headerKey in args.headers) {
if (args.headers.hasOwnProperty(headerKey)) {
xmlhttp.setRequestHeader(headerKey, args.headers[headerKey]);
}
}
// Set the response callback function
xmlhttp.onload = function() {
if (xmlhttp.status === 200) {
if(xmlhttp.response) {
var typedArray = new Uint8Array(xmlhttp.response);
const array = [...typedArray];
// Return the license data as an array of bytes
// This corresponds to step 4
WidevineCustomRequestDrmHandler.notifySuccess(args.tag, array);
}
}
else
{
console.error("Unhandled HTTP DRM request result: {status: " + xmlhttp.status + ", response text: " + xmlhttp.responseText + "}");
WidevineCustomRequestDrmHandler.notifyFailure(args.tag);
}
};
// Send the POST request
xmlhttp.send(new Uint8Array(args.postData));
}
}