Déboguer les erreurs de lecture de contenus multimédias sur le Web

François Beaufort
François Beaufort

Le débogage des éléments multimédias HTML, tels que <video> et <audio>, peut être difficile, car les implémentations de décodeur varient selon ce qu'elles considèrent comme des 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 divers outils pour nous 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 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. Vous trouverez de nombreuses informations telles que des événements, des avertissements et des messages d'erreur qui vous donneront des indications sur les erreurs de lecture multimédia.

Capture d&#39;écran du panneau &quot;Media&quot; (Multimédia) dans Chrome DevTools
Panneau "Media" dans les outils pour les développeurs Chrome

Vous pouvez également utiliser l'application sans frais 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 des flux vidéo, comme VQAnalyzer, Elecard StreamEye et Codecian CodecVisa, peuvent valoir le coup.