Mostrar complemento de mensajes de error

En este tema, aprenderá a modificar el comportamiento predeterminado de los mensajes de error, crear mensajes de error personalizados y enviar errores.

Resumen

El complemento de mensajes de error permite al jugador mostrar mensajes fáciles de usar cuando encuentra un error. La hoja de estilo predeterminada muestra los mensajes como una superposición semitransparente sobre el propio elemento de video. Puede cambiar el texto del mensaje existente y agregar sus propios estilos. Incluso puede crear mensajes personalizados que se activan cuando lo desee.

complemento de mensaje de error

El mensaje de error que se muestra en la imagen de arriba se creó al actualizar el reproductor con una src valor en el sources propiedad.

El complemento de mensajes de error es un complemento predeterminado y se carga automáticamente con Brightcove Player. Sin embargo, puede optar por no cargarlo. Sin este complemento, verá un conjunto limitado de mensajes de error y algunos errores solo aparecerán en la consola del navegador. Para obtener detalles sobre cómo no cargar un complemento predeterminado cuando crea un reproductor, consulte la Descripción general del complemento del reproductor documento.

Empezar

Para actualizar todas las instancias de su reproductor, puede implementar un complemento personalizado utilizando el módulo Brightcove Players de Studio. Este enfoque se utiliza en las siguientes secciones para actualizar el complemento de mensajes de error para su reproductor. Si elige actualizar este complemento desde una página de código, solo afectará esa instancia de su reproductor.

Para actualizar el complemento desde el código de su página, primero obtenga una referencia al Brightcove Player. En este ejemplo, en JavaScript estamos creando una variable llamada myPlayer y asignándole una referencia al jugador.

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

Errores estándar

Este complemento tiene un conjunto de mensajes de error predeterminados para los errores de video HTML5 estándar basados en el valor del código de error en tiempo de ejecución:

  • Código de error: 1
    • Tipo: MEDIA_ERR_ANULADO
    • Titular: La descarga de vídeo se ha cancelado
    • Mensaje: Ha anulado la reproducción multimedia
  • Código de error: 2
    • Tipo: MEDIA_ERR_NETWORK
    • Titular: Se ha perdido la conexión de vídeo. Confirma que estás conectado a Internet
    • Mensaje: Un error de red provocó que la descarga de medios falle parcialmente. Actualmente es más útil para formatos de vídeo MP4 y/o descarga progresiva. Ver el Problemas conocidos sección de este documento para obtener más detalles.
  • Código de error: 3
    • Tipo: DECODIFICACIÓN MEDIA_ERR_DECODE
    • Titular: El vídeo es defectuoso o tiene un formato que no se puede reproducir en el navegador
    • Mensaje: La reproducción multimedia se ha anulado debido a un problema de corrupción o porque las funciones multimedia utilizadas por su navegador no admiten.
  • Código de error: 4
    • Tipo: MEDIA_ERR_SRC_NOT_SOPORTADO
    • Titular: Este vídeo no está disponible o no es compatible con este navegador
    • Mensaje: No se ha podido cargar el medio, ya sea porque el servidor o la red han fallado o porque el formato no es compatible.
  • Código de error: 5
    • Tipo: MEDIA_ERR_ENCRIPTADO
    • Titular: El vídeo que intentas ver está encriptado y no sabemos cómo descifrarlo
    • Mensaje: El medio está encriptado y no tenemos las claves para desencriptarlo.

Si un error no tiene un código de error asociado, se muestra un mensaje genérico:

  • Código de error: desconocido
    • Mensaje: MEDIA_ERR_UNKNOWN
    • Descripción: Se encontró un problema inesperado, vuelva pronto y vuelva a intentarlo

Reemplazo de texto

Hay tres partes del mensaje de error que puede cambiar:

  • headline: Este es el texto del mensaje en la parte superior.
  • type: Este es el Código de error: texto.
  • message: Este es el Detalles técnicos: texto.
complemento de mensaje de error

El siguiente ejemplo muestra cómo anular el texto del mensaje para el error estándar con un valor de código de error de 4. Las propiedades se definen de la siguiente manera:

  • plugins: Esta propiedad contiene una matriz de propiedades y valores. Para este complemento, solo necesita proporcionar el name propiedad con el valor de errors.
  • options: Esta propiedad se utiliza para pasar datos al complemento.
  • errors: Esta propiedad define el código de error que desea actualizar. Aquí estamos anulando el texto del mensaje para el headline , type , y message.

