Lumen help

Integrating Mesh Delivery with Shaka Player


Step 1: Install Shaka Player and Mesh Delivery builds

From our CDN

                <!-- Shaka Player build -->
<script src="//"></script>

<!-- Mesh Delivery plugin -->
<script src="//"></script>


To get the highest flexibility of deployment, we recommend setting the StreamrootKey in the Query Parameter "srKey".


Parameter name





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.

Install runtime and dev dependencies:

                npm install @streamroot/shakaplayer-dna-wrapper

In your application, import/require the package you want to use, like this example:

                import ShakaPlayerDnaWrapper from '@streamroot/shakaplayer-dna-wrapper';

Step 2: Set up Shaka Player and Mesh Delivery

In the HTML <body> or with npm

                <video id="demoplayer"></video>
    var videoElement = document.getElementById('demoplayer');
    var shakaplayer = new shaka.Player(videoElement);
    var playerConfig = {};
    var dnaConfig = {};
    var wrapper = new ShakaPlayerDnaWrapper(shakaplayer, "YOUR_STREAMROOT_KEY", dnaConfig);


Step 3: Visualize Mesh Delivery

Vizualization graph for Mesh Delivery

Recommended Options