video.js - 在播放期间查找搜索的开始时间 [英] video.js - find the start time of a seek during playback

问题描述

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

我希望能够记录开始和在平台中任何搜索的结束时间，因此我们知道用户是否实际上没有观看视频的一部分。玩家似乎提供支持此事件的事件，但我很难从中获得正确的时间。

当用户浏览视频时，播放器会发出以下事件：顺序：暂停，寻找，寻找，玩。

如果我使用currentTime（）在任何这些事件中查询玩家对象，结果总是寻找的结束时间，即使是在最初的暂停事件中。这意味着我可以记录搜索结束的位置，但不能记录它的开始位置。

任何人都可以帮助我找到搜索开始的视频中的位置吗？

如果无法做到这一点，我会决定在播放期间禁用搜索。

编辑：添加代码为请求。这很简单：

  var trackedPlayer = videojs（'pvp-player'）; 
 
 trackedPlayer.on（play，function（e）{
 console.log（Video playback started：+ trackedPlayer.currentTime（））; 
}）; 
 
 trackedPlayer.on（暂停，函数（e）{
 console.log（视频播放已暂停：+ trackedPlayer.currentTime（））; 
}）; 
 
 trackedPlayer.on（求，函数（e）{
 console.log（视频搜索：+ trackedPlayer.currentTime（））; 
}）; 
 
 
 trackedPlayer.on（seeked，function（e）{
 console.log（视频搜索结束：+ trackedPlayer.currentTime（））; 
}）; 
 
 trackedPlayer.on（已结束，功能（e）{
 console.log（视频播放结束。）; 
}）; 
  

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

解决方案

您可以收听 timeupdate 并接下来您在寻找之前获得的最后价值被称为您的来源：

  var previousTime = 0; 
 var currentTime = 0; 
 trackedPlayer.on（'timeupdate'，function（）{
 previousTime = currentTime; 
 currentTime = trackedPlayer.currentTime（）; 
}）; 
 trackedPlayer.on（'seek'，function（）{
 console.log（'seek from'，previousTime，'to'，currentTime，'; delta：'，currentTime  -  previousTime）; 
}）; 
  

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

然而，有一个小故障：第一次寻找暂停的播放器只产生一个小的增量（和之前几乎相同的值）两个变量）。但这应该不重要，因为delta只有几百毫秒（而且我认为你只对从值感兴趣）。

更新

搜索的触发频率远低于寻求。请尝试以下操作。

  var previousTime = 0; 
 var currentTime = 0; 
 var seekStart = null; 
 trackedPlayer.on（'timeupdate'，function（）{
 previousTime = currentTime; 
 currentTime = trackedPlayer.currentTime（）; 
}）; 
 trackedPlayer.on（'seek'，function（）{
 if（seekStart === null）{
 seekStart = previousTime; 
} 
}）; 
 trackedPlayer.on（'seeked'，function（）{
 console.log（'seeked from'，seekStart，'to'，currentTime，'; delta：'，currentTime  -  previousTime）; 
 seekStart = null; 
}）; 
  

还有许多用于去除函数调用的库（在本例中是对后端的调用）。 / p>

I am using video.js (http://www.videojs.com/) to build a video approval system and need to log user actions in the player. I can do this easily enough with play, pause, end etc. but have hit a problem when trying to log seeks.

I want to be able to log the start and end times of any seeks within the plaback, so we know if the user has not actually watched a section of the video. The player seems to offer events to support this, but I am struggling to get correct timings from it.

When the user skips through a video the player emits the following events in order: pause, seeking, seeked, play.

If I query the player object at any of these events using currentTime() the result is always the end time for the seek, even on the initial pause event. This means I can log where the seek ended but not where it started.

Can anyone help me to find the position in the video where the seek begins?

If this is not possible, I'd settle for a way to disable seeking during playback.

EDIT: adding code as requested. It's pretty simple:

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.");
});

If I can get all the tracking I want I will replace console.log with ajax calls to store the data.

解决方案

You can listen to timeupdate und take the next to last value you got there before seeking is called as your source:

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);
});

This seems to work with the HTML5 tech. I have not tested with other techs.

There is, however, one glitch: the first time seeking a paused player yields only a small delta (and the almost-same previous value for both variables). But this shouldn’t matter much since the delta is only a few hundred milliseconds (and I gather you’re only interested in the "from" value).

Update

seeked is triggered far more infrequently than seeking. Try the following.

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;
});

There are also many libraries for debouncing function calls (in this case the call to your backend).

这篇关于video.js - 在播放期间查找搜索的开始时间的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！