AMP with hls.js and Media Acceleration

MA SDK Statistics
0 MB

CDN 		0 MB

P2P 		0 MB

Uploaded
0 %

Offload 		0 %

Offload last 20 s 		0

Peers

Here, you'll find basic instructions on how to integrate the Media Acceleration SDK with the AMP player using hls.js.

How to

  1. Locate the spot in your code where you are providing a configuration to AMP:

    /* Before MASDK integration */

    var config = {
      hls: {
        resources: [
          { src: "#{paths.resources}js/hls.min.js", type: "text/javascript" }
        ]
      }
    };

  2. Add the Akamai P2P SDK as a resource and provide the mae enabled option:

    /* After MASDK integration */

    var config = {
      hls: {
        resources: [
          { src: "#{paths.resources}js/hls.min.js", type: "text/javascript" },
          { src: "https://media-acceleration-host.akamaized.net/sdk/js/2.8/hlsjs.min.js", debug: "https://media-acceleration-host.akamaized.net/sdk/js/2.8/hlsjs.min.js", type: "text/javascript" }
        ]
      }
      mae: {
        enabled: true, // add any MA SDK options here
      }
    };

What you should see

Once the AMP player is ready, you can get the version of the Akamai P2P SDK by accessing the version property:

var amp = akamai.amp.AMP.create("amp", config, function (readyEvent) {
  readyEvent.player.addEventListener("canplaythrough", function (playEvent) {
    console.log(playEvent.player.mae.version);
  });
});

For a complete example we recommend that you view the source code of this demo page or download the SDK and simple example pages at the Media Acceleration SDK page.