本次演示是在Linux上进行
首先安装 dplayer
1.CentOS安装Yarn
wget https://dl.yarnpkg.com/rpm/yarn.repo -O /etc/yum.repos.d/yarn.repo
curl --silent --location https://rpm.nodesource.com/setup_6.x | bash -
yum install yarn2.安装dplayer
yarn add dplayer3.创建html文件并添加dplayer(如下所示)
注：在jsdeliver中可以找到Dplayer, DPlayer.main.js
`链接 https://www.jsdelivr.com/package/npm/dplayer?path=dist
`
<!DOCTYPE HTML>
<html>
<head>
<title>VideoPlay</title>
</head>
<body>
<div id="dplayer" class="dplayer" ></div>
<script src="https://cdn.jsdelivr.net/npm/dplayer@1.26.0/dist/DPlayer.min.js"></script>
<style>
#dplayer {
max-width: 960px;
height: 620px;
margin: 0 auto;
}
</style>
<script>
const dp = new DPlayer({
container: document.getElementById('dplayer'),
screenshot: true,
video: {
quality: [
{
name: 'HD',
url: '123.mp4',
type: 'normal'
},
{
name: 'SD',
url: '123.mp4',
type: 'normal',
},
],
defaultQuality: 0,
// pic: 'demo.png',
// thumbnails: 'thumbnails.jpg',
},
});
</script>
</body>
</html>