I have a strange issue with converted and packaged files from AWS MediaConvert. I have a workflow, which I upload any media to an S3 bucket. Next a Lambda Script hands over the files to MediaConvert. I am trying to convert to MPEG-Dash with VP9 and AAC as Codecs. Eventually, the video is written to a destination Bucket.
To the issue: When I'm trying to play one of my finished Dash files (I downloaded all assets locally with the AWS CLI) in the Browser with Shaka Player or Dash.js I get a strange message in the JavaScript console (on both Frameworks):
Jumping forward 3.0016669999999976 seconds because of gap starting at 84.118 and ending at 87.087
for example. And this from the beginning until the video ends. On my screen it looks like I'm fast forwarding the whole video. And this only happens in Firefox. Chrome and Safari are fine. I tested Firefox on Mac and on Linux. Firefox Version 121.0 on both.
I used the following code for Shaka Player:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/4.7.1/shaka-player.compiled.debug.min.js"></script>
<title>VP9Test</title>
</head>
<body>
<h1>VP9 Test</h1>
<video id="video" width="720" controls></video>
<script>
const manifestUri = 'http://host/video/master.mpd';
function initApp() {
// Install built-in polyfills to patch browser incompatibilities.
shaka.polyfill.installAll();
// Check to see if the browser supports the basic APIs Shaka needs.
if (shaka.Player.isBrowserSupported()) {
// Everything looks good!
initPlayer();
} else {
// This browser does not have the minimum set of APIs we need.
console.error('Browser not supported!');
}
}
async function initPlayer() {
// Create a Player instance.
const video = document.getElementById('video');
const player = new shaka.Player();
await player.attach(video);
// Attach player to the window to make it easy to access in the JS console.
window.player = player;
// Listen for error events.
player.addEventListener('error', onErrorEvent);
// Try to load a manifest.
// This is an asynchronous process.
try {
await player.load(manifestUri);
// This runs if the asynchronous load is successful.
console.log('The video has now been loaded!');
} catch (e) {
// onError is executed if the asynchronous load fails.
onError(e);
}
}
function onErrorEvent(event) {
// Extract the shaka.util.Error object from the event.
onError(event.detail);
}
function onError(error) {
// Log the error.
console.error('Error code', error.code, 'object', error);
}
document.addEventListener('DOMContentLoaded', initApp);
</script>
</body>
</html>
It's pretty much the code from the docs.
I have 3 assets:
- abr-dash-amv-vp9 (Downloaded from Youtube, h264, Does not work)
- abr-dash-jjk-vp9 (Torrent, HEVC, Does not work)
- abr-dash-unity-vp9 (Downloaded from Youtube, h264, Surprisingly works)
All assets to test:
Before MediaConvert: https://drive.google.com/file/d/1zpGWAsufb3X33n3UTJdLI01pbKVJfVvX/view After MediaConvert: https://drive.google.com/file/d/1eswBTSJBEFFyW4kgTP9w2i4c_S96Ku5E/view
Here are my MediaConvert settings:
{
"Queue": "arn:aws:mediaconvert:us-east-1:694531566426:queues/Default",
"UserMetadata": {
"assetID": "ffb4b4a5-6746-42e3-bccb-e57a04bc4832"
},
"Role": "arn:aws:iam::694531566426:role/MediaConvertRole",
"Settings": {
"TimecodeConfig": {
"Source": "ZEROBASED"
},
"OutputGroups": [
{
"Name": "DASH ISO",
"Outputs": [
{
"ContainerSettings": {
"Container": "MPD"
},
"VideoDescription": {
"Width": 1920,
"Height": 1080,
"CodecSettings": {
"Codec": "VP9",
"Vp9Settings": {
"RateControlMode": "VBR",
"Bitrate": 4000000
}
}
},
"NameModifier": "_v1"
},
{
"ContainerSettings": {
"Container": "MPD"
},
"VideoDescription": {
"Width": 1600,
"Height": 900,
"CodecSettings": {
"Codec": "VP9",
"Vp9Settings": {
"RateControlMode": "VBR",
"Bitrate": 2600000
}
}
},
"NameModifier": "_v2"
},
{
"ContainerSettings": {
"Container": "MPD"
},
"VideoDescription": {
"Width": 1280,
"Height": 720,
"CodecSettings": {
"Codec": "VP9",
"Vp9Settings": {
"RateControlMode": "VBR",
"Bitrate": 1800000
}
}
},
"NameModifier": "_v3"
},
{
"ContainerSettings": {
"Container": "MPD"
},
"VideoDescription": {
"Width": 960,
"Height": 540,
"CodecSettings": {
"Codec": "VP9",
"Vp9Settings": {
"RateControlMode": "VBR",
"Bitrate": 1200000
}
}
},
"NameModifier": "_v4"
},
{
"ContainerSettings": {
"Container": "MPD"
},
"AudioDescriptions": [
{
"AudioSourceName": "Audio Selector 1",
"CodecSettings": {
"Codec": "AAC",
"AacSettings": {
"Bitrate": 192000,
"CodingMode": "CODING_MODE_2_0",
"SampleRate": 48000
}
}
}
],
"NameModifier": "_a1"
}
],
"OutputGroupSettings": {
"Type": "DASH_ISO_GROUP_SETTINGS",
"DashIsoGroupSettings": {
"SegmentLength": 30,
"Destination": "s3://bucket-dest/assets/ffb4b4a5-6746-42e3-bccb-e57a04bc4832/dash/amv",
"FragmentLength": 2,
"SegmentControl": "SEGMENTED_FILES"
}
}
}
],
"Inputs": [
{
"AudioSelectors": {
"Audio Selector 1": {
"DefaultSelection": "DEFAULT"
}
},
"VideoSelector": {},
"TimecodeSource": "ZEROBASED",
"FileInput": "s3://bucket-src/amv.mp4"
}
]
},
"BillingTagsSource": "JOB",
"AccelerationSettings": {
"Mode": "DISABLED"
},
"StatusUpdateInterval": "SECONDS_60",
"Priority": 0
}
At this point, I am really clueless. I hope somebody can help me.
You mentioned that 'this only happens in Firefox' and other players are fine. This points to a player-specific issue. Every player does its buffering and decoding a little bit differently. You might try the demo version of the bitmovin player or jwplayer as well.
The recommended next step for a player-specific issue is to look at the support forums for that player; or perhaps use a different player plugin for Firefox. You can most likely alter your job settings to better suit a certain player once you know what 'recipe' that player prefers. This requires some research and experimentation with the player you choose.
Regarding the output - the output manifest should be checked for gaps or new periods at the specified time -- does the manifest specify any jumps?
FYI, you can validate a DASH manifest using one of the validation tools at https://dashif.org/tools/validators/
Other helpful tips:
a. source asset should be checked for multiple ELST atoms, which are used to start playback of audio or video at a specific time in the file - basically skipping over part of the source file.
b. When possible, use source files with a constant frame rate.