介绍
小编给大家分享一下开源代码Flv.js怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获、下面让我们一起去了解一下吧!
<强> Flv。js
是HTML5闪光视频(FLV)播放器,纯原生JavaScript开发,没有用到Flash。由bilibili网站开源。
概览:
,
一个实现了在HTML5视频中播放FLV格式视频的JavaScript库。它的工作原理是将FLV文件流转码复用成ISO BMFF (MP4碎片)片段,然后通过媒体
源的扩展将MP4片段喂进浏览器。
,
flv。js是使用ECMAScript 6编写的,然后通过巴别塔编译器编译成ECMAScript 5,使用Browserify打包。
功能:
<李> ,,,,,
FLV容器,具有h + AAC编解码器播放功能
<李> ,,,,,
多部分分段视频播放
<李> ,,,,,
HTTP FLV低延迟实时流播放
<李> ,,,,,
FLV通过WebSocket实时流播放
<李> ,,,,,
兼容Chrome, FireFox, Safari, IE11和边缘
<李> ,,,,,
十分低开销,并且通过你的浏览器进行硬件加速
以上是官方的介绍,重点是开源让我们用了,谢谢B站的大神们
以下是我整理的集成使用方案
<强>一、部署方案
<强> 1,前提
首先这里要使用到nodejs和npm,如何安装和部署在我之前的文章有写过了,这里不再多说,需要可以看自行搜索。
<强> 2,下载代码
github地址:https://github.com/Bilibili/flv.js
需要同步最新代码的同学要使用git,没有git的也可以下载压缩文件
2)执行npm构建,这里是进行安装开发环境的操作
npm 安装 ,
等待执行完后,会出现下图
3)安装生成工具
npm install -g 吞咽 
4)包装和最小化js放在dist文件夹里
gulp 发布 
<强>二、整合方案
代码DEMO-html页面
& lt; ! DOCTYPE html>
& lt; html>
& lt; head>
,,,& lt; meta 内容=皌ext/html;, charset=utf-8", http-equiv=癈ontent-Type"比;
,,,& lt; title> flv.js demo
,,,& lt; style>
,,,,,,,.mainContainer {
,,,,,,,,,,,显示:,块;
,,,,,,,,,,,宽度:,1024 px;
,,,,,,,,,,,margin-left:,汽车;
,,,,,,,,,,,margin-right:,汽车;
,,,,,,,}
,,,,,,,.urlInput {
,,,,,,,,,,,显示:,块;
,,,,,,,,,,,宽度:,100%;
,,,,,,,,,,,margin-left:,汽车;
,,,,,,,,,,,margin-right:,汽车;
,,,,,,,,,,,margin-top:, 8 px;
,,,,,,,,,,,margin-bottom:, 8 px;
,,,,,,,}
,,,,,,,.centeredVideo {
,,,,,,,,,,,显示:,块;
,,,,,,,,,,,宽度:,100%;
,,,,,,,,,,,身高:,576 px;
,,,,,,,,,,,margin-left:,汽车;
,,,,,,,,,,,margin-right:,汽车;
,,,,,,,,,,,margin-bottom:,汽车;
,,,,,,,}
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
