RequireJS y Brightcove Player

En este tema, aprenderá a usar RequireJS, un cargador de archivos y módulos JavaScript, con Brightcove Player. RequireJS ayuda a administrar las dependencias cuando se utilizan múltiples scripts de JavaScript. Dado que Brightcove Player tiene su propio script por jugador, el index.min.js , este documento proporciona el código para utilizar Brightcove Player en una implementación de RequireJS.

Crear una instancia de Brightcove Player

El siguiente código detalla la implementación de Brightcove Player cuando se utiliza RequireJS. Tres puntos clave:

  1. El código asegura que el reproductor se inicialice antes de que se llame a la devolución de llamada.
  2. El uso de la on() y play() Los métodos (líneas 36-38) son solo para fines de demostración y no son necesarios para el uso del reproductor. Esas tres líneas de código solo indican dónde podría comenzar a usar la API de Brightcove Player.
  3. El código resaltado pertenece a Brightcove Player.
<!doctype html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Untitled Document</title>
  <style>
    .video-js {
      height: 344px;
      width: 610px;
    }
  </style>
</head>

<body>

  <video-js id="myPlayerID"
    data-video-id="4690057979001"
    data-account="1507807800001"
    data-player="default"
    data-embed="default"
    controls></video-js>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.15/require.js"></script>
  <script>
    require.config({
      'paths': {
        'bc': 'https://players.brightcove.net/1507807800001/default_default/index.min'
      },
      waitSeconds: 30
    });

    require(['bc'], function() {
      var myPlayer = videojs.getPlayers().myPlayerID;
      myPlayer.on('loadstart', function(){
        myPlayer.play();
      })
    });
  </script>

</body>

</html>

Usando un módulo anónimo

Como ha visto en el código que se muestra arriba, al usar RequireJS con el módulo Brightcove Player v6.xa llamado bc es creado. El enfoque recomendado por RequireJS es proporcionar un módulo AMD anónimo, lo que hace que la inclusión de varios reproductores Brightcove sea mucho más fácil. Puede hacer que el módulo sea anónimo de forma predeterminada. Brightcove recomienda encarecidamente que realice un cambio en la configuración del reproductor para optar por esta opción predeterminada y, al mismo tiempo, el cambio eliminará la advertencia de la consola de su reproductor. Establecer la configuración del reproductor "require_js_anonymous": true es el cambio requerido. La declaración curl para realizar esta actualización aparece de la siguiente manera:

curl \
  --header "Content-Type: application/json" \
  --user $EMAIL \
  --request PATCH \
  --data '{
    "require_js_anonymous": true
  }' \
  https://players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players/$PLAYER_ID/configuration

Si desea eliminar la advertencia de la consola, pero sin optar por los módulos anónimos de RequireJS, use el "require_js_anonymous": false actualización de la configuración, como se muestra aquí:

curl \
  --header "Content-Type: application/json" \
  --user $EMAIL \
  --request PATCH \
  --data '{
    "require_js_anonymous": false
  }' \
  https://players.api.brightcove.com/v2/accounts/$ACCOUNT_ID/players/$PLAYER_ID/configuration

Consulte el paso a paso: Gestión de jugadores documento para obtener más información sobre el uso de curl para modificar la configuración de su reproductor.