Radiant Media Player
Radiant Media Player(https://www.radiantmediaplayer.com) is a cross-device HTML5 video & audio player which allows to play DRM protected content.
Radiant Media player can be easily integrated with Axinom DRM. You can find the specific instructions below.
Integrating Radiant Media Player with Axinom DRM​
-
Embed the player source file into the HTML file. Add the following script inside the head of the HTML file.
<head>
<script src="https://cdn.radiantmediatechs.com/rmp/9.15.0/js/rmp.debug.js"></script>
</head> -
Create a div container with a unique id. So the video and UI elements will be appended to this container.
<div id="rmp"></div>
-
Pass your media URL.
const src = {
dash: 'https://media.axprod.net/TestVectors/Cmaf/protected_1080p_h264_cbcs/manifest.mpd'
}; -
Acquire a license key from Radiant media player through https://www.radiantmediaplayer.com/free-trial.html
licenseKey: 'Your-Radiant-media-player-license-key',
-
Specify the license server URL.
shakaDrm: {
servers: {
'com.widevine.alpha': 'https://drm-widevine-licensing.axtest.net/AcquireLicense'
}
}, -
Specify the license token.
shakaRequestConfiguration: {
license: {
headers: {
'X-AxDRM-Message': 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.ewogICJ2ZXJzaW9uIjogMSwKICAiY29tX2tleV9pZCI6ICI2OWU1NDA4OC1lOWUwLTQ1MzAtOGMxYS0xZWI2ZGNkMGQxNGUiLAogICJtZXNzYWdlIjogewogICAgInR5cGUiOiAiZW50aXRsZW1lbnRfbWVzc2FnZSIsCiAgICAidmVyc2lvbiI6IDIsCiAgICAibGljZW5zZSI6IHsKICAgICAgImFsbG93X3BlcnNpc3RlbmNlIjogdHJ1ZQogICAgfSwKICAgICJjb250ZW50X2tleXNfc291cmNlIjogewogICAgICAiaW5saW5lIjogWwogICAgICAgIHsKICAgICAgICAgICJpZCI6ICIzMDJmODBkZC00MTFlLTQ4ODYtYmNhNS1iYjFmODAxOGEwMjQiLAogICAgICAgICAgImVuY3J5cHRlZF9rZXkiOiAicm9LQWcwdDdKaTFpNDNmd3YremZ0UT09IiwKICAgICAgICAgICJ1c2FnZV9wb2xpY3kiOiAiUG9saWN5IEEiCiAgICAgICAgfQogICAgICBdCiAgICB9LAogICAgImNvbnRlbnRfa2V5X3VzYWdlX3BvbGljaWVzIjogWwogICAgICB7CiAgICAgICAgIm5hbWUiOiAiUG9saWN5IEEiLAogICAgICAgICJwbGF5cmVhZHkiOiB7CiAgICAgICAgICAibWluX2RldmljZV9zZWN1cml0eV9sZXZlbCI6IDE1MCwKICAgICAgICAgICJwbGF5X2VuYWJsZXJzIjogWwogICAgICAgICAgICAiNzg2NjI3RDgtQzJBNi00NEJFLThGODgtMDhBRTI1NUIwMUE3IgogICAgICAgICAgXQogICAgICAgIH0KICAgICAgfQogICAgXQogIH0KfQ._NfhLVY7S6k8TJDWPeMPhUawhympnrk6WAZHOVjER6M'
}
}
} -
Reference the div container.
const elementID = 'rmp';
-
Create an object based on RadiantMP constructor.
const rmp = new RadiantMP(elementID);
-
Initialize the player.
rmp.init(settings);
Also you can refer to https://www.radiantmediaplayer.com/guides/working-with-axinom-drm.html for further reading.
-
Example code.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>RMP</title>
</head>
<body>
<!-- Include Radiant Media Player JavaScript library -->
<script src="https://cdn.radiantmediatechs.com/rmp/9.15.0/js/rmp.debug.js"></script>
<!-- Add a div container with a unique id -->
<div id="rmp"></div>
<!-- Set up player configuration options -->
<script>
const src = {
dash: 'https://media.axprod.net/TestVectors/Cmaf/protected_1080p_h264_cbcs/manifest.mpd'
};
const settings = {
licenseKey: 'Your-Radiant-media-player-license-key',
src: src,
width: 640,
height: 360,
shakaDrm: {
servers: {
'com.widevine.alpha': 'https://drm-widevine-licensing.axtest.net/AcquireLicense'
}
},
shakaRequestConfiguration: {
license: {
headers: {
'X-AxDRM-Message': 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.ewogICJ2ZXJzaW9uIjogMSwKICAiY29tX2tleV9pZCI6ICI2OWU1NDA4OC1lOWUwLTQ1MzAtOGMxYS0xZWI2ZGNkMGQxNGUiLAogICJtZXNzYWdlIjogewogICAgInR5cGUiOiAiZW50aXRsZW1lbnRfbWVzc2FnZSIsCiAgICAidmVyc2lvbiI6IDIsCiAgICAibGljZW5zZSI6IHsKICAgICAgImFsbG93X3BlcnNpc3RlbmNlIjogdHJ1ZQogICAgfSwKICAgICJjb250ZW50X2tleXNfc291cmNlIjogewogICAgICAiaW5saW5lIjogWwogICAgICAgIHsKICAgICAgICAgICJpZCI6ICIzMDJmODBkZC00MTFlLTQ4ODYtYmNhNS1iYjFmODAxOGEwMjQiLAogICAgICAgICAgImVuY3J5cHRlZF9rZXkiOiAicm9LQWcwdDdKaTFpNDNmd3YremZ0UT09IiwKICAgICAgICAgICJ1c2FnZV9wb2xpY3kiOiAiUG9saWN5IEEiCiAgICAgICAgfQogICAgICBdCiAgICB9LAogICAgImNvbnRlbnRfa2V5X3VzYWdlX3BvbGljaWVzIjogWwogICAgICB7CiAgICAgICAgIm5hbWUiOiAiUG9saWN5IEEiLAogICAgICAgICJwbGF5cmVhZHkiOiB7CiAgICAgICAgICAibWluX2RldmljZV9zZWN1cml0eV9sZXZlbCI6IDE1MCwKICAgICAgICAgICJwbGF5X2VuYWJsZXJzIjogWwogICAgICAgICAgICAiNzg2NjI3RDgtQzJBNi00NEJFLThGODgtMDhBRTI1NUIwMUE3IgogICAgICAgICAgXQogICAgICAgIH0KICAgICAgfQogICAgXQogIH0KfQ._NfhLVY7S6k8TJDWPeMPhUawhympnrk6WAZHOVjER6M'
}
}
}
};
<!-- Reference the div container-->
const elementID = 'rmp';
<!-- Create an object based on RadiantMP constructor-->
const rmp = new RadiantMP(elementID);
<!-- Player initialisation only after API events are registered -->
rmp.init(settings);
</script>
</body>
</html>