support Contact Support | system status System Status
Page Contents

    Cross-Device Resume with Brightcove Player

    In this topic, you will learn the how to use cross-device resume with Brightcove Player.

    Overview

    Cross-device resume lets you start watching a video on one device, and at a later time, continue watching the video where you left off on a different device.

    Let's say that you start watching a video on your mobile device. Later, you can continue watching the same video with a player on your web browser. Playback will continue where you left off, so you won't miss a thing.

    Requirements

    The following requirements apply to cross-device resume:

    • Brightcove Player version 6.41.0+

    Setup

    This feature is available to anyone with a Brightcove Video Cloud account.

    To get started, do the following:

    • Contact your account manager to enable your account for cross-device resume
    • Make sure the videos you are using are ingested for Dynamic Delivery

    Implementing cross-device resume

    To implement cross-device resume, follow these steps:

    1. Set the user identifier in Brightcove analytics
    2. Get the user playback position
    3. Resume playback on a Brightcove Player

    Set the user identifier

    First, you need to set the user identifier to store user viewing activity.

    Brightcove Player

    If you are using Brightcove Player, follow these steps:

    1. Even though viewer data is sent to Brightcove analytics automatically, you need to set the user identifier. To do this, use the setUser() method. For example:

      myPlayer.bcAnalytics.client.setUser('user id');

      On your websites that host Brightcove Player, you can use an authentication gateway or some identity management solution to keep track viewers. Use this viewer id as the user identifier to pass to Brightcove analytics.

    2. It is important to set the user id before any source is set on the player. It should be called immediately after initializing the player.

      <video-js
          id="myPlayerID"
          data-account="1752604059001"
          data-player="hyQW6GByl"
          data-embed="default"
          controls=""
          data-video-id="6156696074001"
          data-playlist-id=""
          data-application-id=""
          width="640" height="360"></video-js>
        <script src="https://players.brightcove.net/1752604059001/hyQW6GByl_default/index.min.js"></script>
      
        <script>
          videojs.getPlayer('myPlayerID').ready(function() {
            var myPlayer = this;
      
            // Set the viewer id for Brightcove analytics
            myPlayer.bcAnalytics.client.setUser(user id');
          });
        </script>
    3. When the setUser() method is used, the value is not hashed and will be sent in the clear with all subsequent beacons.

      Note that the player_init event will not include the user field in this case, but all video_* events should include it.

    Custom player

    if you are building a custom implementation that does not use Brightcove Player, add the user parameter to your Data Collection API requests. For details, see the Overview: Data Collection API v2 document.

    On your websites that host your player, you can use an authentication gateway or some identity management solution to keep track viewers. Use this viewer id as the user identifier to pass to Brightcove analytics.

    This user parameter passed to Brightcove can be used in the next section to retrieve the playback position from the XDR API.

    Get the user playback position

    Next, you will get the user playback position from the Cross-Device Resume (XDR) API.

    You will need a server-side application to make the REST API request to get the user playback position.

    For details, see the Getting Playback Position from XDR API document.

    Resume playback

    Once you get the user playback position from the XDR API, you can resume playback from that point.

    1. With the user playback position from the previous section, set the playhead position using the currentTime() method.

      Here is an example:

      // The specific event to use may require some experimentation
      player.on('loadstart', function() {
      
        // This initialPlayhead variable will have to come from the publisher's
        // custom integration.
        player.currentTime(user playhead position);
      });
    2. For a web player sample that calls a server-side proxy to get the playhead from the XDR API, see the Cross-Device Resume sample on github.


    Page last updated on 28 Sep 2020