<!-- 引入 DPlayer -->标签:function,const,m3u8,hls,video,播放,Dplayer From: https://www.cnblogs.com/liaoweiyang/p/18208522
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/dplayer/dist/DPlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/hls.js/dist/hls.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/dplayer/dist/DPlayer.min.js"></script>
<!-- 视频容器 -->
<div id="dplayer"></div>
<script>
const dp = new DPlayer({
container: document.getElementById('dplayer'),
video: {
pic: 'http://1.jpg',
url: 'https://1.m3u8',
type: 'customHls', // 自定义播放器类型
customType: {
customHls: function (video, player) {
const hls = new Hls();
hls.loadSource(video.src);
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED, function () {
video.play();
});
}
}
}
});
</script>