老师,我做了一个解决回退视频,和快进一段视频,弹幕也跟着播放的方案。请老师看一下这样做好不好?
腾讯云视频有个监听当前播放时间改变的事件,
player.on('timeupdate', changeVideoDurationTime);
var currentVideoTime = 0;//记录当前视频的播放时间点
//当视频当前播放时间更改时,记录当前时间
function changeVideoDurationTime() {
//判断当前是否在播放中
//如果处于不在播放中,就不用判断了
if (isPlay) {
//记录的时间>当前时间.或。 当前时间>记录时间超过3秒
//也就是意味着人们刻意拨动了视频的进度
if (currentVideoTime > player.currentTime() || (player.currentTime() - currentVideoTime) > 3) {
//循环遍历判断记录的时间点,大于哪一条弹幕时间点,最后取出符合当前时间的最大弹幕索引值
var indexa = 0;
for (var i = 0; i < barrageList.length; i++) {
if (player.currentTime() > barrageList[i].time) {
//记录一下最符合的弹幕索引
indexa = i;
}
}
//把最符合的弹幕索引值赋值给,之前的 setInterval 函数中, 当时间 > barrageList[videoBarrageIndex] 的 videoBarrageIndex
//它会再次以这个最符合的弹幕索引值开始向后遍历比较
videoBarrageIndex = indexa;
// layer.msg(videoBarrageIndex);
}
//更新视频记录时间点
currentVideoTime = player.currentTime();
}
}
另外,视频播放完,或者播放完最后一个弹幕,是不是最好不给clearnInterval,因为用户可能还会往回调进度,所以就不让这个interval清空了。为了节省性能,给这个判断,也添加一个只有在视频播放时才会去调用的条件。
//线程遍历播放该视频的所有弹幕
function playALLVideoBarrage() {
// 如果index大于全部弹幕的数量,就直接返回,也不用做后面的判断了
if (videoBarrageIndex + 1 > barrageList.length) {
return;
}
//当视频当前时间点 大于 弹幕集合中的指定的时间点,就让它显示弹幕到屏幕
if (isPlay) {
if (player.currentTime() > (barrageList[videoBarrageIndex].time)) {
layer.msg("播放索引为:" + (videoBarrageIndex) + "的弹幕");
//取出指定弹幕的内容,显示到屏幕上
createAndShowOneBarrage(barrageList[videoBarrageIndex].content);
//索引值自增
videoBarrageIndex++;
}
}
}
window.onload = function (event) {
barrageList = [[${barrageList}]];
barrageInterval = setInterval(playALLVideoBarrage, 300);//这个方法是线程处理的
}