Usando los métodos bc () y getPlayer ()

Introducción

Un requisito básico al realizar un desarrollo con Brightcove Player es obtener una referencia al reproductor. La mejor práctica para realizar esto ha cambiado durante la vida de Brightcove Player 6.x. Estas son las mejores prácticas que debe seguir (los detalles de cada viñeta se encuentran más adelante en este documento):

• Para obtener una referencia al reproductor cuando se utiliza una versión del <video> etiqueta, realice una de las siguientes acciones:
  • v6.16.0 + utilizar el videojs.getPlayer() método.
  • Antes de v6.16.0 utilizar el videojs() método.
• Al usar el Avanzado (incrustación en la página) implementación del reproductor, la mejor práctica es:
  • v6.11.0 + utilizar el <video-js> etiqueta.
  • Antes de v6.11.0 utilizar el <video> etiqueta.
• Si va a crear una instancia del reproductor manualmente en la página, utilice el bc() método, que generará una referencia al jugador.

getPlayer() versus videojs()

Si ha estado desarrollando con Brightcove Player durante un período de tiempo, es casi seguro que haya visto un código similar al siguiente utilizado para obtener una referencia al reproductor y almacenarlo en el myPlayer variable:

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

Si esta usando v6.16.0 + es un uso más limpio de la API y una mejor práctica recomendada para usar player.getPlayer() en lugar de , como se muestra aquí:

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

video-js etiqueta versus video etiqueta

Para Brightcove Player v6.11.0 + es una buena práctica utilizar <video-js> encima <video>. Las razones de esto son:

• Utilizando <video-js> evitará el problema de flash de controles nativos que puede obtener con un <video> elemento. Un ejemplo de esto es en las versiones 67+ de Chrome. Chrome mostrará un icono de video roto momentáneamente hasta que el <video> etiqueta se convierte en un Brightcove Player. El icono aparece de la siguiente manera:

  

• En algunos casos, como cuando se utilizan medios que no son de Video Cloud, <video-js> le dará al jugador más control sobre el proceso de inicialización. Esto evita cualquier comportamiento automático del navegador que pueda estar asociado con el <video> elemento.

bc() detalles del método

La bc() El método se utiliza para crear una instancia de un jugador en el momento de su elección. La Retrasar la instanciación del jugador El documento analiza casos de uso e implementaciones. los Muestra de jugador de Brightcove: Control de volumen vertical muestra otro uso de la bc() método en el que desea cambiar la dirección del control de volumen a vertical, lo que debe ocurrir antes de que se cree una instancia del reproductor.

La sintaxis del método es:

  bc(id,options)

donde:

• id:
  • Descripción: ID de elemento de vídeo o elemento de vídeo
  • Tipo de datos: cadena | Elemento
  • Requerido: verdadero
• options:
  • Descripción: Objeto de opciones para proporcionar configuraciones
  • Tipo de datos: Objeto
  • Requerido: falso
• El método devuelve una instancia de Brightcove Player

Por ejemplo, podría tener lo siguiente video-js etiqueta y luego JavaScript para configurar el reproductor:

  <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>

De las opciones de configuración normales del reproductor (detalladas en el Guía de configuración del reproductor), lo siguiente se puede utilizar con el bc() método: