brooke/hls-test
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

wip

Browse source
This commit is contained in:
Brooke Vibber 2023-03-30 10:20:15 -07:00
parent e508fb2d05
commit 10358547c9
6 changed files with 130 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
fmp4-codecs.html Normal file
View file

@ -0,0 +1,40 @@
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>HLS VP9/fMP4 codec variants test</title>
<link rel=stylesheet type=text/css href=video-js/video-js.css>
</head>
<body>
<h1>HLS VP9/fMP4 codec variants test</h1>
<h2>Caminandes - Llamigos</h2>
<p><a href="fmp4.html">back to main fmp4 entry</a></p>
<h3>Single video codecs with Opus .mp4 and MP3 raw audio</h3>
<p>VP9 .mp4 + Opus/MP3 (expected to work on all current iOS models, with a sharp picture):</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.vp9.m3u8>
</video>
<!--
<p>Motion-JPEG .mp4 + Opus/MP3 (expected to work on all recent-ish Mac and iOS devices, but be blurry -- known issues with iOS 13):</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.mjpeg.m3u8>
</video>
-->
<p>Motion-JPEG .mov + Opus/MP3 (expected to work on all recent-ish Mac and iOS devices, but be blurry):</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.mjpeg.mov.m3u8>
</video>
<p>H.264 .mp4 + Opus/MP3 (expected to work on all Mac and iOS devices):</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.h264.m3u8>
</video>
</body>
</html>

38
fmp4-lies.html Normal file
View file

@ -0,0 +1,38 @@
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>HLS VP9/fMP4 codec variants test</title>
<link rel=stylesheet type=text/css href=video-js/video-js.css>
</head>
<body>
<h1>HLS VP9/fMP4 codec variants test</h1>
<h2>Caminandes - Llamigos</h2>
<p><a href="fmp4.html">back to main fmp4 entry</a></p>
<h3>Lying about video type (marked as if h.264):</h3>
<p>Motion-JPEG .mp4 + Opus/MP3:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.mjpeg.lie.m3u8>
</video>
<p>Motion-JPEG .mov + Opus/MP3:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.mjpeg.mov.lie.m3u8>
</video>
<p>H.263 .3gp + Opus/MP3:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.h263.3gp.m3u8>
</video>
<p>MPEG-4 Visual .mp4 + Opus/MP3:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.mpeg4.m3u8>
</video>
</body>
</html>

29
fmp4-tracks.html
View file

@ -2,63 +2,68 @@
<html>
<head>
<meta charset=utf-8>
<title>HLS VP9/fMP4 tracks test</title>
<title>VP9/fMP4 HLS tracks test</title>
<link rel=stylesheet type=text/css href=video-js/video-js.css>
</head>
<body>
<h1>HLS VP9/fMP4 tracks test</h1>
<h1>VP9/fMP4 HLS tracks test</h1>
<h2>Caminandes - Llamigos</h2>
<p><a href="fmp4.html">back to main fmp4 entry</a></p>
<h2>Component tracks</h2>
<p>HLS VP9 in fMP4:</p>
<p>VP9 .mp4:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.480p.vp9.mp4.m3u8>
</video>
<p>HLS MJPEG.mov in fMP4:</p>
<p>MJPEG .mp4:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.120p.mjpeg.mp4.m3u8>
</video>
<p>MJPEG .mov:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.120p.mjpeg.mov.m3u8>
</video>
<p>HLS h.263.3gp in fMP4:</p>
<p>h.263 .3gp:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.288p.h263.3gp.m3u8>
</video>
<p>HLS MPEG-4 Visual in fMP4:</p>
<p>MPEG-4 Visual .mp4:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.480p.mpeg4.mp4.m3u8>
</video>
<p>HLS h.264 in fMP4:</p>
<p>h.264 .mp4:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.480p.h264.mp4.m3u8>
</video>
<p>HLS Opus in fMP4:</p>
<p>Opus audio .mp4:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.audio.opus.mp4.m3u8>
</video>
<p>HLS AAC in fMP4:</p>
<p>AAC audio .mp4:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.audio.aac.mp4.m3u8>
</video>
<p>HLS MP3 raw:</p>
<p>MP3 audio .mp3:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.audio.mpeg.mp3.m3u8>
</video>
<p>HLS MP3 QuickTime .mov:</p>
<p>MP3 audio .mov:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.audio.mpeg.mov.m3u8>
</video>
<p>HLS MP3 .mp4:</p>
<p>MP3 audio .mp4:</p>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.audio.mpeg.mp4.m3u8>
</video>

14
fmp4.html
View file

