Le débogage des éléments multimédias HTML, tels que <video> et <audio>, peut s'avérer difficile, car les implémentations de décodeur varient en termes d'erreurs (les décodeurs matériels étant généralement les plus stricts), en particulier lorsqu'une lecture peut utiliser des fonctionnalités plus ésotériques d'un codec particulier. Heureusement, nous pouvons utiliser différents outils pour vous aider.
Lorsque vous déboguez des erreurs de lecture multimédia, la première chose que nous vérifions généralement est l'attribut error MediaError sur l'élément multimédia HTML. Cet attribut donne une indication générale sur la cause de l'erreur de lecture du contenu multimédia. La propriété MediaError.code renvoie une valeur numérique qui représente le type d'erreur survenue sur un élément multimédia. L'autre propriété MediaError.message peut fournir une chaîne contenant des informations de diagnostic provenant du navigateur.
const video = document.querySelector('video');
video.addEventListener('error', () => {
console.log('Error code: ' + video.error.code);
console.log('Error message: ' + video.error.message);
});
Ces propriétés sont particulièrement utiles pour l'analyse de la télémétrie et ne fournissent pas toujours suffisamment d'informations pour déboguer les erreurs de lecture. Pour des raisons de confidentialité, le texte d'erreur complet doit parfois être omis.
Pour accéder à des informations complètes sur les erreurs, utilisez le panneau multimédia des outils pour les développeurs Chrome afin d'afficher les journaux multimédias. De nombreuses informations, telles que des événements, des avertissements et des messages d'erreur, vous donneront de nombreuses indications sur les erreurs de lecture des contenus multimédias.
Vous pouvez également utiliser l'application gratuite FFmpeg pour vérifier l'intégrité des fichiers multimédias à l'aide de la commande suivante :
ffmpeg -err_detect explode -i <file> -f null -
Voici quelques erreurs que vous pouvez rencontrer avec ces commandes pour un fichier vidéo dont le codec n'est pas valide :
[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
Le lecteur de structure de boîte MP4Box.js/ISOBMFF est un outil utile pour déboguer les problèmes de flux de bits. Vous devez toutefois déjà connaître le format MP4 pour l'utiliser.
Enfin, certains outils professionnels d'analyse de flux vidéo, tels que VQAnalyzer, Elecard StreamEye et Codecian CodecVisa, peuvent s'avérer intéressants.