Articles in this section

See more

Azure Media Player

Note
This is an early access version of our plugin. Some improvements are expected.

 

Supported Versions 

We have built an optimized wrapper for Azure Media Player from v2.1.4.

 

Step 1: Install Azure Media Player and Streamroot build

Include this sources in the HTML <head>.

<!--Azure Media Player build -->
<link href="//amp.azure.net/libs/amp/latest/skins/amp-default/azuremediaplayer.min.css" rel="stylesheet">
<script src="//amp.azure.net/libs/amp/latest/azuremediaplayer.min.js"></script>

<!-- Streamroot wrapper -->
<script src="//cdn.streamroot.io/azuremp-dna-wrapper/1/stable/azuremp-dna-wrapper.js"></script>

 

Step 2: Set up Azure Media Player and Streamroot

In the HTML <body> or with npm

<div id="video-div">
    <video id="demoplayer" class="azuremediaplayer amp-default-skin" />
</div>
<script>
    var player = amp('demoplayer', {});
    var dnaConfig = {};
    var wrapper = new AzureMPDnaWrapper(player, 'YOUR_STREAMROOT_KEY', dnaConfig);
    window.player = player;
    player.src([{
        src: 'YOUR_PLAYLIST_URL',
        type: 'application/vnd.ms-sstr+xml',
    }]);
</script>

 

Parameter name Mandatory Description
dnaConfig No

The object in which you can pass Streamroot options (property, contentIdGenerator, id ...).
YOUR_STREAMROOT_KEY Yes The unique Streamroot key that we have assigned to you; make sure it is identical to the one provided in the Account section of your dashboard.
YOUR_PLAYLIST_URL Yes Your Azure Media Player playlist.

 

Step 3: Visualize Streamroot

In order to verify if Streamroot is correctly configurated, please install our DNA Graphs.

Related articles