ckplayer有个记忆播放功能,记录上次播放时间,可以序点播放:http://www.ckplayer.com/sampleX/cookie.html
ckplayer 用的人挺多的flash 和 html5 video 相结合 ,是个很实用的网页播放器,不过至从google发布将摒弃 FLASH 后,html5 video播放器肯定就是个趋势了。
html5 video 播放器网络上也有很多,目前大部分站长用的一般也就是 Dplayer 了,今天正好在做一个Dplayer 的一个记录上次播放时间,序点播放 的功能,就顺便在此记录下了。
参考的ckplayer ,其他播放器想来也是一样的
代码如下
var cookie = {
set: function(name, value) {
var Days = 1;
var exp = new Date();
exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000);
document.cookie = name + '=' + escape(value) + ';expires=' + exp.toGMTString();
},
get: function(name) {
var arr, reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)');
if(arr = document.cookie.match(reg)) {
return unescape(arr[2]);
} else {
return null;
}
},
del: function(name) {
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval = getCookie(name);
if(cval != null) {
document.cookie = name + '=' + cval + ';expires=' + exp.toGMTString();
}
}
};
var videoID = '地址1';//设置一个视频的id (唯一,可以设置为页面地址,可用md5)
var cookieTime = cookie.get('time_' + videoID);
if(!cookieTime || cookieTime == undefined) {
cookieTime = 0;
}
var dp = new DPlayer({
//..........dplayer 相关设置,此处就省略啦
});
if(cookieTime > 0) { //如果记录时间大于0,则设置视频播放后跳转至上次记录时间
dp.seek(cookieTime);
}
dp.on('timeupdate', function () {
cookie.set('time_' + videoID, dp.video.currentTime);
});
5 条评论
收藏了
dplayer 监听事件后,怎么摧毁监听事件,官方文档好像没有提及api
https://artplayer.org/
Artplayer考虑下?哈哈
Artplayer也踩了好几个坑,vue3 中使用 ref 作为实例化名,会导致 proxy 对象只读,使用shallowRef可以解决,然后再使用switch方法的时候,进度条不会会滚到0,很离谱,官方示例没问题
https://playerjs.com/
http://clappr.io/
https://www.openplayerjs.com/
https://plyr.io/
http://www.mediaelementjs.com/
都是我以前收藏的...选个中意的?