javascript - video.js - 在播放期间找到搜索的开始时间

Question

我正在使用 video.js ( http://www.videojs.com/ ) 构建视频审批系统，需要在播放器中记录用户操作。我可以通过播放、暂停、结束等方式轻松完成此操作，但在尝试记录搜索时遇到了问题。

我希望能够在 plaback 中记录任何搜索的开始和结束时间，以便我们知道用户是否实际上没有观看视频的某个部分。玩家似乎提供事件来支持这一点，但我正在努力从中获得正确的时间。

当用户跳过视频时，播放器会按顺序发出以下事件:暂停、搜索、搜索、播放。

如果我在任何这些事件中使用 currentTime() 查询播放器对象，结果始终是搜索的结束时间，即使是在初始暂停事件上也是如此。这意味着我可以记录搜索结束的位置，但不能记录搜索的开始位置。

谁能帮我找到视频中搜索开始的位置？

如果这不可能，我会选择一种在播放期间禁用搜索的方法。

编辑:按要求添加代码。这很简单:

var trackedPlayer = videojs('pvp-player');

trackedPlayer.on("play", function (e) {
    console.log("Video playback started: " + trackedPlayer.currentTime());
});

trackedPlayer.on("pause", function (e) {
    console.log("Video playback paused: " + trackedPlayer.currentTime());
});

trackedPlayer.on("seeking", function (e) {
    console.log("Video seeking: " + trackedPlayer.currentTime());
});


trackedPlayer.on("seeked", function (e) {
    console.log("Video seek ended: " + trackedPlayer.currentTime());
});

trackedPlayer.on("ended", function (e) {
    console.log("Video playback ended.");
});

如果我可以获得我想要的所有跟踪，我将用 ajax 调用替换 console.log 来存储数据。

Answer 1

您可以收听 timeupdate 并在调用 seeking 之前获取倒数第二个值作为您的源:

var previousTime = 0;
var currentTime = 0;
trackedPlayer.on('timeupdate', function() {
    previousTime = currentTime;
    currentTime = trackedPlayer.currentTime();
});
trackedPlayer.on('seeking', function() {
    console.log('seeking from', previousTime, 'to', currentTime, '; delta:', currentTime - previousTime);
});

这似乎适用于 HTML5 技术。我没有和其他技术人员一起测试过。

但是，有一个小故障:第一次寻找一个暂停 的玩家时只产生一个小的增量(两个变量的先前值几乎相同)。但这应该无关紧要，因为增量只有几百毫秒(而且我知道您只对“from”值感兴趣)。

更新

seeked 的触发频率远低于 seeking。请尝试以下操作。

var previousTime = 0;
var currentTime = 0;
var seekStart = null;
trackedPlayer.on('timeupdate', function() {
    previousTime = currentTime;
    currentTime = trackedPlayer.currentTime();
});
trackedPlayer.on('seeking', function() {
    if(seekStart === null) {
        seekStart = previousTime;
    }
});
trackedPlayer.on('seeked', function() {
    console.log('seeked from', seekStart, 'to', currentTime, '; delta:', currentTime - previousTime);
    seekStart = null;
});

还有许多库用于去抖动函数调用(在本例中为对后端的调用)。