RequireJS et Brightcove Player

Dans cette rubrique, vous apprendrez comment utiliser RequireJS, un chargeur de fichiers et de modules JavaScript, avec Brightcove Player. RequireJS aide à gérer les dépendances lors de l'utilisation de plusieurs scripts JavaScript. Comme Brightcove Player a son propre script par joueur, le index.min.js fichier, ce document fournit le code pour utiliser Brightcove Player dans une implémentation RequireJS.

Instancier Brightcove Player

Le code suivant détaille l'implémentation de Brightcove Player lors de l'utilisation de RequireJS. Trois points clés:

  1. Le code garantit que le lecteur est initialisé avant l'appel du rappel.
  2. L'utilisation du on() et play() Les méthodes (lignes 36-38) sont uniquement à des fins de démonstration et ne sont pas nécessaires pour l'utilisation du lecteur. Ces trois lignes de code indiquent uniquement où vous pouvez commencer à utiliser l'API de Brightcove Player.
  3. Le code en surbrillance concerne 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>

Utiliser un module anonyme

Comme vous l'avez vu dans le code ci-dessus, lorsque vous utilisez RequireJS avec le module Brightcove Player v6.xa nommé bc est créé. L'approche recommandée par RequireJS est de fournir un module AMD anonyme, ce qui facilite considérablement l'inclusion de plusieurs lecteurs Brightcove. Vous pouvez rendre le module anonyme par défaut. Brightcove vous recommande fortement de modifier la configuration du lecteur pour activer cette valeur par défaut, et en même temps, la modification supprimera l'avertissement de console de votre lecteur. Définition de la configuration du lecteur "require_js_anonymous": true est le changement requis. L'instruction curl pour effectuer cette mise à jour apparaît comme suit:

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 vous souhaitez supprimer l'avertissement de la console, mais sans activer les modules RequireJS anonymes, utilisez le "require_js_anonymous": false mise à jour de la configuration, comme indiqué ici:

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

Voir le Pas à pas: Gestion des joueurs document pour plus d'informations sur l'utilisation de curl pour modifier la configuration de votre lecteur.