Устранение ошибок воспроизведения мультимедиа в Интернете

Франсуа Бофор
François Beaufort

Отладка мультимедийных элементов HTML, таких как <video> и <audio> , может быть сложной, поскольку реализации декодеров различаются по тому, что они считают ошибками (аппаратные декодеры обычно являются наиболее строгими), особенно когда при воспроизведении могут использоваться более экзотические функции конкретного кодека. . К счастью для нас, есть множество инструментов, которые мы можем использовать, чтобы помочь.

При отладке ошибок воспроизведения мультимедиа первое, что мы обычно проверяем, — это атрибут error MediaError в медиа-элементе HTML. Этот атрибут является подсказкой высокого уровня о том, что вызвало ошибку воспроизведения мультимедиа. Свойство MediaError.code возвращает числовое значение, которое представляет тип ошибки, произошедшей в элементе мультимедиа. Другое свойство MediaError.message может предоставлять строку с некоторой диагностической информацией из браузера.

const video = document.querySelector('video');
video
.addEventListener('error', () => {
  console
.log('Error code: ' + video.error.code);
  console
.log('Error message: ' + video.error.message);
});

Эти свойства наиболее полезны для анализа телеметрии и не всегда могут предоставить достаточно информации для отладки ошибок воспроизведения. Из соображений конфиденциальности иногда приходится опускать полный текст ошибки.

Чтобы получить доступ к полной информации об ошибках, используйте «Медиа-панель» Chrome DevTools для просмотра журналов мультимедиа. Вы найдете множество информации, такой как события, предупреждения и сообщения об ошибках, которые дадут вам полезные подсказки об ошибках воспроизведения мультимедиа.

Снимок экрана медиа-панели в Chrome DevTools
Медиа-панель в Chrome DevTools.

Вы также можете использовать бесплатное приложение FFmpeg для проверки целостности медиафайла с помощью этой команды:

ffmpeg -err_detect explode -i <file> -f null -

Вот некоторые ошибки, которые вы можете получить с помощью этих команд для видеофайла с неверным кодеком:

[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

Средство просмотра структуры блоков MP4Box.js / ISOBMFF — полезный инструмент для устранения проблем с битовым потоком. Однако для его использования требуется уже понимание MP4.

Наконец, некоторые профессиональные инструменты анализа видеопотоков, такие как VQAnalyzer , Elecard StreamEye и Codecian CodecVisa , могут стоить ваших денег.