@ -17,7 +17,7 @@
<h3>With fallbacks</h3>
<p>HLS with VP9/MJPEG video tracks and Opus/MP3 audio tracks. Video.js enabled to provide HLS-over-MSE for Chrome/Firefox.</p>
<p>HLS with VP9 (.mp4)/MJPEG (.mov) video tracks and Opus/MP3 audio tracks. Video.js enabled to provide HLS-over-MSE for Chrome/Firefox.</p>
<div>
<video controls width=640 height=360>
<source type=application/vnd.apple.mpegurl src=fmp4.vp9-mjpeg.mov.m3u8>
@ -25,6 +25,7 @@
</div>
<p>Current behavior:</p>
<p>Browsers that play the VP9 track will get sharp video, those that play the MJPEG track will get blurry video. Audio should sound the same either way.</p>
<ul>
<li>MSE-based streaming with VHS
<ul>
@ -35,13 +36,14 @@
</li>
<li>Apple HLS player
<ul>
<li>Safari 16 on macOS 13 plays MJPEG and MP3 audio</li>
<li>iOS 16 plays VP9 or MJPEG if no hardware codec, and MP3 audio</li>
<li>Those last two will also play h.263 or MPEG-4 visual IF labeled as false "avc1"; MJPEG can be properly labeled as "jpeg".</li>
<li>macOS 13's Safari 16 plays MJPEG.</li>
<li>iOS 16 plays VP9 if supported, or MJPEG if no hardware codec</li>
<li>Those last two will also play h.263 or MPEG-4 visual <a href="fmp4-lies.html">IF labeled as if h.264 in the playlist</a>; MJPEG can be properly labeled as "jpeg". I haven't found a supported labeling that is correct yet.</li>
<li><i>no access to iOS 13-15</i></li>
<li>iOS 12 doesn't seem to like any version on an old iPad Air, except the h264+MP3</li>
<li>iOS 13 doesn't seem to like mjpeg in .mp4, but .mov is fine</li>
<li>iOS 12 doesn't seem to like any version on an old iPad Air, except with h264 video</li>
<li><i>no access to iOS 11</i></li>
<li>iOS 10 on iPhone 5C plays jpeg, h.263, or mpeg-4 visual IF labeled as false avc1.blah.</li>
<li>iOS 10 on iPhone 5C plays h.263, or mpeg-4 visual IF labeled as false avc1.blah. It will also play mjpeg if so mislabeled, but only in .mov not in .mp4 as above.</li>
<li>iOS 9 doesn't understand the required version of HLS playlist format, and fails.</li>
</ul>
</li>

19
make-fmp4.sh
View file

