La depuración de elementos multimedia HTML, como <video> y <audio>, puede ser difícil, ya que las implementaciones del decodificador varían en lo que consideran errores (los decodificadores de hardware suelen ser los más estrictos), en especial cuando una reproducción puede usar funciones más esotéricas de un códec en particular. Afortunadamente para nosotros, existen varias herramientas que podemos aprovechar para ayudar.
Cuando depuras errores de reproducción de contenido multimedia, lo primero que revisamos normalmente es el atributo MediaError error en el elemento multimedia HTML. Este atributo es una sugerencia de alto nivel de lo que causó el error de reproducción de contenido multimedia. La propiedad MediaError.code muestra un valor numérico que representa el tipo de error que ocurrió en un elemento multimedia. La otra propiedad MediaError.message puede proporcionar una cadena con información de diagnóstico del navegador.
const video = document.querySelector('video');
video.addEventListener('error', () => {
console.log('Error code: ' + video.error.code);
console.log('Error message: ' + video.error.message);
});
Estas propiedades son más útiles para el análisis de telemetría y es posible que no siempre proporcionen suficiente información para depurar errores de reproducción. Por motivos de privacidad, a veces se debe omitir el texto de error completo.
Para acceder a la información completa de los errores, usa el "Media Panel" de las Herramientas para desarrolladores de Chrome para ver los registros multimedia. Encontrarás mucha información, como eventos, advertencias y mensajes de error, que te darán algunas buenas pistas de los errores de reproducción de contenido multimedia.
También puedes usar la aplicación gratuita FFmpeg para verificar la integridad de los archivos multimedia con este comando:
ffmpeg -err_detect explode -i <file> -f null -
A continuación, se muestran algunos errores que puedes encontrar con estos comandos en un archivo de video con un códec no válido:
[mov,mp4,m4a,3gp,3g2,mj2 @ 0x7fc62df05380] Could not find codec parameters for stream 0 (Video: none (zzzz / 0x7A7A7A7A), none(smpte170m/smpte170m/bt709, progressive), 320x240, 4 kb/s): unknown codec
Consider increasing the value for the 'analyzeduration' (0) and 'probesize' (5000000) options
[matroska,webm @ 0x7fd45b705380] Unknown EBML doctype '0000'
[matroska,webm @ 0x7f8d17904d40] Element at 0x8b ending at 0x10400000095 exceeds containing master element ending at 0x9b
Truncating packet of size 9069 to 94
El Visor de estructura de cajas de MP4Box.js / ISOBMFF es una herramienta útil para depurar problemas de flujos de bits. Sin embargo, es necesario tener conocimientos previos sobre MP4 para su uso.
Por último, algunas herramientas profesionales de análisis de transmisiones de video, como VQAnalyzer, Elecard StreamEye y Codecian CodecVisa, pueden ser útiles.