Publishing Videos with the Player programmatically

In this topic, you will learn about the player's configuration to publish videos programmatically.

Publishing Videos Player-only

There are multiple ways to load source content into your Brightcove Player.


Advanced (in-page embed) code implementation.

The Advanced (in-page) embed code permits you to have the player exist in the HTML page directly, not in an iframe. This offers the benefits of ease of accessing the player and associated properties and events. More info.

To use the in-page embed code follow these steps:

  1. Use the PLAYERS module to create a player.
  2. Copy the Advanced embed code.
  3. Embed your source assets on the embed code. The HTML will be similar to the following: 
    <video-js
    data-account="123456789001"
    data-player="default"
    data-embed="default"
    controls=""
    width="640" 
    height="360">
    <source src="https://your-domain.com/master.m3u8" type="application/x-mpegURL">
    <source src="https://your-domain.com/video.mp4" type="video/mp4">
</video-js>
<script src="//players.brightcove.net/123456789001/default_default/index.min.js"></script>
  4. Copy the HTML from the browser and paste into the body of a full HTML page.
  5. Browse the HTML page to see the player functioning.

Programmatic implementation.

Selecting video programmatically is a much more flexible and dynamic method of loading your content.

To use a video programmatically follow these steps:

  1. Get a reference to your player: 
    const player = bc('myPlayer');
  2. Load the source programmatically: 
    player.src('master.m3u8');

    or

    Single video with MIME type:

    player.src({
  type: 'application/x-mpegURL',
  src: 'master.m3u8'
});

    or

    An array of sources for the same video: 

    player.src([
  {type: 'application/x-mpegURL', src: 'master.m3u8'},
  {type: 'application/dash+xml', src: 'manifest.mpd'},
  {type: 'video/mp4', src: 'video.mp4'}
]);

DRM implementation.

DRM (Digital Rights Management) protects your video content by encrypting the video data and unlocking it based on license policies. When the video content is loaded into a Brightcove Player, the player calls back to a licensing server and obtains permission to play the video. Learn more.

To use a video with DRM follow these steps:

  1. Get a reference to your player: 
    const player = bc('myPlayer');
  2. Load the source with DRM programmatically: 
    player.src({
  type: 'application/x-mpegURL',
  src: 'master.m3u8',
  keySystems: {
    'com.widevine.alpha': '<license url>',
    'com.microsoft.playready': '<license url>',
    'com.apple.fps.1_0': {
    options: {
           authToken: 'your-auth-token',
          customData: 'your-custom-data'
    },
    certificateUri: 'https://example.com/your-certificate-uri.cer',
        icenseUri: 'https://example.com/your-license-uri'
    }
  }
});