<video> 및 <audio>와 같은 HTML 미디어 요소의 디버깅은 디코더 구현이 오류라고 생각하는 대상이 다르기 때문에 (일반적으로 하드웨어 디코더가 가장 엄격함), 특히 재생이 특정 코덱의 난해한 기능을 사용할 수 있는 경우 디코더 구현이 다르기 때문에 디버깅이 어려울 수 있습니다. 다행히 Google에서 활용할 수 있는 다양한 도구가 있습니다.
미디어 재생 오류를 디버깅할 때 일반적으로 가장 먼저 확인하는 사항은 HTML 미디어 요소의 MediaError error 속성입니다. 이 속성은 미디어 재생 오류의 원인을 대략적으로 알려줍니다. 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의 '미디어 패널'을 사용하여 미디어 로그를 확인하세요. 이벤트, 경고, 오류 메시지 등 다양한 정보를 통해 미디어 재생 오류에 관한 유용한 정보를 얻을 수 있습니다.
또한 다음 명령어 덕분에 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 Box Structure Viewer는 비트스트림 문제를 디버깅하는 데 유용한 도구입니다. 하지만 MP4를 사용하려면 이미 이해하고 있어야 합니다.
마지막으로 VQAnalyzer, Elecard StreamEye 및 Codecian CodecVisa와 같은 일부 동영상 스트림 분석 전문 도구를 사용하면 비용이 상당할 수 있습니다.