The modular HTML5 player from Bitmovin is easy to customize as you only need to configure the parts you need. Learn how to integrate Bitmovin with Axinom DRM to protect your content.

Bitmovin Player

The Bitmovin player is a modular HTML5 player that is easy to customize. Thanks to being modular, you only need to configure the parts that you need. The player plays videos instantly and reduces buffering. The Bitmovin player streams across all major platforms.

Bitmovin player can be integrated with Axinom DRM. You can find the specific instructions below.

Integrating Bitmovin Player with Axinom DRM

It is easy to integrate Bitmovin player with Axinom DRM. Use the sample below to do this. To integrate Bitmovin player:

  1. Create an element on your HTML page by adding the following line within the HTML body:

        <div id="my-player"></div>
  2. Embed the player source file into the HTML file. Add the following script inside the head of the HTML file.

        <head>
            <meta charset="utf-8">
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
            <script type="text/javascript" src="https://cdn.bitmovin.com/player/web/8/bitmovinplayer.js"></script>
        </head>
  3. Set the player configurations by adding the following line inside your loader method which is executed when you load the player. Start with a common configuration as seen in the example below. Please replace xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx with your player license key, which is shown on the Bitmovin dashboard when you are logged in with your account.

        const playerConfig = {
            key: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx'
        };
  4. Initialize a new instance of the player by adding the following line inside your loader method which is executed when you load the player.

        videoEl = document.getElementById('my-player');
        player = new bitmovin.player.Player(videoEl, playerConfig);
  5. Set the License URL in the format below. For the keySystem, you need to set the related keysystem (possible values: "playready", "widevine", "fairplay").

            var protection = {
                dash: $urlInput.val(),
                drm: {
                    [keySystem]: {
                        LA_URL: {}
                    }
                }
            };
    
    
            protection.drm[keySystem].LA_URL = license;
  6. Pass the license request token and the License request URL within the player configurations.

            const playerConfig = {
                key: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
                network: {
                    preprocessHttpRequest: function (requestType, requestConfig) {
                        requestConfig.url = requestConfig.url + "?AxDrmMessage="+[token];
                    }
                }
            };
  7. Finally, you can open the player, which is now integrated with DRM.

        player.load(protection).then(function () {
                console.log('The video has now been loaded!');
        }).catch(onError);

Bitmovin Player Tool in Portal

Note that under My DRM >> Tools >> DRM Video Playback, you can actually try out the Bitmovin player and check whether your video plays with it. This tool allows you to play the DRM-protected video as well as generate and adjust the Entitlement Message. Copy the video URL, the JWT, and the license acquisition URL and choose Bitmovin player from the drop-down menu at the bottom. Click Launch Player to see whether your video plays with Bitmovin. The player launches in a new tab.

Revision History

The table below outlines the document versions and any changes between them.

Version Date Description

1.0

July 21, 2021

  • Initial version.