Usando en el código de la página

Si incluye el script de errores en su código, puede anular el texto del mensaje de la siguiente manera:

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

Usando un complemento personalizado

Si desea actualizar todas las instancias de su reproductor, cree un complemento personalizado y agréguelo a su reproductor en el módulo Reproductores de Video Cloud Studio. Para obtener más información sobre complementos, consulte la Configuración de complementos del reproductor documento.

Para crear un complemento que anule el texto del mensaje estándar, siga estos pasos:

  1. Cree un archivo JavaScript almacenado en una ubicación accesible en Internet con su código de complemento de Brightcove Player. Debería verse similar a esto, pero con sus propios valores: 

    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!"
      }
    }
  });
});

  2. En el Jugadores módulo, seleccione Complementos desde la navegación de la izquierda.

  3. Ampliar la Agregar un complemento y seleccione Complemento personalizado.

    Complemento personalizado
    Complemento personalizado

  4. En la página de detalles del complemento, agregue valores para:

    • Nombre del complemento - Su nombre de complemento
    • URL de JavaScript - La ubicación de su complemento de reproductor desde el primer paso
    Detalles del complemento
    Detalles del complemento
  5. Selecciona el Ahorrar botón.

  6. Publica tu reproductor.

Errores personalizados definidos por Brightcove

También se pueden definir errores personalizados. Brightcove ha definido una serie de errores personalizados, que se explican en esta sección, y también puede crear errores personalizados, que se detallan en la siguiente sección.

  • Brightcove recomienda que los valores de código de error personalizados sean una cadena. Verá que dos de los errores proporcionados usan números negativos por razones históricas, pero es menos probable que las cadenas alfanuméricas / descriptivas causen problemas de colisión.
  • Los mensajes de error personalizados pueden tener el nombre que desee. Brightcove recomienda que el tipo comience con PLAYER_ERR versus el estandarizado MEDIA_ERR para evitar confusión.
  • Como fue detallado más adelante en esta sección , puede hacer que los errores personalizados sean descartables o no.

Se han agregado cinco mensajes de error personalizados como referencia:

  • Código de error: -1
    • Mensaje: PLAYER_ERR_NO_SRC
    • Descripción: No se ha cargado ningún video
  • Código de error: -2
    • Mensaje: PLAYER_ERR_TIMEOUT
    • Descripción: No se ha podido descargar el vídeo
  • Código de error: No establecido
    • Mensaje: PLAYER_ERR_DOMAIN_RESTRICTED
    • Descripción: Este video no se puede reproducir en su dominio actual.
  • Código de error: No establecido
    • Mensaje: PLAYER_ERR_IP_RESTRICTED
    • Descripción: Este video está restringido a su dirección IP actual
  • Código de error: No establecido
    • Mensaje: PLAYER_ERR_GEO_RESTRICTED
    • Descripción: Este video no se puede reproducir en su región geográfica actual.

Errores personalizados definidos por el usuario

Al definir sus propios errores personalizados, Brightcove recomienda que no utilice un código. (Verá en la sección anterior que esto es lo que Brightcove está haciendo ahora con los errores personalizados más nuevos que están definiendo). También debería considerar el uso de PLAYER_ERR_ prefijo para sus errores personalizados en aras de la coherencia, pero, por supuesto, puede nombrarlos como desee.

Si incluye el script de errores en su código, puede agregar mensajes personalizados de la siguiente manera:

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."
    }
  }
});

Visualización de errores personalizados

Cuando defina errores personalizados, debe informar a Brightcove Player cuándo desea mostrarlos. Para hacer esto, cree su propio código para determinar cuándo debe mostrarse el mensaje. Entonces usa el error() función para mostrar el mensaje de la siguiente manera:

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

Aquí el age_appropriate variable se establece en false , pero agregaría su propio código para determinar cuándo mostrar sus mensajes de error personalizados.

El error se mostraría al usuario de la siguiente manera:

mensaje de error personalizado del usuario

Hacer que los errores personalizados no sean descartables

De forma predeterminada, el visor de vídeo puede descartar un mensaje de error personalizado. Como muestra la siguiente captura de pantalla, hay una OK para hacer clic para cerrar la ventana, así como un X en la esquina superior derecha.

mensaje de error descartable

Si desea NO permitir que el visor de video descarte el mensaje de error, puede hacerlo. Cuando llamas al error() método, puede configurar el dismiss propiedad a false.

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

