苹果CMS设置Dplayer播放器自动播放下一集

在苹果cms的配置中,默认的播放器不会自动播放,也不会自动播放下一集视频,需要手工修改Dplayer的代码。目前Dplayer播放器在网络上比较流行,且性能与功能方面比较出众,下面看一看如何配置Dplayer播放器。

Dplayer播放器是谁?

是一款可爱的 HTML5 弹幕视频播放器,可帮助人们轻松构建视频和弹幕。

DPlayer网站地址:https://dplayer.js.org/

Github项目地址:https://github.com/DIYgod/DPlayer

整合dplayer播放器增加记忆,P2P播放和自动下一集的Dplayer播放器代码

替换下面的dplayer播放器代码,替换目录苹果cms系统static/player/.html 全部内容替换即可。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
    <title>dplayer播放器p2p加速+记忆播放</title>
    <meta http-equiv="content-type" content="text/html;charset=UTF-8">
    <meta http-equiv="content-language" content="zh-CN">
    <meta http-equiv="X-UA-Compatible" content="chrome=1">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta name="referrer" content="never">
    <meta name="renderer" content="webkit">
    <meta name="msapplication-tap-highlight" content="no">
    <meta name="HandheldFriendly" content="true">
    <meta name="x5-page-mode" content="app">
    <meta name="Viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/dplayer@latest/dist/DPlayer.min.css">
    <style type="text/css">
        body,html{width:100%;height:100%;background:#000;padding:0;margin:0;overflow-x:hidden;overflow-y:hidden}
        *{margin:0;border:0;padding:0;text-decoration:none}
        #stats{position:fixed;top:5px;left:8px;font-size:12px;color:#fdfdfd;text-shadow:1px 1px 1px #000, 1px 1px 1px #000}
        #dplayer{position:inherit}
    </style>


<div id="dplayer"></div>
<div id="stats"></div>
<script language="Javascript">
    document.oncontextmenu=new Function("event.returnValue=false");
    document.onselectstart=new Function("event.returnValue=false");
</script>
<script src="https://cdn.jsdelivr.net/npm/cdnbye@latest"></script>
<script src="https://cdn.jsdelivr.net/npm/dplayer@latest"></script>
<script>
    var webdata = {
        set:function(key,val){
            window.sessionStorage.setItem(key,val);
        },
        get:function(key){
            return window.sessionStorage.getItem(key);
        },
        del:function(key){
            window.sessionStorage.removeItem(key);
        },
        clear:function(key){
            window.sessionStorage.clear();
        }
    };
    var _peerId = '', _peerNum = 0, _totalP2PDownloaded = 0, _totalP2PUploaded = 0;
    var dp = new DPlayer({
        autoplay: true,
        container: document.getElementById('dplayer'),
        volume: 1.0,
        preload: 'auto',
        screenshot: true,
        theme: '#28FF28',
        video: {
            url: parent.MacPlayer.PlayUrl,
            type: 'customHls',
            // pic: './loading.jpg',           // 视频封面
            customType: {
                'customHls': function (video, player) {
                    const hls = new Hls({
                        debug: false,
                        // Other hlsjsConfig options provided by hls.js
                        p2pConfig: {
                            logLevel: false,
                            live: false,        // 如果是直播设为true
                            // Other p2pConfig options provided by CDNBye
                            getStats: function (totalP2PDownloaded, totalP2PUploaded, totalHTTPDownloaded) {
                                console.warn(`totalP2PDownloaded ${totalP2PDownloaded} totalHTTPDownloaded ${totalHTTPDownloaded}`);
                                _totalP2PDownloaded = totalP2PDownloaded;
                                _totalP2PUploaded = totalP2PUploaded;
                                updateStats();
                            },
                            getPeerId: function (peerId) {
                                _peerId = peerId;
                            },
                            getPeersInfo: function (peers) {
                                _peerNum = peers.length;
                                updateStats();
                            },
                        }
                    });
                    hls.loadSource(video.src);
                    hls.attachMedia(video);
                }
            }
        },
    });
    dp.seek(webdata.get('pay'+parent.MacPlayer.PlayUrl));
    setInterval(function(){
        webdata.set('pay'+parent.MacPlayer.PlayUrl,dp.video.currentTime);
    },1000);
    dp.on('ended', function (){
        if(parent.MacPlayer.PlayLinkNext!=''){
            top.location.href = parent.MacPlayer.PlayLinkNext;
        }
    });
    function updateStats() {
        var text = 'P2P已开启 共享' + (_totalP2PUploaded/1024).toFixed(2) + 'MB' + ' 已加速' + (_totalP2PDownloaded/1024).toFixed(2)
            + 'MB' + ' 此片有 ' + _peerNum + ' 位影迷正在观看';
        document.getElementById('stats').innerText = text
    }
</script>

另外一种代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
<title>dplayer播放器p2p加速+记忆播放</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="expires" content="0">
<meta name="referrer" content="never">
<meta name="renderer" content="webkit">
<meta name="msapplication-tap-highlight" content="no">
<meta name="HandheldFriendly" content="true">
<meta name="x5-page-mode" content="app">
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" id="viewport" name="viewport">
<link rel="stylesheet" href="./dplayer/DPlayer.min.css">
<style type="text/css">
body,html{width:100%;height:100%;background:#000;padding:0;margin:0;overflow-x:hidden;overflow-y:hidden}
*{margin:0;border:0;padding:0;text-decoration:none}
#stats{position:fixed;top:5px;left:10px;font-size:10px;color:#fdfdfd;z-index:20719029;text-shadow:1px 1px 1px #000, 1px 1px 1px #000}
#dplayer{position:inherit}
</style>


<div id="dplayer"></div>
<div id="stats"></div>
<script language="Javascript">
document.oncontextmenu=new Function("event.returnValue=false");
document.onselectstart=new Function("event.returnValue=false");
</script>
<script src="./dplayer/hls.min.js"></script>
<script src="./dplayer/dash.all.min.js"></script>
<script src="./dplayer/webtorrent.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/cdnbye@latest"></script>
<script src="./dplayer/DPlayer.min.js"></script>
<script>
//var url = '<?php echo($_REQUEST['url']);?>';
var url = parent.MacPlayer.PlayUrl;
var isWap = navigator.userAgent.match(/iPad|iPhone|iPod|Baidu/i) != null; //百度浏览器和苹果移动端不使用P2P功能
if(!isWap){
if(url.indexOf(".m3u8") > 0){
var _peerId = '', _peerNum = 0, _totalP2PDownloaded = 0, _totalP2PUploaded = 0;
var type = 'customHls';
}
else {
var type = 'normal'; //MP4格式P2P兼容性不好,不调用P2P。
}
var dp = new DPlayer({
container: document.getElementById('dplayer'),
autoplay: true,//自动播放
//screenshot: true,//截屏
hotkey: true, // 移动端全屏时向右划动快进,向左划动快退。
logo: '',//LOGO
volume: 1.0,//音量
preload: 'auto',//视频预先加载
theme: '#28FF28',//进度条颜色
lang:'zh-cn',//播放器语言
airplay:'true',
video: {
url:parent.MacPlayer.PlayUrl,
pic: '', //图片地址。
//thumbnails: './thumbnails.jpg',
type: 'customHls',
customType: {
'customHls': function (video, player) {
const hls = new Hls({
debug: false,
p2pConfig: {
logLevel: true,
live: false, // 如果是直播设为true
}
});
hls.loadSource(video.src);
hls.attachMedia(video);
hls.p2pEngine.on('stats', function (stats) {
_totalP2PDownloaded = stats.totalP2PDownloaded;
_totalP2PUploaded = stats.totalP2PUploaded;
updateStats();
}).on('peerId', function (peerId) {
_peerId = peerId;
}).on('peers', function (peers) {
_peerNum = peers.length;
updateStats();
});

}
}
},
danmaku: {
id: btoa(parent.MacPlayer.PlayUrl), //弹幕代码,可定义其他的ID,请修改;
api: 'https://dplayer.moerats.com/',
bottom: '25%',
unlimited: false,
},
//contextmenu: [
//{
//text: 'YEYEXIU',
//link: 'https://yeyexiu.com',
//},
//],
highlight: [
{
text: '',
time: 0,
},
]
});
var webdata = {
set:function(key,val){
window.sessionStorage.setItem(key,val);
},
get:function(key){
return window.sessionStorage.getItem(key);
},
del:function(key){
window.sessionStorage.removeItem(key);
},
clear:function(key){
window.sessionStorage.clear();
}
};
dp.seek(webdata.get('pay'+parent.MacPlayer.PlayUrl));
setInterval(function(){
webdata.set('pay'+parent.MacPlayer.PlayUrl,dp.video.currentTime);
},1000);

dp.on('playing',function () {
//间隔两秒则自动隐藏
setTimeout(function(){
 //为播放器添加隐藏工具条样式
document.getElementById("dplayer").classList.add("dplayer-hide-controller");
 }, 10000);
});
dp.on('ended',function() {
if(parent.MacPlayer.PlayLinkNext!=''){
top.location.href = parent.MacPlayer.PlayLinkNext;
}
});
}
else{
document.getElementById('dplayer').innerHTML='<video src="'+parent.MacPlayer.PlayUrl+'" controls="controls" preload="preload" poster="" width="100%" height="100%" autoplay="autoplay"></video>';
}
function updateStats() {
var text = 'P2P正在为您加速' + (_totalP2PDownloaded/1024).toFixed(2)
+ 'MB 已分享' + (_totalP2PUploaded/1024).toFixed(2) + 'MB' + ' 连接节点' + _peerNum + '个';
//document.getElementById('stats').innerText = text ;
}
</script>
订阅
提醒
guest
0 评论
内联反馈
查看所有评论