高性能HTML5弹幕播放器 Moe2_player

码农软件 · 软件分类 · HTML5开发相关 · 2019-03-07 10:14:19

软件介绍

Moe2_player是一款高性能HTML5弹幕播放器

特点:

  • 完全基于html5,移动设备友好,(iphone需要添加到桌面作为webapp方可观看弹幕)

  • 性能强大,在多倍于B站最大弹幕覆盖量的情况下,仍然可以达到60fps,如果使用webgl渲染器性能更强

  • 3D视角弹幕

  • VR虚拟影院

  • 非常简单的集成步骤

  • 已实现了B站和A站的基本弹幕格式的解析

  • 内部实现了弹幕发送和更新的相关方法(基于socket.io,不过暂时没有开放就没有完全集成)

Demo:

使用入门:

  • 引用dist目录下的script,style,images,fonts文件夹至工程目录

  • 在网页用引用js以及css

<link rel="stylesheet" href="style/player.css">
<script src="script/player.min.js"></script>
  • 建一个容器来存放播放器,容器本身的大小和响应式行为会影响播放器的大小

<div id='player-container'></div>
  • 初始化播放器,

<script>
var player=new Moe2.Player(document.querySelector('#player-container'),'可选的视频标题');
player.initVideo('视频的路径.mp4');
player.loadDanmaku('弹幕文件路径.xml','bilibili');
</script>

手动编译

npm install
npm run build

接口文档

  • 待完善

iPhone用户请注意

  • 由于苹果的限制,只要在Safari中播放视频,必然会导致一个全屏的系统视频播放器覆盖掉整个页面,所以弹幕和VR都需要在webapp模式下观看。

  • 在页面头部添加

    <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" >

然后用户就可以在safari或者安卓的chrome的菜单中选择添加到主屏幕了,添加之后主屏幕会有一个网站的图标(可以自定义),然后通过webapp的图标进入访问网站可以实现inline视频播放以及网页全屏。

本文地址:https://codercto.com/soft/d/810.html

反欺骗的艺术

反欺骗的艺术

(美) 米特尼克(Mitnick, K. D.) / 潘爱民 / 清华大学出版社 / 2014-7-1 / 49.80元

凯文•米特尼克(Kevin D. Mitnick)曾经是历史上最令FBI头痛的计算机顽徒之一,现在他已经完成了大量的文章、图书、影片和记录文件。自从2000年从联邦监狱中获释以来,米特尼克改变了他的生活方式,成了全球广受欢迎的计算机安全专家之一。在他的首部将功补过的作品中,这位全世界最著名的黑客为“放下屠刀,立地成佛”这句佛语赋予了新的含义。 在《反欺骗的艺术——世界传奇黑客的经历分享》中,......一起来看看 《反欺骗的艺术》 这本书的介绍吧!

随机密码生成器
随机密码生成器

多种字符组合密码

URL 编码/解码
URL 编码/解码

URL 编码/解码

MD5 加密
MD5 加密

MD5 加密工具