DPlayer 是一個(gè)開(kāi)源的 HTML5 彈幕視頻播放器，支持現(xiàn)代瀏覽器（Chrome，F(xiàn)irefox，Safari，Edge）和移動(dòng)設(shè)備。dplayer 在頁(yè)面中嵌入視頻播放器后，可以方便地為視頻添加彈幕功能，提高用戶(hù)的觀看體驗(yàn)。而使用 PHP 語(yǔ)言來(lái)實(shí)現(xiàn) dplayer 的彈幕功能，也是非常常見(jiàn)的。
在 PHP 中使用 dplayer 彈幕，可以通過(guò)調(diào)用 dplayer 的 JS 文件和 CSS 文件來(lái)實(shí)現(xiàn)。在前端頁(yè)面中，需要加入這些文件的引用，以及一個(gè) video 標(biāo)簽和一個(gè) div 標(biāo)簽來(lái)顯示彈幕。
舉個(gè)例子，下面是一個(gè)簡(jiǎn)單的 HTML 頁(yè)面，其中展示了一個(gè)視頻，同時(shí)也有彈幕的效果:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>dplayer彈幕 PHP</title>
<link rel="stylesheet" >
</head>
<body>
<video id="video" controls="controls" preload="none">
<source src="video.mp4" type="video/mp4">
</video>
<div id="dplayer"></div>
<script src="https://unpkg.com/jquery/dist/jquery.min.js"></script>
<script src="https://unpkg.com/dplayer/dist/DPlayer.min.js"></script>
<script>
var dp = new DPlayer({
container: document.getElementById('dplayer'),
video: {
url: 'video.mp4',
type: 'auto',
pic: 'poster.jpg',
thumbnails: 'thumbnails.jpg'
},
danmaku: {
id: 'video',
api: 'danmaku.php',
user: 'DPlayer',
bottom: '15%',
unlimited: true
}
});
</script>
</body>
</html>上面的代碼中，我們引入了 dplayer 和 jquery 的 JS 文件和 CSS 文件，并在 container 中添加了一個(gè) id 為 dplayer 的 div 標(biāo)簽，用于顯示彈幕。在 js 代碼中，我們選擇了 video 標(biāo)簽，同時(shí)指定了 video 的屬性值，如 url、type 這些，之后又在 danmaku 中指定了 api 的值為 danmaku.php，這個(gè)文件是用來(lái)接收和輸出彈幕的。我們可以通過(guò)這個(gè)文件來(lái)獲取、存儲(chǔ)和輸出彈幕。PHP 代碼方面，需要實(shí)現(xiàn)一些功能來(lái)實(shí)現(xiàn)彈幕的效果。首先是獲取彈幕、存儲(chǔ)彈幕，并將彈幕輸出到前端頁(yè)面的功能。下面是一個(gè)簡(jiǎn)單的 danmaku.php 文件：
<?php
header('Content-Type: text/xml;');
$xml = '';
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$data = ['stime'=>$_POST['stime'], 'text'=>htmlspecialchars($_POST['text']), 'color'=>$_POST['color']];
$xml = new DOMDocument();
$xml->formatOutput = true;
$droot = $xml->createElement('i');
$droot->setAttribute("p", $data['stime'].','.$data['color'].',2');
$droot->appendChild($xml->createTextNode($data['text']));
$xml->appendChild($droot);
$xml->save('danmaku.xml');
} else if ($_SERVER['REQUEST_METHOD'] == 'GET'){
$xml = file_get_contents('danmaku.xml');
}
echo $xml;
?>上面的代碼中，我們先設(shè)置了返回類(lèi)型為 text/xml，之后我們判斷請(qǐng)求方式是 GET 還是 POST。如果是 POST 方式，那么就將彈幕的時(shí)間段、顏色和文本內(nèi)容拼接成一個(gè)字符串，存儲(chǔ)到以 danmaku.xml 命名的 xml 文件中。如果請(qǐng)求方式是 GET，那么讀取 xml 文件內(nèi)容，并將其返回到前端。總之，PHP 創(chuàng)建 dplayer 彈幕遵循以下一般步驟：
- 前端頁(yè)面中引入 dplayer 的 js 和 css 文件
- 在 video 中指定 video 的基本屬性，同時(shí)在 danmaku 中指定 danmaku 的基本屬性
- 創(chuàng)建 danmaku.php 文件，其中包含獲取、存儲(chǔ)彈幕和輸出彈幕到前端的功能
綜而言之，dplayer 彈幕的實(shí)現(xiàn)需要和前后端都有所涉及。其中前端需要引入 dplayer 的相關(guān)文件，后端需要?jiǎng)?chuàng)建 danmaku.php 文件將接收到的彈幕數(shù)據(jù)存儲(chǔ)，并輸出到前端。如果各項(xiàng)功能均實(shí)現(xiàn)，那么 dplayer 彈幕效果將在瀏覽器中展現(xiàn)。