Quickstart

Suggest Edits

Get started with our web player

Step 1: Copy & paste the code below and host it locally or on a server.
Step 2: Add your license key.
Step 3: Add your domain name inside the Player license dashboard

📘

Add your license key

Don't forget to add your real license key in line 19 to successfully connect your player with our cloud service.
Your license key can be found here: https://bitmovin.com/dashboard/player/licenses

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bitmovin SDK - Getting Started WEB SDK</title>
  <meta charset="UTF-8"/>
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <!-- STEP 1 - SDK Installation-->
  <script src="https://cdn.bitmovin.com/player/web/8/bitmovinplayer.js" type="text/javascript"></script>
</head>
<body>

<!-- STEP 2 - Provide a player container element-->
<div id="my-player"></div>

<script>
//<!-- STEP 3 - Configure and Initialize the player-->
var playerConfig = {
  "key": "<PLAYER_LICENSE_KEY>",
  "playback": {
    "muted": true,
    "autoplay": false
  }
}
var container = document.getElementById('my-player');
var player = new bitmovin.player.Player(container, playerConfig);

//<!-- STEP 4 - Configure and load a Source for the player -->
var sourceConfig = {
  "title": "Default Demo Source Config",
  "description": "Select another example in \"Step 4 - Load a Source\" to test it here",
  "dash": "https://bitmovin-a.akamaihd.net/content/MI201109210084_1/mpds/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.mpd",
  "hls": "https://bitmovin-a.akamaihd.net/content/MI201109210084_1/m3u8s/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.m3u8",
  "smooth": "https://test.playready.microsoft.com/smoothstreaming/SSWSS720H264/SuperSpeedway_720.ism/manifest",
  "progressive": "https://bitmovin-a.akamaihd.net/content/MI201109210084_1/MI201109210084_mpeg-4_hd_high_1080p25_10mbits.mp4",
  "poster": "https://bitmovin-a.akamaihd.net/content/MI201109210084_1/poster.jpg"
}

player.load(sourceConfig).then(function() {
    console.log('Successfully loaded Source Config!');
  }).catch(function(reason) {
    console.log('Error while loading source:', reason);
  }
);

</script>
</body>
</html>

Updated 9 days ago

Did this page help you?