每日归档： 2019年12月25日

Flv.js: B站开源的HTML5播放器

仓库地址: https://github.com/bilibili/flv.js

image-2979

 

简介

用纯JavaScript编写的HTML5 Flash Video（FLV）播放器，不带Flash。 万岁！

该项目依靠媒体源扩展来工作。

flv.js的工作原理是将FLV文件流转换为ISO BMFF（片段MP4）段，然后通过Media Source Extensions API将mp4段馈送到HTML5 <video>元素中。

flv.js用ECMAScript 6编写，由Babel Compiler编译为ECMAScript 5，并与Browserify捆绑在一起。

示例

示例地址: http://bilibili.github.io/flv.js/demo/

起步

<script src="flv.min.js"></script>
<video id="videoElement"></video>
<script>
    if (flvjs.isSupported()) {
        var videoElement = document.getElementById('videoElement');
        var flvPlayer = flvjs.createPlayer({
            type: 'flv',
            url: 'http://example.com/flv/video.flv'
        });
        flvPlayer.attachMediaElement(videoElement);
        flvPlayer.load();
        flvPlayer.play();
    }
</script>