HTML5 视频播放器阻止搜索

Question

我正在创建一系列视频教程，并希望防止用户向前查找和跳过部分。我将使用将用于桌面和 iPad 浏览器的 HTML5 视频播放器。理想情况下，我希望它也能在 iPhone 上运行，但我意识到你无法控制手机上的视频，因为它使用 iPhone 视频播放器。

如何防止用户在 HTML5 视频播放器上向前搜索？

Answer 1

谢谢你的回答，瑞克。

我注意到用户可以拖动并按住搜索器，这允许他们继续，因此我将不搜索的位置添加到 getPos 函数。HTML 5 和 jQuery。

var video = document.getElementsByTagName('video')[0];

function allowMove() {
  $('input[id$="btnNext"]').removeAttr('disabled');
  $('input[id$="videoFlag"]').val("1");
}

function getpos() {
  if (!(video.seeking)) {
    curpos = video.currentTime;
  }
  console.log(curpos)
}
onesecond = setInterval('getpos()', 1000);

function setPos() {
  var ct = video.currentTime;
  if (ct > curpos) {
    video.currentTime = curpos;
  }
}

Answer 2

如果您真的想做这种对用户不利的事情，那么您可以使用 控制属性。您必须使用 JS 来实现您希望允许的任何控件。

当然，用户始终可以查看> source 获取视频的 URI 并下载它。

Answer 3

为什么不这样呢？

var video = document.getElementById("myVideo");
var counter = 0;

video.on('timeupdate', function() {
  if (video[0].paused == false) {
    counter = video[0].currentTime;
  }
}

video.on('seeking', function(e) {
  if ( parseInt(counter, 10) != parseInt(video[0].currentTime, 10) ) {
    video[0].currentTime = counter;
  }
});

Answer 4

我同意 @Bart Kiers 的观​​点，这不是一个好主意，但如果你必须这样做，我可以想到一种方法：隐藏控件并提供你自己的播放按钮，使用 JavaScript 启动视频。

Answer 5

Video.js 的另一个示例：

videojs('example_video_1').ready(function(){
  var player = this;
  var previousTime = 0;
  var currentTime = 0;
  var seekStart = null;

  player.on('timeupdate', function(){
    previousTime = currentTime;
    currentTime = player.currentTime();
  });

  player.on('seeking', function(){
    if(seekStart === null) {
      seekStart = previousTime;
    }
  });

  player.on('seeked', function() {
    if(currentTime > seekStart) {
      player.currentTime(seekStart);
    }
    seekStart = null;
  });
});

Answer 6

我只是想阻止向前寻找。我的系统中有更多代码，允许他们暂停并稍后返回。它记录当前位置并设置加载时的视频位置。

我正在使用 video.js。我尝试使用 timechange 事件，但它在查找之前触发。所以，我采取了利用间隔来每秒抓取当前位置。如果查找位置大于当前位置，则将其设置回来。效果很好。

var player = null;
var curpos = 0;
videojs('player').ready(function(){
  player = this;
});

player.on('seeking', function () {
  var ct = player.currentTime();
if(ct > curpos) {
  player.currentTime(curpos);
}
});

function getpos() {
  curpos = player.currentTime();
}
onesecond = setInterval(getpos, 1000);