Retrieving HTML5 video duration separately from the file

Do that:

var myVideoPlayer = document.getElementById('video_player');
myVideoPlayer.addEventListener('loadedmetadata', function() {
    console.log(myVideoPlayer.duration);
});

Gets triggered when the browser received all the meta data from the video.

[edit] Since then the better approach would be to listen to ‘durationchange’ instead of ‘loadedmetadata’ which can be unreliable, as such:

myVideoPlayer.addEventListener('durationchange', function() {
    console.log('Duration change', myVideoPlayer.duration);
});

Leave a Comment