Get Started with the Bitmovin Player

To get the newest version of the Bitmovin Adaptive Streaming Player, please register in our backend application. To get an overview of all relevant information in context of the player, click on the player overview menu item. As you can see in the below screenshot, the overview shows your personal player key, the CDN path of the player files and how many impressions have already been generated this month.

bitmovin player setup

You can use our fully featured player for free when used for 5,000 (or less) impressions per month. For testing and evaluation purposes, video views on localhost does not increase the impressions count. You can also use the player on multiple domains, just add them to the list of approved domains. To add a domain, enter the domain name and click the ‘Add new Domain(s)’ button, as indicated in the figure below.

bitmovin player add-domain

For more details on the licensing model and available pricing options, we refer to the our pricing page on our website.

Configuration Options

Include the bitmovinplayer.min.js into your web page via:

<script src="//bitmovin-a.akamaihd.net/bitmovin-player/stable/7/bitmovinplayer.js"></script>;

Tell the player what to do, using a config object, which might look as follows:

{
  key : 'YOUR_KEY_HERE',
  source: {
    dash: '//path/to/mpd/file.mpd'
  }
}

All entries within the config object are case sensitive. The config object can have further (optional) properties, as described in the following documentation. While key is a string, all others are objects.

The next step is to add and setup a player. Just pass the unique id of an HTML container element (like div) to the player:

var player = bitmovin.player('player-wrapper');

  player.setup(conf).then(function(value) {
    // Success
    console.log('Successfully created Bitmovin Player instance');
  }, function(reason) {
    // Error!
    console.log('Error while creating Bitmovin Player instance');
  });
  • player-wrapper is an example for any page-wide unique ID of an HTML element, usually a div element or another container, where the player will be inserted.
  • config is a JSON object holding the configuration for the player.

Sample Page

Using our Sintel DASH stream manifest, a sample page, including a minimal player configuration looks like the following:

<html>
  <head>
    <script type="text/javascript" src="//bitmovin-a.akamaihd.net/bitmovin-player/stable/7/bitmovinplayer.js"></script>
  </head>
  <body>
    <div id="player"></div>
    <script type="text/javascript">
      var conf = {
        key: "YOUR_KEY_HERE",
        source:    {
          dash: "http://bitmovin-a.akamaihd.net/content/sintel/sintel.mpd"
        }
      };
      var player = bitmovin.player('player');

      player.setup(conf).then(function(value) {
        // Success
      }, function(reason) {
        // Error!
      });
    </script>
  </body>
</html>

It’s as simple as that!

Back to Top
Simple Share Buttons