Afficher les messages d'erreur Plugin

Aperçu

Le plugin de messages d'erreur permet au lecteur d'afficher des messages conviviaux lorsqu'il rencontre une erreur. La feuille de style par défaut affiche les messages sous forme de superposition semi-transparente au-dessus de l'élément vidéo lui-même. Vous pouvez modifier le texte du message existant et ajouter vos propres styles. Vous pouvez même créer des messages personnalisés qui sont déclenchés quand vous le souhaitez.

Le message d'erreur affiché dans l'image ci-dessus a été créé en mettant à jour le lecteur avec un src valeur dans le sources propriété.

Le plugin des messages d'erreur est un plugin par défaut et est automatiquement chargé avec le Brightcove Player. Cependant, vous pouvez choisir de ne pas le charger. Sans ce plugin, vous verrez un ensemble limité de messages d'erreur et certaines erreurs n'apparaîtront que dans la console du navigateur. Pour plus de détails sur la façon de ne pas charger un plugin par défaut lorsque vous créez un lecteur, consultez le Présentation du plugin Player document.

Commencer

Pour mettre à jour toutes les instances de votre lecteur, vous pouvez implémenter un plugin personnalisé à l'aide du module Brightcove Players de Studio. Cette approche est utilisée dans les sections suivantes pour mettre à jour le plugin de messages d'erreur de votre lecteur. Si vous choisissez de mettre à jour ce plugin à partir d'une page de code, cela n'affectera que cette instance de votre lecteur.

Pour mettre à jour le plugin à partir du code de votre page, commencez par obtenir une référence au Brightcove Player. Dans cet exemple, dans le JavaScript, nous créons une variable nommée myPlayer et lui attribuer une référence au joueur.

<video-js id="myPlayerID"
  data-video-id="4443311217001"
  data-account="1507807800001"
  data-player="default"
  data-embed="default"
  controls=""></video-js>
