插件网/网站建设/用Dplayer在网站中播放m3u8,flv等视频的方法

用Dplayer在网站中播放m3u8,flv等视频的方法

发布时间:2021-01-09    关键词:dplayer 网页在线播放m3u8   阅读数:

网页中需要播放一个m3u8格式的视频怎么办?
其实很简单,我们直接用video标签当然是不行的,我们可以用dplayer来实现这一需求。下面来说说dplayer播放m3u8的方法吧:
首先是html,相关的样式大家可以自己写,我这就不赘言了

<div id="dplayer"></div>
其次是js 首先是引入相关的js文件
<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>
最后在js中设置logo图,封面图,m3u8地址等信息就好了。
<script>
const dp = new DPlayer({
       container: document.getElementById('dplayer'),
       logo: 'logo图片地址',
       video: {
             url: 'm3u8链接地址',
             pic: '封面图片地址',
             type: 'hls'
            },
       });
</script>
实现的效果可以到m3u8在线播放预览 ,更多像FLV在线播放等dplayer用法基本上差不多,可以移步到dplayer官网

相关文章

Wow.js和Animate.css组合让网站动起来

快过年了,给你的网站加幅对联吧!

用Dplayer在网站中播放m3u8,flv等视频的方法

小邱原创入门级WORDPRESS建站教程免费分享

什么是备案?什么样的网站需要备案?ICP备案需要多久?

用帝国CMS搭建个人网站,你还需要学会哪些前端知识