javascript - wavesurfer 实时获取耗时

Question

我正在使用 katspaugh's waveSurfer library用于播放声音文件。

我编写代码以这种方式显示“耗时/总时间”。

waveSurfer.on('play', function() {
   $scope.getCurrentDuration();
});

$scope.getCurrentDuration() 是一个将浮点型变量转换为字符串型变量的函数，如下所示:

$scope.getDuration = function() {

  if ($scope.waveSurferReady) {
    var time = waveSurfer.getDuration(); // get duration(float) in second
    var minute = Math.floor(time / 60); // get minute(integer) from time
    var tmp = Math.round(time - (minute * 60)); // get second(integer) from time
    var second = (tmp < 10 ? '0' : '') + tmp; // make two-figured integer if less than 10

    return String(minute + ':' + second); // combine minute and second in string
  }

  else {
    return 'not ready yet'; // waveSurfer is not ready yet
  }
};

但问题是， 在这部分:waveSurfer.on('play', function() ...)回调函数只执行一次。

我希望回调函数会定期调用，但它只执行一次，因此结果只在开始时间显示耗时。

我该如何解决这个问题？

Answer 1

调查 source ，我发现 audioprocess 事件与 html5 timeupdate 配对事件。

尝试一下。

waveSurfer.on('audioprocess', function() {
   // do stuff here
});