<script src="https://players.brightcove.net/1507807800001/default_default/index.min.js"></script>
<script type="text/javascript">
  videojs.getPlayer('myPlayerID').ready(function(){
    var myPlayer = this;

Erreurs standard

Ce plugin a un ensemble de messages d'erreur par défaut pour les erreurs vidéo HTML5 standard basées sur la valeur du code d'erreur d'exécution:

Code d'erreur : 1
- Type: MEDIA_ERR_ABORTÉ
- Headline: Le téléchargement de la vidéo a été annulé
- Message: Vous avez interrompu la lecture multimédia
Code d'erreur : 2
- Type: RÉSEAU MEDIA_ERR_
- Headline: La connexion vidéo a été perdue, veuillez confirmer que vous êtes connecté à Internet
- Message: Une erreur réseau a provoqué un échec partiel du téléchargement du média. Actuellement, le plus utile pour les formats vidéo MP4 et/ou à téléchargement progressif. Voir le Problèmes connus section dans ce document pour plus de détails.
Code d'erreur : 3
- Type: DECODE MEDIA_ERR_DECODE
- Headline: La vidéo est mauvaise ou dans un format qui ne peut pas être lu sur votre navigateur
- Message: La lecture multimédia a été interrompue en raison d'un problème de corruption ou parce que les fonctionnalités multimédia utilisées par votre navigateur n'étaient pas compatibles.
Code d'erreur : 4
- Type: MEDIA_ERR_SRC_NOT_SUPPORTÉ
- Headline: Cette vidéo est indisponible ou non prise en charge par ce navigateur.
- Message: Le support n'a pas pu être chargé, soit parce que le serveur ou le réseau a échoué, soit parce que le format n'est pas pris en charge.
Code d'erreur : 5
- Type: MEDIA_ERR_ENCRYPTED
- Headline: La vidéo que vous essayez de regarder est cryptée et nous ne savons pas comment la déchiffrer.
- Message: Le média est crypté et nous n'avons pas les clés pour le décrypter.

Si une erreur n'a pas de code d'erreur associé, un message générique s'affiche:

Code d'erreur: inconnu
- Message : MEDIA_ERR_UNKNOWN
- Description : Un problème imprévu s'est produit, revenez bientôt et réessayez

Remplacer le texte

Vous pouvez modifier trois parties du message d'erreur:

headline: Ceci est le texte du message en haut.
type: C'est le Code d'erreur: texte.
message: C'est le Détails techniques: texte.

L'exemple ci-dessous montre comment remplacer le texte du message pour l'erreur standard avec une valeur de code d'erreur de 4. Les propriétés sont définies comme suit:

:plugins Cette propriété contient un tableau de propriétés et de valeurs. Pour ce plugin, il vous suffit de fournir le name propriété d'une valeur de errors.
options: Cette propriété est utilisée pour transmettre des données au plugin.
:errors Cette propriété définit le code d'erreur que vous souhaitez mettre à jour. Ici, nous remplaçons le texte du message pour le headline , type , et message.
Remarque : le code d'erreur peut être n'importe quelle valeur de chaîne, par exemple en remplaçant le texte du unknown un message.

Utilisation du code de page

Si vous incluez le script d'erreurs dans votre code, vous pouvez remplacer le texte du message comme suit:

myPlayer.errors({
  "errors": {
    "4": {
      "headline": "This is a custom error message",
      "type": "custom type",
      "message": "these are details"
    }
  }
});

Utiliser un plugin personnalisé

Si vous souhaitez mettre à jour toutes les instances de votre lecteur, créez un plugin personnalisé et ajoutez-le à votre lecteur dans le module Lecteurs de Video Cloud Studio. Pour plus d'informations sur les plugins, consultez le Configuration des plugins de lecteur document.

Pour créer un plugin pour remplacer le texte de message standard, procédez comme suit:

Créez un fichier JavaScript stocké dans un emplacement accessible sur Internet avec le code de votre plugin Brightcove Player. Cela devrait ressembler à ceci, mais avec vos propres valeurs:

videojs.registerPlugin('errorText', function() {
  var myPlayer = this;

  myPlayer.errors({
    "errors": {
      "4": {
        "headline": "The Live Stream will begin soon",
        "type": "CUSTOM_TYPE",
        "message": "Please come back, once the live event has begun!"
      }
    }
  });
});

dans le Joueurs module, sélectionnez Plugins à partir de la navigation de gauche.
Élargir le Ajouter un plugin et sélectionnez Plugin personnalisé.

Plugin personnalisé
Dans la page des détails du plugin, ajoutez des valeurs pour:
- Nom du plugin - Le nom de votre plugin
- URL JavaScript - L'emplacement de votre plugin player dès la première étape
Détails du plugin
Sélectionnez le sauvegarder bouton.
Publiez votre lecteur.

Lorsque vous apportez des modifications au code de votre plugin, vous devez publier le lecteur pour qu'il récupère ces modifications.

Brightcove a défini les erreurs personnalisées

Des erreurs personnalisées peuvent également être définies. Brightcove a défini un certain nombre d'erreurs personnalisées, expliquées dans cette section, et vous pouvez également créer des erreurs personnalisées, détaillées dans la section suivante.

Brightcove recommande que les valeurs de code d'erreur personnalisées soient une chaîne. Vous verrez que deux des erreurs fournies utilisent des nombres négatifs pour des raisons historiques, mais les chaînes alphanumériques / descriptives sont moins susceptibles de provoquer des problèmes de collision.
Les messages d'erreur personnalisés peuvent être nommés comme vous le souhaitez. Brightcove recommande que le type commence par PLAYER_ERR par rapport au standardisé MEDIA_ERR pour éviter toute confusion.
Comme détaillé plus loin dans cette section , vous pouvez annuler ou non les erreurs personnalisées.

Cinq messages d'erreur personnalisés ont été ajoutés comme référence:

Code d'erreur: -1
- Message : PLAYER_ERR_NO_SRC
- Description : Aucune vidéo n'a été chargée.
Code d'erreur: -2
- Message : PLAYER_ERR_TIMEOUT
- Description : Impossible de télécharger la vidéo.
  Remarque : En général, PLAYER_ERR_TIMEOUT se produit lorsque le lecteur prévoit de lire une vidéo mais ne peut pas progresser pendant 45 secondes. Cela peut être le résultat final de beaucoup de choses qui se produisent plus tôt, y compris la suspension du navigateur lorsqu'un onglet est mis en arrière-plan, par exemple. Mais cela peut être une sorte de condition fourre-tout pour les conditions de réseau ou de plate-forme qui empêchent la lecture de continuer.
Code d'erreur : Pas encore défini
- Message : PLAYER_ERR_DOMAIN_RESTREINT
- Description : Cette vidéo ne peut pas être lue sur votre domaine actuel
Code d'erreur : Pas encore défini
- Message : PLAYER_ERR_IP_RESTREINT
- Description : Cette vidéo est limitée à votre adresse IP actuelle
Code d'erreur : Pas encore défini
- Message : PLAYER_ERR_GEO_RESTREINT
- Description : Cette vidéo ne peut pas être lue dans votre région géographique actuelle

Erreurs personnalisées définies par l'utilisateur

Lorsque vous définissez vos propres erreurs personnalisées, Brightcove vous recommande de ne pas utiliser code. (Vous voyez dans la section ci-dessus que c'est ce que Brightcove fait maintenant avec les nouvelles erreurs personnalisées qu'ils définissent.) Vous devriez également envisager d'utiliser le PLAYER_ERR_ préfixe pour vos erreurs personnalisées par souci de cohérence, mais vous pouvez bien sûr les nommer comme vous le souhaitez.

Si vous incluez le script d'erreurs dans votre code, vous pouvez ajouter des messages personnalisés comme suit:

videojs.getPlayer('myPlayerID').ready(function() {
  var myPlayer = this;
  //custom error
  myPlayer.errors({
    "errors": {
      "PLAYER_ERR_AGE_GATE": {
        "headline": "You must be at least 18 years of age.",
        "message": "Content may be considered inappropriate for some users."
    }
  }
});

Affichage des erreurs personnalisées

Lorsque vous définissez des erreurs personnalisées, vous devez informer Brightcove Player lorsque vous souhaitez les afficher. Pour ce faire, créez votre propre code pour déterminer quand le message doit être affiché. Ensuite, utilisez le error() fonction pour afficher le message comme suit:

//display custom message
var age_appropriate = false;
myPlayer.on("loadstart", function () {
  if(!age_appropriate) {
    myPlayer.error({code:'PLAYER_ERR_AGE_GATE'});
  }
});

Ici le age_appropriate la variable est définie sur false , mais vous ajouteriez votre propre code pour déterminer quand afficher vos messages d'erreur personnalisés.

L'erreur serait affichée à l'utilisateur comme suit:

message d'erreur personnalisé de l'utilisateur

Remarque : tout code permettant de générer des erreurs personnalisées doit attendre le chargement de la vidéo. Utilisez le loadstart événement pour le déterminer. Si vous essayez d'afficher votre message sans attendre, votre message disparaîtra après le chargement de la vidéo.

Rendre les erreurs personnalisées non supprimables

Par défaut, un message d'erreur personnalisé est ignoré par le visionneur vidéo. Comme le montre la capture d'écran suivante, il y a un D'accord bouton pour cliquer pour fermer la fenêtre, ainsi qu'un X dans le coin supérieur droit.

Si vous ne souhaitez PAS autoriser le spectateur vidéo à ignorer le message d'erreur, vous pouvez le faire. Lorsque vous appelez le error() méthode, vous pouvez définir la dismiss propriété à false.

myPlayer.error({code:'age-gate-error', dismiss: false});

Lorsque vous effectuez cette opération, le message d'erreur apparaîtra comme suit, sans aucun moyen de rejeter l'erreur.

méthode getAll ()

Vous pouvez utiliser le getAll() méthode pour voir toutes les erreurs enregistrées pour un lecteur spécifique. Vous pouvez appeler le getAll() à tout moment après la les erreurs plugin a été initialisé, par exemple après player.errors() a été appelé. Un exemple d'appel de la méthode est:

console.log('myPlayer.errors.getAll()',myPlayer.errors.getAll());

Un exemple d'affichage de la console, avec quelques erreurs développées pour plus de détails, est:

méthode `on()`

Vous pouvez également écouter toutes les erreurs à l'aide de la méthode on() , en procédant comme suit :

myPlayer.on('error'), function () {
  ...
}

Si vous jouez avec des publicités et que vous voulez détecter toutes les erreurs, vous devez utiliser ce logiciel :

myPlayer.on(['error','aderror')], function () {
  ...
}

Erreurs d'envoi

En développement, vous souhaiterez peut-être envoyer des erreurs pour tester si vos modifications de configuration sont réussies. Vous pouvez le faire en utilisant un code similaire à celui indiqué dans l'extrait de code suivant. Dans ce cas, un bouton est ajouté au code afin que vous puissiez envoyer l'erreur à un moment choisi.

<video-js id="myPlayerID"
  data-video-id="4443311217001"
  data-account="1507807800001"
  data-player="default"
  data-embed="default"
  controls=""></video-js>
<script src="https://players.brightcove.net/1507807800001/default_default/index.min.js"></script>
<p><button onclick="changeVideo()">change video</button></p>
<script type="text/javascript">
  var changeVideo;
  videojs.getPlayer('myPlayerID').ready(function() {
    var myPlayer = this;
    changeVideo = function(){
      myPlayer.error({code:'2'});
    }
  });
</script>

Localiser les erreurs

Le plugin d'erreurs prend en charge plusieurs langues. Pour ajouter la prise en charge de la langue, après le chargement du plugin, chargez le fichier de langue que vous souhaitez utiliser:

<script src="lang/es.js"></script>

Vous pouvez ensuite utiliser les techniques présentées dans le Localisation par programme de Brightcove Player document pour localiser les messages d'erreur.

erreur-catalogue-bc

Il est possible que la gestion des erreurs dans la ready() section normale du bloc de script puisse causer des problèmes. Par exemple, il peut arriver que l'événement bc-catalog-error soit distribué avant que le lecteur ne soit prêt, et si vous écoutez l'erreur dans le ready() section, vous ne pourrez pas gérer l'erreur. Ce problème peut se produire lors de l'utilisation du filtrage géographique, une vidéo est inactive, une vidéo est hors de la plage de planification ou dans un autre compte. Vous constaterez peut-être qu'il n'y a pas de problème dans votre code, mais le problème peut dépendre du navigateur, alors soyez prudent.

Par exemple, voici le code du plugin qui affiche un message lorsqu'une vidéo est inactive:

videojs.registerPlugin('inactiveErrorCheck', function() {
  var myPlayer = this;
  myPlayer.one('bc-catalog-error', function(){
    var specificError;
    myPlayer.errors({
      'errors': {
          'inactive-video-error': {
          'headline': 'The video you are trying to watch is inactive.',
          'dismiss': false
        }
      }
    });
    if (typeof(myPlayer.catalog.error) !== 'undefined') {
      specificError = myPlayer.catalog.error.data[0];
      if (specificError !== 'undefined' & specificError.error_code == "VIDEO_NOT_PLAYABLE") {
        myPlayer.error({code:'inactive-video-error'});
      };
    };
  });
});

Taux d'erreur exagéré

Si vous obtenez ce qui semble être un nombre déraisonnable d'erreurs signalées, il est important de savoir que vous pouvez obtenir des événements d'erreur en double pour la même session, ce qui crée ce taux d'erreur exagéré. Brightcove Player envoie les erreurs aux analyses au moment exact et dans la même quantité, à mesure qu'elles sont signalées au joueur. Par exemple, s'il n'y a pas de média dans un lecteur et que le code appelle d'une manière ou d'une autre play() mille fois de suite, mille PLAYER_ERR_NO_SRC les erreurs seront signalées à l'analytique.

S'il y a quelques sessions avec des tonnes d'erreurs faussant l'analyse, vous devriez envisager d'utiliser la logique suivante pour avoir une meilleure idée des problèmes réels:

number_of_sessions_with_errors / total_number_of_sessions

plutôt que

count of errors/number of views

Problèmes connus

Lors de la lecture de sources HLS, le comportement après la perte de la connectivité réseau n'est probablement pas ce à quoi vous vous attendez. Les détails sont:
- Dans la version 6.x de Brightcove Player, les segments HLS sont demandés à l'infini et MEDIA_ERR_NETWORK apparaît jamais.
- Dans la version 5.x de Brightcove Player après une période de temps (plus de 30 secondes) a PLAYER_ERR_TIMEOUT une erreur apparaît.
Lors du chargement de vidéos dans Edge sur Windows 10 (à la fois dans le Studio et dans les URL publiques), un MEDIA_ERR_SRC_NOT_SUPPORTED l'erreur s'affiche et la vidéo ne peut pas être lue.
Sur les appareils Android et les iPhones, les événements de tap pour les messages d'erreur ne remontent pas jusqu'à l'élément vidéo parent. Cela signifie que vous ne pourrez pas fermer un message d'erreur une fois qu'il sera affiché. Ce comportement peut être un problème si l'utilisateur est en mode plein écran, car il n'aura aucun moyen de quitter cet état.

Ce problème est actuellement en cours d'élaboration et devrait être résolu dans une prochaine version du lecteur. Pour l'instant, vous pouvez essayer une solution de rechange comme celle-ci:
```
player.on("touchstart", function(e) {
  if (player.error_) {
    player.error(null);
    e.preventDefault();
  }
})
```

Changelog

Le plugin d'erreurs est désormais intégré au lecteur et les modifications apportées à la fonctionnalité du plugin seront signalées dans les notes de mise à jour du lecteur Brightcove.

Pour les notes de version historiques, voir le changelog ici.