Debugowanie błędów odtwarzania multimediów w internecie

François Beaufort
François Beaufort

Debugowanie elementów multimedialnych HTML, takich jak <video><audio>, może być trudne, ponieważ implementacje dekoderów różnią się tym, co uważają za błędy (dekodery sprzętowe są zazwyczaj najbardziej restrykcyjne), zwłaszcza gdy odtwarzanie może używać bardziej zaawansowanych funkcji danego kodeka. Na szczęście istnieje wiele narzędzi, które mogą nam pomóc.

Podczas debugowania błędów odtwarzania multimediów najpierw sprawdzamy atrybuty error MediaError w elemencie multimedialnym HTML. Ten atrybut to ogólny opis przyczyny błędu odtwarzania multimediów. Właściwość MediaError.code zwraca wartość liczbową, która wskazuje rodzaj błędu występującego w elemencie multimedialnym. Inna usługa MediaError.message może zawierać ciąg znaków z informacjami diagnostycznymi z przeglądarki.

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

Te właściwości są najbardziej przydatne do analizy danych telemetrycznych i nie zawsze mogą zawierać wystarczającą ilość informacji do debugowania błędów odtwarzania. Ze względów związanych z ochroną prywatności pełny tekst błędu musi być czasem pominięty.

Aby uzyskać pełne informacje o błędach, w Narzędziach deweloperskich Chrome otwórz „Panel multimediów”, aby wyświetlić dzienniki multimediów. Znajdziesz tam wiele informacji, takich jak zdarzenia, ostrzeżenia i komunikaty o błędach, które mogą pomóc w zidentyfikowaniu błędów odtwarzania multimediów.

Zrzut ekranu przedstawiający panel multimediów w Narzędziach deweloperskich w Chrome
Panel multimediów w Narzędziach deweloperskich w Chrome.

Możesz też użyć bezpłatnej aplikacji FFmpeg, aby sprawdzić integralność pliku multimedialnego za pomocą tego polecenia:

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

Oto niektóre błędy, które mogą wystąpić podczas korzystania z tych poleceń w przypadku pliku wideo z nieprawidłowym kodekiem:

[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 Box Structure Viewer to przydatne narzędzie do debugowania problemów z bitstreamem. Wymaga to jednak znajomości formatu MP4.

Warto też rozważyć skorzystanie z profesjonalnych narzędzi do analizy strumieni wideo, takich jak VQAnalyzer, Elecard StreamEyeCodecian CodecVisa.