logo

Introduction

THEOplayer supports Fairplay, PlayReady and Widevine by default. To connect to such a DRM system, developers can use a ContentProtectionDescription (or DRMConfiguration, depending on the SDK). However, more often than not, developers are working with a multi-DRM vendor. These vendors take care of their DRM needs. The last challenge for developers is to integrate the provided DRM solution in a video player. THEOplayer is partnered with many multi-DRM vendors to lighten this burden. In our partnerships, we validate the compatibly and often provide integrations.

Table of Contents

Pre-integrations

THEOplayer is pre-integrated with a number of commercial multi-DRM vendors.

Custom configuration

Developers can use the generic DRM-functionalities in case in-house DRM-solutions are used, or services from DRM-vendors are used which haven't been pre-integrated by THEOplayer.

Web SDK

To configure DRM on the Web SDK, developers can put a ContentProtectionDescription inside of a SourceDescription.

if (HLS) {
    let drmConfiguration = {
        "fairplay": {
            "licenseAcquisitionURL": "<LICENSE_KEY_URL_FAIRPLAY>",
            "certificateURL": "CERTIFICATE_URL>"
            // "certificate": "<CERTIFICATE_AS_STRING_OR_UInt8Array>",
            // "headers": {"<KEY>": "<VALUE>"},
            // "useCredentials": <true||false>
        }
    };
    player.source = {
        "sources": {
            "src": "<HLS_STREAM_URL>",
            "type": "application/x-mpegurl",
            "contentProtection": drmConfiguration
        }
    }
} else if (MPEG-DASH) {
    let drmConfiguration = {
        "playready": {
            "licenseAcquisitionURL": "<LICENSE_KEY_URL_PLAYREADY>"
            // "headers": {"<KEY>": "<VALUE>"},
            // "useCredentials": <true||false>
        },
        "widevine": {
            "licenseAcquisitionURL": "<LICENSE_KEY_URL_WIDEVINE>"
            // "headers": {"<KEY>": "<VALUE>"},
            // "useCredentials": <true||false>
        }
    };
    player.source = {
        "sources": {
            "src": "<DASH_STREAM_URL>",
            "type": "application/dash+xml",
            "contentProtection": drmConfiguration
        }
    }
}
Android SDK

To configure DRM on the Android SDK, developers can put a DRMConfiguration inside of a SourceDescription.

// Map<String, String> headers =  new HashMap<String, String>();
// headers.put("<KEY>", "<VALUE>");
DRMConfiguration drmConfiguration = new DRMConfiguration.Builder()
    .widevine(
        new KeySystemConfiguration(
            "<LICENSE_KEY_URL_WIDEVINE>"
            // , headers, <USE_CREDENTIALS>, <QUERY_PARAMETERS>
        )
    )
    .build();
TypedSource typedSource = new TypedSource.Builder()
    .src("<DASH_STREAM_URL>")
    .drm(drmConfiguration)
    .build();
SourceDescription sourceDescription = SourceDescription.Builder.sourceDescription()
    .sources(typedSource)
    .build();
theoplayer.getPlayer().setSource(sourceDescription);
iOS SDK

To configure DRM on the iOS SDK, developers can put a FairPlayDRMConfiguration inside of a SourceDescription.

// let headers = [["<KEY>": "<VALUE>"]]
let drmConfiguration = FairPlayDRMConfiguration(
    licenseAcquisitionURL: "<LICENSE_KEY_URL_FAIRPLAY>",
    certificateURL: "<CERTIFICATE_URL>"
        // , headers: headers, licenseType: <LICENSE_TYPE>
)
let typedSource = TypedSource(src: "<HLS_STREAM_URL>", type: "application/x-mpegurl", drm: drmConfiguration)
let sourceDescription = SourceDescription(source: typedSource)
theoplayer.source = sourceDescription
Roku SDK

In order to play DRM protected resources, you will need to pass extra DRM parameters. To see what kind of DRM protection is supported by Roku devices, please visit this page.

In the following example, there is a function called "setSource", which sets the source of a THEOplayer instance ("m.player.source").

It is worth mentioning that "m" works like the "this" keyword from other languages. A "m" keyword points to the current component local namespace. Therefore, in case you want to access a variable across different functions inside the same component, use "m" to do so.

function setSource(streamFormat)
  if streamFormat = "hls" then
    drmParams = {
      "integration": "Widevine",
      "licenseUrl": "<LICENSE_KEY_URL_WIDEVINE>"
    }
    m.player.source = {
      "poster": "pooster.png",
      "sources": [
        {
          "contentProtection": drmParams,
          "src": "<HLS_STREAM_URL>",
          "type": "application/x-mpegURL"
        }
      ]
    }
  end if
  if streamFormat = "dash" then
    drmParams = {
      "integration": "Widevine",
      "licenseUrl": "<LICENSE_KEY_URL_WIDEVINE>"
    }
    m.player.source = {
        "poster": "pooster.png",
        "sources": [
          {
            "contentProtection": drmParams,
            "src": "<DASH_STREAM_URL>",
            "type": "application/dash+xml"
          }
        ]
    }
  end if
end function

Custom Integration

Developers can make their own custom DRM integration instead of using the pre-integrations offered by THEOplayer. This can be done by making use of the DRM integration API repository.

A complete guide on how to create a new integration, and some example integrations can be found in the provided repository.

github
Make sure to follow us on GitHub!
THEO-logo-white
twitter
facebook
linkedin
Copyright © 2020. All Rights Reserved.
Leuven
New York
Singapore
Barcelona