Cuando haga esto, el mensaje de error aparecerá de la siguiente manera, sin forma de descartar el error.

mensaje de error no descartable

método getAll ()

Puedes usar el getAll() método para ver todos los errores registrados para un jugador específico. Puedes llamar al getAll() método en cualquier momento después de la errores el complemento se ha inicializado, por ejemplo, después de player.errors() ha sido llamado. Un ejemplo de llamada al método es:

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

Un ejemplo de la pantalla de la consola, con algunos errores expandidos para obtener detalles, es:

getAll consola de visualización

en () método

También puede escuchar todos los errores usando el en() método, usando lo siguiente: 
myPlayer.on('error'), function () {
  ...
}

Si está reproduciendo anuncios y desea detectar todos los errores, debe usar esto:

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

Errores de envío

En desarrollo, es posible que desee enviar errores para probar si los cambios de configuración son exitosos. Puede hacer esto usando un código similar al que se muestra en el siguiente fragmento de código. En este caso, se agrega un botón al código para que pueda enviar el error en el momento elegido.

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

Localizar errores

El complemento de errores admite varios idiomas. Para agregar soporte de idioma, después de que el complemento se haya cargado, cargue el archivo de idioma particular que desea usar:

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

A continuación, puede utilizar las técnicas que se muestran en la Localización de Brightcove Player mediante programación documento para localizar mensajes de error.

error de catálogo de bc

Es posible que el manejo de errores en la ready() sección normal del bloque de secuencias de comandos pueda causar problemas. Por ejemplo, puede suceder que el evento bc-catalog-error pueda enviarse antes de que el reproductor esté listo, y si escucha el error en el ready() sección, no podrá manejar el error. Este problema puede ocurrir cuando se usa el filtrado geográfico, un video está inactivo, un video está fuera del rango de programación o en una cuenta diferente. Puede que descubra que no hay ningún problema en su código, pero el problema puede depender del navegador, así que tenga cuidado.

Por ejemplo, aquí hay un código de complemento que muestra un mensaje cuando un video está inactivo:

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'});
      };
    };
  });
});

Tasa de error exagerada

Si recibe lo que parece una cantidad irrazonable de errores informados, es importante saber que puede obtener eventos de error duplicados para la misma sesión, creando esta tasa de error exagerada. Brightcove Player envía los errores a Analytics en el momento exacto y en la misma cantidad en que se informan al jugador. Por ejemplo, si no hay medios en un reproductor y el código de alguna manera llama play() mil veces seguidas, mil PLAYER_ERR_NO_SRC Los errores se informarán a Analytics.

Si hay algunas sesiones con toneladas de errores que desvían los análisis, debería considerar usar la siguiente lógica para tener una mejor idea de los problemas reales:

number_of_sessions_with_errors / total_number_of_sessions
en vez de 
count of errors/number of views

Problemas conocidos

  • Al reproducir fuentes HLS, el comportamiento después de que se pierde la conectividad de red probablemente no sea el esperado. Los detalles son:
    • En la versión 6.x de Brightcove Player, los segmentos HLS se solicitan sin cesar y no MEDIA_ERR_NETWORK aparece alguna vez.
    • En la versión 5.x de Brightcove Player después de un período de tiempo (30+ segundos) un PLAYER_ERR_TIMEOUT aparece el error.
  • Al cargar videos en Edge en Windows 10 (tanto dentro de Studio como en URL públicas), un MEDIA_ERR_SRC_NOT_SUPPORTED Se muestra un error y no se puede reproducir el video.

  • En dispositivos Android y iPhones, los eventos de toque para mensajes de error no llegan al elemento de video principal. Esto significa que no puede cerrar un mensaje de error una vez que aparece. Este comportamiento puede ser un problema si el usuario está en modo de pantalla completa, porque no tendrá forma de salir de este estado.

    Actualmente se está trabajando en este problema y debería solucionarse en una versión futura del reproductor. Por ahora, puede probar una solución alternativa como esta:

    player.on("touchstart", function(e) {
  if (player.error_) {
    player.error(null);
    e.preventDefault();
  }
})

Registro de cambios

El complemento de errores ahora está integrado en el reproductor y los cambios en la funcionalidad del complemento se informarán en las notas de la versión de Brightcove Player.

Para obtener notas de la versión histórica, consulte la registro de cambios aquí.