2022-06-06 22:38:07 +00:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset=utf-8>
|
|
|
|
|
<title>HLS WebM test with codec</title>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<h1>HLS WebM test with codec</h1>
|
|
|
|
|
|
|
|
|
|
<p>AAC in MP4</p>
|
2022-06-26 21:17:53 +00:00
|
|
|
<video controls width=640 height=360>
|
2022-06-06 22:38:07 +00:00
|
|
|
<source type=application/vnd.apple.mpegurl src=av-aac-mp4.m3u8>
|
|
|
|
|
</video>
|
|
|
|
|
|
|
|
|
|
<p>ALAC in MP4</p>
|
2022-06-26 21:17:53 +00:00
|
|
|
<video controls width=640 height=360>
|
2022-06-06 22:38:07 +00:00
|
|
|
<source type=application/vnd.apple.mpegurl src=av-alac-mp4.m3u8>
|
|
|
|
|
</video>
|
|
|
|
|
|
|
|
|
|
<p>FLAC in MP4</p>
|
2022-06-26 21:17:53 +00:00
|
|
|
<video controls width=640 height=360>
|
2022-06-06 22:38:07 +00:00
|
|
|
<source type=application/vnd.apple.mpegurl src=av-flac-mp4.m3u8>
|
|
|
|
|
</video>
|
|
|
|
|
|
|
|
|
|
<p>MP3 stream</p>
|
2022-06-26 21:17:53 +00:00
|
|
|
<video controls width=640 height=360>
|
2022-06-06 22:38:07 +00:00
|
|
|
<source type=application/vnd.apple.mpegurl src=av-mp3-mp4.m3u8>
|
|
|
|
|
</video>
|
|
|
|
|
|
2022-06-26 21:17:53 +00:00
|
|
|
<p>MP3 in MP4 (as mp4a.6b)</p>
|
|
|
|
|
<video controls width=640 height=360>
|
|
|
|
|
<source type=application/vnd.apple.mpegurl src=av-mp3mp4-h264.m3u8>
|
|
|
|
|
</video>
|
|
|
|
|
|
|
|
|
|
<p>MP3 in MP4 (as mp4a.40.34)</p>
|
|
|
|
|
<video controls width=640 height=360>
|
|
|
|
|
<source type=application/vnd.apple.mpegurl src=av-mp3mp4b-h264.m3u8>
|
|
|
|
|
</video>
|
|
|
|
|
|
|
|
|
|
<p>MP3 in MP4 (as mp3)</p>
|
|
|
|
|
<video controls width=640 height=360>
|
|
|
|
|
<source type=application/vnd.apple.mpegurl src=av-mp3mp4c-h264.m3u8>
|
|
|
|
|
</video>
|
|
|
|
|
|
|
|
|
|
<p>Opus in MP4 (as mp4a.ad)</p>
|
|
|
|
|
<video controls width=640 height=360>
|
2022-06-06 22:38:07 +00:00
|
|
|
<source type=application/vnd.apple.mpegurl src=av-opus-mp4.m3u8>
|
|
|
|
|
</video>
|
2022-06-26 21:17:53 +00:00
|
|
|
|
|
|
|
|
<p>Opus in MP4 (as opus)</p>
|
|
|
|
|
<video controls width=640 height=360>
|
|
|
|
|
<source type=application/vnd.apple.mpegurl src=av-opusb-mp4.m3u8>
|
|
|
|
|
</video>
|
|
|
|
|
|
|
|
|
|
<p>Opus in MP4 (as Opus)</p>
|
|
|
|
|
<video controls width=640 height=360>
|
|
|
|
|
<source type=application/vnd.apple.mpegurl src=av-opusc-mp4.m3u8>
|
|
|
|
|
</video>
|
|
|
|
|
|
|
|
|
|
<p>Vorbis in MP4 (as mp4a.dd.0)</p>
|
|
|
|
|
<video controls width=640 height=360>
|
|
|
|
|
<source type=application/vnd.apple.mpegurl src=av-vorbis-mp4.m3u8>
|
|
|
|
|
</video>
|
|
|
|
|
|
|
|
|
|
<p>Vorbis in MP4 (as vorbis)</p>
|
|
|
|
|
<video controls width=640 height=360>
|
|
|
|
|
<source type=application/vnd.apple.mpegurl src=av-vorbisb-mp4.m3u8>
|
|
|
|
|
</video>
|
2022-06-06 22:38:07 +00:00
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
let codes = {
|
|
|
|
|
[MediaError.MEDIA_ERR_ABORTED]: 'MEDIA_ERR_ABORTED',
|
|
|
|
|
[MediaError.MEDIA_ERR_NETWORK]: 'MEDIA_ERR_NETWORK',
|
|
|
|
|
[MediaError.MEDIA_ERR_DECODE]: 'MEDIA_ERR_DECODE',
|
|
|
|
|
[MediaError.MEDIA_ERR_SRC_NOT_SUPPORTED]: 'MEDIA_ERR_SRC_NOT_SUPPORTED',
|
|
|
|
|
};
|
|
|
|
|
function errify(hls, err) {
|
|
|
|
|
hls.addEventListener('error', function() {
|
|
|
|
|
let {code, message} = this.error;
|
|
|
|
|
let codeName = codes[code];
|
|
|
|
|
err.textContent = `${code} ${codeName}: ${message}`;
|
|
|
|
|
});
|
|
|
|
|
}
|
2022-06-26 21:17:53 +00:00
|
|
|
for (let hls of document.querySelectorAll('video')) {
|
|
|
|
|
let err = document.createElement('p');
|
|
|
|
|
if (hls.nextSibling) {
|
|
|
|
|
hls.parentNode.insertBefore(err, hls.nextSibling);
|
|
|
|
|
} else {
|
|
|
|
|
hls.parentNode.appendChild(err);
|
|
|
|
|
}
|
|
|
|
|
errify(hls, err);
|
|
|
|
|
}
|
2022-06-06 22:38:07 +00:00
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
