Utilisation des méthodes bc () et getPlayer ()

Introduction

Une exigence de base lors du développement avec Brightcove Player est d'obtenir une référence au lecteur. La meilleure pratique pour effectuer cela a changé au cours de la vie de Brightcove Player 6.x. Voici les meilleures pratiques à suivre (les détails de chaque puce sont plus loin dans ce document):

• Pour obtenir une référence au lecteur lors de l'utilisation d'une version du <video> tag, effectuez l'une des opérations suivantes:
  • v6.16.0 + Utilisez le videojs.getPlayer() méthode.
  • Avant la v6.16.0 Utilisez le videojs() méthode.
• Lors de l'utilisation du Avancé (intégration dans la page) mise en œuvre du joueur, la meilleure pratique est:
  • v6.11.0 + Utilisez le <video-js> marque.
  • Avant la v6.11.0 Utilisez le <video> marque.
• Si vous instanciez manuellement le lecteur sur la page, utilisez le bc() méthode, qui générera une référence au lecteur.

getPlayer() contre videojs()

Si vous faites du développement avec Brightcove Player depuis un certain temps, vous avez presque certainement vu du code similaire au suivant utilisé pour obtenir une référence au lecteur et le stocker dans le myPlayer variable:

  videojs('myPlayerID').ready(function(){
    var myPlayer = this;
  });

Si vous utilisez v6.16.0 + il s'agit d'une utilisation plus propre de l'API et d'une meilleure pratique recommandée à utiliser player.getPlayer() au lieu , comme indiqué ici:

  videojs.getPlayer('myPlayerID').ready(function() {
    var myPlayer = this;
  });
  

video-js balise versus video marque

Pour Brightcove Player v6.11.0 + c'est une bonne pratique à utiliser <video-js> plus de <video>. Les raisons en sont:

• En utilisant <video-js> empêchera le flash du problème des contrôles natifs que vous <video> élément. Un exemple de ceci est dans les versions de Chrome 67+. Chrome affichera momentanément une icône vidéo cassée jusqu'à ce que <video> La balise est convertie en un lecteur Brightcove. L'icône apparaît comme suit :

  

• Dans certains cas, par exemple lors de l'utilisation de supports non-Video Cloud, en utilisant <video-js> donnera au joueur plus de contrôle sur le processus d'initialisation. Cela empêche tout comportement automatique du navigateur qui pourrait être associé au <video> élément.

bc() détails de la méthode

le bc() méthode est utilisée pour instancier un joueur à un moment de votre choix. le Retarder l'instanciation du joueur Le document traite des cas d'utilisation et des implémentations. Les Exemple de lecteur Brightcove : Contrôle du volume vertical montre une autre utilisation du bc() méthode dans laquelle vous voulez changer la direction du contrôle du volume sur vertical, ce qui doit se produire avant que le lecteur ne soit instancié.

La syntaxe de la méthode est:

  bc(id,options)

où :

• id:
  • Description : ID d'élément vidéo ou d'élément vidéo
  • Type de données: chaîne | Élément
  • Obligatoire: vrai
• options:
  • Description : Objet Options pour fournir des paramètres
  • Type de données: Objet
  • Obligatoire: faux
• La méthode renvoie une instance de Brightcove Player

Par exemple, vous pourriez avoir les éléments suivants video-js tag puis JavaScript pour configurer le lecteur:

  <video-js id="myPlayerID"
     data-embed="default"
     data-application-id=""
     controls=""
     width="640" height="360"></video-js>
  <script src="https://players.brightcove.net/1752604059001/default_default/index.min.js"></script>
  
  <script type="text/javascript">
    // +++ Define the player options +++
    var options = {
      controlBar: {
        volumePanel: {
          inline: false,
          vertical: true
        }
      }
    };
  
    // +++ Add the player attributes +++
    var myPlayerEl = document.getElementById("myPlayerID");
    myPlayerEl.setAttribute('data-account', 1752604059001);
    myPlayerEl.setAttribute('data-player', 'default');
    myPlayerEl.setAttribute('data-video-id', 5557662144001);
  
    // +++ Create the player +++
    bc(myPlayerEl, options);
  </script>

Parmi les options de configuration normales du lecteur (détaillées dans le Guide de configuration du lecteur), les éléments suivants peuvent être utilisés avec bc() méthode: