AMP - Customer integration overview

Document created by Herberth Alvarado Champion on Mar 23, 2016Last modified by Herberth Alvarado Champion on Jan 26, 2017
Version 15Show Document
  • View in full screen mode

Maintainer: Andrea Zuniga

This document is part of Adaptive Media Player Web User Guide


A step by step of how to do a usable setup of the AMP.


  1. Deploy the player onto a web host (NetStorage or other origin)
  2. Create a web service that describes each video/audio item for the player.
    This service should return a JSON “single-item feed” that contains media id, title, description, stream links, closed caption link or indicator, post image path, and any content-related fields needed for reporting or ad calls.
  3. Customize a player configuration file
      1. Insert your Media Analytics beacon path and any custom dimensions
      2. Configure your ad provider (DFP Premium, Auditude, or Freewheel)
      3. Configure Comscore, Nielsen, and Omniture
      4. Configure Identity Services (if being used)
      5. Add your own share handler JS method
      6. Configure Akamai Identity Services
      7. Define a specific skin
      8. Test live “midrolls” with cuepoints from your encoder
  4. Embed the player into your (dev) site with Javascript

How to Embed

The Akamai Media Player “Single Embed” method presents the Flash and HTML5 players in a simplified Javascript wrapper via a Javascript class called “AMP” or “AMPPremier”.

The responsibility of this AMP wrapper object is to:

  1. Simplify embedding of multiplatform player (by delegating API calls to the proper player)
  2. Simplify scripted interactions with a multi-platform player after the initial embed
  3. Hide the device-detect and stream-select complexity
  4. Hide other embed complexity such as the common SWFObject


Direct Embed: Follow the example included in feed-json.htmlsjc-mpdlg:Users:dhu:Desktop:Screen Shot 2015-04-10 at 11.53.17 AM.png


The simple embed process is:

  1. Include the CSS
  2. Include the AMP JS script
  3. Pass the player defaults via config JSON file
  4. Provide embed-time overrides (set the media to play and/or configure any feature)
  5. Instantiate the AMP object, associating it with a <div> on the page. The player will take on the size of the <div> in a responsive manner


Create the AMP player:amp = akamai.amp.AMP.create("akamai-media-player", config, readyHandler);

And then you can use one of the two following options when calling the player:


Option 1: with load defaultsakamai.amp.AMP.loadDefaults("../amp.premier/amp.premier.xml", function () {// defaults loaded});

Option 2: without load defaultsakamai.amp.AMP.create("akamai-media-player", config_override, handlerFunction);


Another option is to embed as source to iframe of destination site(s)<iframe id="playerFrame" src=”http://domain/player.html” frameborder="0" width="640" height="360"></iframe>


The result is the player appears, with the player automatically selecting Flash or HTML5 mode.


This document is part of Adaptive Media Player Web User Guide