Video.js: currentTime() not working on video load

Created on 2 Jul 2014 · 12Comments · Source: videojs/video.js

We are trying to set currentTime for people to resume a playback. e.g. Auto play the video from the position they last played. We try to initialize the player with autoplay and set currentTime, but it doesn't work.

Example code:

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>

  <link href="http://vjs.zencdn.net/4.2/video-js.css" rel="stylesheet">
  <script src="http://vjs.zencdn.net/4.2/video.js"></script>
</head>
<body>
  <video id="my_video_1" class="video-js vjs-default-skin" controls autoplay preload="auto" width="640px" height="360px" data-setup='{}'>
   <source src="http://vjs.zencdn.net/v/oceans.mp4" type='video/mp4'>
   <source src="http://vjs.zencdn.net/v/oceans.webm" type='video/webm'>
  </video>

  </body>
</html>

var player = videojs('my_video_1');
player.ready(function() {
  player.currentTime(10);
});

question

Source

zang

Most helpful comment

@mmcc for me it doesn't work if autoplay is off. It starts from 0 and doesn't depend on setting current time.
I use
videojs = window['videojs']; this.player = this.videojs('player', playerOptions); this.player.currentTime(120);

On mobile it doesn't set current time to 120 seconds (I use android) only in desctop chrome it works.
Would you provide any solution?

mimipaskova on 27 Oct 2017

👍8

All 12 comments

@zang can you try setting the starttime as an option ({starttime: seconds}).

oberhamsi on 3 Jul 2014

it works if autoplay is off. but, video still starts from 0 if autoplay turned on. thanks oberhamsi anyway. :)

zang on 3 Jul 2014

👍1

What if you don't set autoplay and then call player.play() after setting currentTime?

Both html5 and flash video can be a little tricky with when you can seek for the first time. What would probably be better is if you waited for the loadedmetadata event to call currentTime().

var player = videojs('my_video_1');
player.on('loadedmetadata', function() {
  player.currentTime(10);
});

heff on 3 Jul 2014

👍3 👎1

@heff i have trouble with ios. your code helps on ios7: it starts the video, plays from the start for a short while (for 1 sec or so) and then jumps to 10 sec but then pauses. on ios6 it seems to just ignore the call to currentTime().

i tried without videojs, just plain

I can jump to time X once video.seekable is defined and X is between video.seekable.start(0) and video.seekable.end(0) (which makes sense... that's what seekable is supposed to tell me). But when is seekable being set? On iOS6 I observe that it is being set sometime between canplay and canplaythrough.

This code was helpful for debugging: https://github.com/JoernBerkefeld/iOSvideoSeekOnLoad/blob/master/seekonload.js

But you can just as well listen to all progress and continuously check video.seekable until it is set.

update: this blogpost observes the same thing http://adamernst.com/post/6570213273/seeking-an-html5-video-player-on-the-ipad

oberhamsi on 4 Jul 2014

@oberhamsi I think your problem could probably be considered a separate issue. Mind opening a new issue for that? Really appreciate the detailed report, though.

@zang Did @heff's suggestion work for you? I'm closing this one, but comment if you need more help.

mmcc on 12 Jul 2014

On mobile it doesn't set current time to 120 seconds (I use android) only in desctop chrome it works.
Would you provide any solution?

mimipaskova on 27 Oct 2017

👍8

@mimipaskova hi , the currentTime() is still doesn’t work on the iphone .
how to solve it ?
please

whalestore on 26 Nov 2018

@whalestore Well, I used setInterval, because on iPhone (and Safari I think) currentTime tries to change before the player is initialized. And my default value for starting time is 0.1 not 0 (I'm not sure if this is helpful.) And only I had observable for loadedmetadata event.
Sorry for the late response.

mimipaskova on 5 Dec 2018

Any solution for the currentTime on phone ? We'r still searching for a solution to this, any idea or you are trying ro resolve it ?

avedisdeclabs on 19 Jul 2019

currentTime() is broken, still even in 7+ version.

How to continue then when src changed???

BonBonSlick on 17 Aug 2019

//import { timer } from 'rxjs';


  async playVideo(videoId: string) {
    this.playerObj.muted(true);
    this.playerObj.src({ src: 'https://www.youtube.com/watch?v=' + videoId, type: 'video/youtube' });
    this.playerObj.play();
    let ms = 10000;
    let interval = 100;
    while (ms > 0) {
      await timer(interval).take(1).toPromise(); //You can replace this with another idle logic
      let time = this.playerObj.currentTime()
      if (time > 0) {
        this.playerObj.currentTime(20);
        break;
      }
      ms -= interval;
    }
    if (ms <= 0) {
      throw new Error("Video load timeout");
    }
    this.playerObj.muted(false);
  }

This worked 100% of the time for me