This guide explains how you set up THEOplayer in combination with the KeyOS BuyDRM, a partnered multi-DRM vendor. THEOplayer is pre-integrated with KeyOS and provides a user-friendly API to connect to their Widevine and PlayReady DRM solutions.
If you are already comfortable with the THEOplayer API, you can go straight over to DRM Pre-Integration API.
The following topics will be covered:
There are two prerequisites in order to continue with this guide:
If you can place a checkmark next to these two fields, you are good to go.
You will need a valid THEOplayer set-up. If you have no experience with setting up our player, we have an excellent getting started guide.
Starting from the basic template above, you only need to add your BuyDRM token (=customdata) to your source configuration, and tell THEOplayer that you are using KeyOS.
player.source = {
sources : {
src : 'your.mpd',
type : 'application/dash+xml',
drm : {
integration : 'keyos',
customdata : 'PEtleU9T...blhNTD4=',
playready: {
licenseAcquisitionURL: '<LICENSE_KEY_URL_PLAYREADY>'
},
widevine: {
licenseAcquisitionURL: '<LICENSE_KEY_URL_WIDEVINE>'
}
}
}
}
Your updated starting template would now look like this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>THEOplayer Web SDK: Getting Started</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href='/path/to/ui.css'> <!-- ads THEOplayer CSS -->
</head>
<body>
<div class="theoplayer-container video-js theoplayer-skin theo-seekbar-above-controls"></div>
<script type='text/javascript' src='/path/to/THEOplayer.js'></script> <!-- ads THEOplayer library -->
<script>
var element = document.querySelector('.theoplayer-container');
var player = new THEOplayer.Player(element);
player.source = {
sources : [{
src : 'your.mpd',
type : 'application/dash+xml',
drm: {
integration: 'keyos',
customdata: 'PEtleU9T...blhNTD4=',
playready: {
licenseAcquisitionURL: '<LICENSE_KEY_URL_PLAYREADY>'
},
widevine: {
licenseAcquisitionURL: '<LICENSE_KEY_URL_WIDEVINE>'
}
}
}]
};
</script>
</body>
</html>
A KeyOS DRM integration is added to the source configuration by adding the keyOsDrm() parameter to drm as such:
public static var buyDRMkeyOS: SourceDescription {
let licenseAcquisitionURL: String = "<LICENSE_KEY_URL_FAIRPLAY>"
let certificateURL: String = "<CERTIFICATE_URL_FAIRPLAY>"
let token: String = "<TOKEN_FAIRPLAY>"
let type: String = "application/x-mpegURL"
let src = "<HLS_STREAM_URL>"
let drm: KeyOSDRMConfiguration = KeyOSDRMConfiguration(licenseAcquisitionURL: licenseAcquisitionURL, certificateURL: certificateURL, customdata: token)
let typedSource: TypedSource = TypedSource(src: src, type: type, drm: drm)
let source: SourceDescription = SourceDescription(source: typedSource)
return source
}
// Configure the player's source to initilaise playback
THEOplayer.source = buyDRMkeyOS
Where:
token
for customdata is the Authentication XML generated from their platform.
Note: BuyDRM KeyOS iOS Pre-integration is only available from version 2.64.0 and above
A KeyOS DRM integration is added to the source configuration by adding the keyOsDrm() parameter to drm as such:
SourceDescription dashWithDRM = sourceDescription()
.sources(
typedSource("//sourceUrl")
.drm(
keyOsDrm()
.customdata("//token")
.playready("//playReadyKeyServer")
.widevine("//widevineKeyServer")
.build()
).build()
).build();
Where:
token
for customdata is the Authentication XML generated from their platform.
THEOplayer partnered with KeyOS to fully pre-integrate their BuyDRM solution, saving you tons of time. This pre-integration brings along multiple advantages.