Skip to main content

Brightcove Player

Assemble Web uses Brightcove as it's default Player.

Project Setup

In order to configure your Brightcove account for your Assemble project, you need to update the following Environment Variables:

  • NEXT_PUBLIC_BRIGHTCOVE_ACCOUNTID with your BC Account ID.
  • NEXT_PUBLIC_BRIGHTCOVE_PLAYERID with your BC PlayerID.

If you need more info, read the Brightcove Documentation

Usage

First you need to follow the instructions under Player configuration to ensure that you register the Brightcove Player for your Assemble Web project.

Then inside your Player.tsx file you can init the Player normally as:

// You can use an id to find the video element
await player.init({ playerId: 'idToVideoElement' });

At this point you can add any required event listener or get a reference to the internal objects.

player.addEventListener('onload', () => console.log('Loaded'));
const { playerClass: bcInstance } = player.getPlayer();