Instructions for using the open source code flv.js

Flv.js

is an HTML5 Flash video (FLV) player, developed purely with native JavaScript, without using Flash. Open sourced by bilibili website.

Overview:

A JavaScript library that implements playing FLV format videos in HTML5 videos. Its working principle is to transcode and multiplex the FLV file stream into ISO BMFF (MP4 fragments) fragments, and then pass them through Media Source Extensions feed MP4 clips into the browser.flv.js is written in ECMAScript 6, then compiled into ECMAScript 5 through Babel Compiler, and packaged using Browserify.

Function:

FLV container with H.264 + AAC codec playback capability
Multi-part segmented video playback
HTTP FLV low-latency real-time streaming playback
FLV real-time streaming via WebSocket
Compatible with Chrome, FireFox, Safari 10, IE11 and Edge
Very low overhead, and hardware accelerated through your browser

The above is the official introduction, the key point is that open source allows us to use it, thank you to the masters of Bilibili We

The following is the integrated usage plan I compiled

1. Deployment plan

1. Prerequisite

First of all, nodejs and npm are used here. How to install and deploy them has been written in my previous article. I won’t go into more details here. You can search for them if you need them.

##2. Download code

github address: https://github.com/Bilibili/flv.js

# #Students who need to synchronize the latest code should use git. Those who don’t have git can also download the zip file

After downloading the code

I put it in D:\code\flv.js-master

3. Build the code

Because the code cannot be used directly, we need to use thenpm module of nodejsBuild

1) First open the cmd command line window (Remember to open it with the right click to manage Runas a member), otherwise an error may occur

##cd Command to the place where the code is placed. I put it onD:\code\flv.js-master

#2) Execute npm build, here is the operation to install the development environment

##

npm install

After waiting for the execution to complete, the following picture will appear

D:\code\flv.js-masterThere will be one more node_modulesfolder

3）安装生成工具

npm install -g gulp

4）包装和最小化JS放在dist文件夹里

gulp release

然后D:\code\flv.js-master\dist里就终于得到我们需要flv.js和flv.min.js代码了

flv.js压缩前代码

flv.min.js压缩后代码

二、整合方案

代码DEMO-html页面

      
  
   
 
 Load Start Pause Destroy  SeekTo 
 
    

结果

Ps：视频要放在服务器上，这里我用的是Java Web项目，tomcat部署，视频找个位置就可以了，主要是记住位置

相关文章：

如何看待B站 (bilibili) 开源 HTML5 播放器内核 flv.js?

全面解读flv.js代码

The above is the detailed content of Instructions for using the open source code flv.js. For more information, please follow other related articles on the PHP Chinese website!