1.flv.js介绍
flv.js 是由 bilibili 网站开源的 HTML5 Flash 视频(FLV)播放器,纯原生 JavaScript 开发(ECMAScript 6 编写) ,摒弃了flash。
工作原理是 flv.js 在 JavaScript 中流式解析 flv 文件流,并实时转封装为 fmp4 ,通过 Media Source Extensions 交给浏览器,实现 FLV 格式视频的播放。
2.拉流地址获取
2.1 通过设备端的ZLMediaKit拉流
根据之前的文章,实现了安卓设备端启动ZLMediaKit的服务,并通过设备启动推流生成了相应的播流地址
例如我们的RTMP推流地址是:rtmp://10.0.0.53:1935/live/1234
http-flv 播流地址:http://10.0.0.53:8098/live/1234.flv
2.2 Nginx转发地址播流
ffmpeg推流:
ffmpeg -re -i rtmp://10.0.0.53:1935/live/1234 -c copy -f flv rtmp://127.0.0.1:1935/live/url
基于六中提到的nginx配置,由此方式生成的flv播流地址为:
3.web端拉流
3.1 下载flv.min.js

3.2 新建flv.html,将flv.min.js和flv.html 放在同一文件夹,将2.1或者2.2中的flv拉流地址复制到url中:
设备端启动Media Server,设备启动推流,打开flv.html(或者此时启动nginx,利用ffmpeg推流转发方式)

ZLMediaKit学习系列(七)-使用flv.js实现Web端拉流插图