@ -42,12 +42,11 @@ set -e
#ffmpeg -i $INFILE -an $VIDEO_MPEG4 $MOVFLAGS -pass 2 -y fmp4.480p.mpeg4.mp4
#ffmpeg -i $INFILE -an $VIDEO_H263 $MOVFLAGS -y fmp4.288p.h263.3gp
#ffmpeg -i $INFILE -an $VIDEO_H263 $MOVFLAGS -y fmp4.288p.h263.mov
# Note use duration, not keyframe interval, for fragments,
# because all are keyframes!
#ffmpeg -i $INFILE -an $VIDEO_MJPEG $AUDFLAGS -y fmp4.120p.mjpeg.mp4
#ffmpeg -i $INFILE -an $VIDEO_MJPEG $AUDFLAGS -y fmp4.120p.mjpeg.mov
ffmpeg -i $INFILE -an $VIDEO_MJPEG $AUDFLAGS -y fmp4.120p.mjpeg.mp4
ffmpeg -i $INFILE -an $VIDEO_MJPEG $AUDFLAGS -y fmp4.120p.mjpeg.mov
# Playlist processing
php extract-playlist.php fmp4.audio.mpeg.mp3 > fmp4.audio.mpeg.mp3.m3u8
@ -68,15 +67,17 @@ MPEG_TRACK=audio.mpeg.mp3
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 480p.vp9.mp4 > fmp4.vp9.m3u8
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 480p.h264.mp4 > fmp4.h264.m3u8
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 480p.mpeg4.mp4 > fmp4.mpeg4.m3u8
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 288p.h263.3gp > fmp4.h263.3gp.m3u8
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 288p.h263.mov > fmp4.h263.mov.m3u8
php meta-playlist.php --lie fmp4 audio.opus.mp4 $MPEG_TRACK 480p.mpeg4.mp4 > fmp4.mpeg4.m3u8
php meta-playlist.php --lie fmp4 audio.opus.mp4 $MPEG_TRACK 288p.h263.3gp > fmp4.h263.3gp.m3u8
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 120p.mjpeg.mp4 > fmp4.mjpeg.m3u8
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 120p.mjpeg.mov > fmp4.mjpeg.mov.m3u8
php meta-playlist.php --lie fmp4 audio.opus.mp4 $MPEG_TRACK 120p.mjpeg.mp4 > fmp4.mjpeg.lie.m3u8
php meta-playlist.php --lie fmp4 audio.opus.mp4 $MPEG_TRACK 120p.mjpeg.mov > fmp4.mjpeg.mov.lie.m3u8
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 480p.vp9.mp4 480p.h264.mp4 > fmp4.vp9-h264.m3u8
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 480p.vp9.mp4 480p.mpeg4.mp4 > fmp4.vp9-mpeg4.m3u8
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 480p.vp9.mp4 288p.h263.3gp > fmp4.vp9-h263.3gp.m3u8
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 480p.vp9.mp4 288p.h263.mov > fmp4.vp9-h263.mov.m3u8
php meta-playlist.php --lie fmp4 audio.opus.mp4 $MPEG_TRACK 480p.vp9.mp4 480p.mpeg4.mp4 > fmp4.vp9-mpeg4.m3u8
php meta-playlist.php --lie fmp4 audio.opus.mp4 $MPEG_TRACK 480p.vp9.mp4 288p.h263.3gp > fmp4.vp9-h263.3gp.m3u8
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 480p.vp9.mp4 120p.mjpeg.mp4 > fmp4.vp9-mjpeg.m3u8
php meta-playlist.php fmp4 audio.opus.mp4 $MPEG_TRACK 480p.vp9.mp4 120p.mjpeg.mov > fmp4.vp9-mjpeg.mov.m3u8
php meta-playlist.php --lie fmp4 audio.opus.mp4 $MPEG_TRACK 480p.vp9.mp4 120p.mjpeg.mp4 > fmp4.vp9-mjpeg.lie.m3u8
php meta-playlist.php --lie fmp4 audio.opus.mp4 $MPEG_TRACK 480p.vp9.mp4 120p.mjpeg.mov > fmp4.vp9-mjpeg.mov.lie.m3u8

39
meta-playlist.php
View file

@ -2,13 +2,17 @@
$argv = $_SERVER['argv'];
$self = array_shift( $argv );
if ( ( $argv[0] ?? '' ) === '--lie') {
$lie = array_shift( $argv );
} else {
$lie = false;
}
$base = array_shift( $argv ); // "fmp4"
$audio = [];
$video = [];
$audioCodecs = [
//'mpeg' => 'mp4a.40.34', // (this seems wrong but it works for now)
'mpeg' => 'mp4a.6b', // should work!
'mpeg' => 'mp4a.6b', // works but, technically this is for .fmp4 and we're in mp3 raw
//'mpeg' => 'mp3', // doesn't seem to work
'aac' => 'mp4a.40.2',
'opus' => 'opus',
@ -16,33 +20,24 @@ $audioCodecs = [
// @fixme use correct settings based on the file
$videoCodecs = [
'vp9' => 'vp09.00.41.08',
'vp9' => 'vp09.00.41.08',
'h264' => 'avc1.42e00a',
//'mpeg4' => 'mp4v.20',
// Lies for desktop safari
//'mpeg4' => 'avc1', // lies
//'h263' => 'avc1', // lies
// truths
//'mjpeg' => 'jpeg', // works on current mac & iOS 16, but not iOS 10
//'h263' => 's263', // fail? or should it be s263?
//'mpeg4' => 'mp4v.20.9', // fail?
// These lies work on current mac & and iOS 16, but not iOS 10
//'h263' => 'jpeg', // lies
//'mpeg4' => 'jpeg', // lies
'mjpeg' => 'jpeg', // works on current mac & iOS 16, but not iOS 10
'h263' => 's263', // fail? or should it be s263?
'mpeg4' => 'mp4v.20.9', // fail?
// none of them seem to work on iOS 12!
// These lies work on iOS 10 and iOS 16 too
'mjpeg' => 'avc1.42e00a', // lies
'h263' => 'avc1.42e00a', // lies
'mpeg4' => 'avc1.42e00a', // lies
];
if ( $lie ) {
// These lies work on iOS 10 and iOS 16 too
$videoCodecs['mjpeg'] = 'avc1.42e00a';
$videoCodecs['h263' ] = 'avc1.42e00a';
$videoCodecs['mpeg4'] = 'avc1.42e00a';
}
while ( count( $argv ) > 0 ) {
$track = array_shift( $argv );