dplayer使用_dplayer官方下载

dplayer使用_dplayer官方下载DPlayer 是一个支持弹幕的 html5视频播放器。支持Bilibili视频和danmaku,实时视频(HTTPLiveStreaming,M3U8格式)以及FL

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

DPlayer 是一个支持弹幕的 html5 视频播放器。支持 Bilibili 视频和 danmaku,实时视频(HTTP Live Streaming,M3U8格式)以及 FLV 格式。 

用法

html

<div id="player1" class="dplayer"></div> <!-- ... --> <script src="dist/DPlayer.min.js"></script>

选项

var dp = new DPlayer({ element: document.getElementById('player1'), // 可选,player元素 autoplay: false, // 可选,自动播放视频,不支持移动浏览器 theme: '#FADFA3', // 可选,主题颜色,默认: #b7daff loop: true, // 可选,循环播放音乐,默认:true lang: 'zh', // 可选,语言,`zh'用于中文,`en'用于英语,默认:Navigator language screenshot: true, // 可选,启用截图功能,默认值:false,注意:如果设置为 true,视频和视频截图必须启用跨域 hotkey: true, // 可选,绑定热键,包括左右键和空格,默认值:true preload: 'auto', // 可选,预加载的方式可以是'none''metadata''auto',默认 值:'auto' video: { // 必需,视频信息 url: '若能绽放光芒.mp4', // 必填,视频网址 pic: '若能绽放光芒.png' // 可选,视频截图 }, danmaku: { // 可选,显示弹幕,忽略此选项以隐藏弹幕 id: '9E2E3368B56CDBB4', // 必需,弹幕 id,注意:它必须是唯一的,不能在你的新播放器 中使用这些: `https://api.prprpr.me/dplayer/list` api: 'https://api.prprpr.me/dplayer/', // 必需,弹幕 api token: 'tokendemo', // 可选,api 的弹幕令牌 maximum: 1000, // 可选,最大数量的弹幕 addition: ['https://api.prprpr.me/dplayer/bilibili?aid=4157142'] // 可选的,额外的弹幕,参见:`Bilibili弹幕支持` } });

事件绑定

dp.on(event, handler)事件:

play: DPlayer 开始播放时触发 pause: DPlayer 暂停时触发 canplay: 在有足够的数据可以播放时触发 playing: DPlayer 播放时定期触发 ended: DPlayer 结束时触发 error: 发生错误时触发

HLS支持(实时视频,M3U8格式)

它需要 hls.js 库,并且应该在 DPlayer.min.js 之前加载。实时弹幕尚不支持。

<div id="player1" class="dplayer"></div> <!-- ... --> <script src="plugin/hls.min.js"></script> <script src="dist/DPlayer.min.js"></script> <script> var dp = new DPlayer({ // ... video: { url: 'xxx.m3u8' // ... } }); </script>

FLV支持

它需要 flv.js 库,并且应该在 DPlayer.min.js 之前加载。

<div id="player1" class="dplayer"></div> <!-- ... --> <script src="plugin/flv.min.js"></script> <script src="dist/DPlayer.min.js"></script> <script> var dp = new DPlayer({ // ... video: { url: 'xxx.flv' // ... } }); </script>

使用bundler模块

var DPlayer = require('DPlayer'); var dp = new DPlayer(option);

 

其他类似工具:  DPlayer,  videos.js,  ckplayer,  vue-DPlayer,  vue-video-player

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/167440.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • Robots协议具体解释

    Robots协议具体解释

    2021年12月10日
    56
  • TCP三次握手详解及释放连接过程[通俗易懂]

    TCP三次握手详解及释放连接过程[通俗易懂]TCP在传输之前会进行三次沟通,一般称为“三次握手”,传完数据断开的时候要进行四次沟通,一般称为“四次挥手”。两个序号和三个标志位:  (1)序号:seq序号,占32位,用来标识从TCP源端向目的端发送的字节流,发起方发送数据时对此进行标记。  (2)确认序号:ack序号,占32位,只有ACK标志位为1时,确认序号字段才有效,ack=seq+1。  (3)标志位:共6个,即URG、AC…

    2022年6月13日
    35
  • 权限设计-系统登录用户权限设计[通俗易懂]

    权限设计-系统登录用户权限设计[通俗易懂]需求分析—场景假设需要为公司设计一个人员管理系统,并为各级领导及全体员工分配系统登录账号。有如下几个要求:1. 权限等级不同:公司领导登录后可查看所有员工信息,部门领导登录后只可查看本部门员工的信息,员工登录后只可查看自己的信息;2.访问权限不同:如公司领导登录后,可查看员工薪水分布界面,而员工则不能看到;3.操作权限不同:如系统管理员可以在信息发布界面进行增删改查发布信息

    2022年7月13日
    18
  • tomcat性能调优(tomcat调优参数有哪些)

    总体架构主要的组件执行过程tomcat调优1.禁用ajp协议2.启用nio模式(提升原有的吞吐量36%)3.开启链接池硬件指标,业务指标4.优化连接器

    2022年4月18日
    102
  • 用亚马逊云建代理服务器[通俗易懂]

    用亚马逊云建代理服务器[通俗易懂]作者:Vamei出处:http://www.cnblogs.com/vamei转载请先与我联系。 我们用电脑、平板、手机等访问互联网时,本地设备和服务器之间的通信有可能因为某些不可控因素被切断。这种情况下,我们可以采用“曲线”的方式,让一个第三方的服务器来做接力,从而连接目标服务器。代理服务器可以绕过许多基于IP地址的限制。例如某视频网站只允许日本的IP访问,那么可以借助一台在日本的…

    2022年9月29日
    2
  • ZooKeeper初探之安装和配置

    1.ZooKeeper简介Zookeeper是Hadoop下的一个子项目,它是一个针对大型分布式系统的可靠的协调系统,提供的功能包括配置维护,名字服务,分布式同步,组服务等,Zookeeper是可

    2021年12月28日
    41

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号