共计 1242 个字符,预计需要花费 4 分钟才能阅读完成。
最近在对接海信的监控摄像头,对方返回的监控视频流格局是 flv 格局,我应用的是 flv.js 来实现监控播放
一:flv.js
github 地址:https://github.com/Bilibili/f…
flv.js 下载地址:
链接:https://pan.baidu.com/s/15yZ1…
提取码:w4f3
二:flv.js 罕用办法
1:flvjs.isSupported():判断以后浏览器是否反对播放
2:flvPlayer = flvjs.createPlayer(mediaDataSource: MediaDataSource, config?: Config):创立一个播放实例
3:flvPlayer.attachMediaElement(mediaElement: HTMLMediaElement):将播放实例注册到 video 节点
4:flvPlayer.load():加载视频
5:flvPlayer.play():播放视频
6:flvPlayer.pause():视频暂停
7:flvPlayer.unload():去除视频加载
8:flvPlayer.detachMediaElement():将播放实例从节点中取出
9:flvPlayer.destroy():销毁播放实例
三:flv.js 简略应用
1:html
<video id="my-player" preload="auto" muted autoplay type="rtmp/flv">
<source src="">
</video>
2:js
(1):引入 flv.js
<script src="./flv.js/flv.min.js"></script>
(2):应用 flv.js 实现播放 flv 格局流
// 获取 video 节点
videoElement = document.getElementById('my-player');
if (flvjs.isSupported()) {
flvPlayer = flvjs.createPlayer({
type: 'flv',
isLive: true,
url: 'XXXX',//flv 格局流地址
},{
enableWorker: false, // 不启用拆散线程
enableStashBuffer: false, // 敞开 IO 暗藏缓冲区
reuseRedirectedURL: true, // 重用 301/302 重定向 url,用于随后的申请,如查找、从新连贯等。autoCleanupSourceBuffer: true // 主动革除缓存
});
flvPlayer.attachMediaElement(videoElement);
flvPlayer.load(); // 加载
flvPlayer.play();// 播放}
(3):敞开视频流
flvPlayer.pause();
flvPlayer.unload();
flvPlayer.detachMediaElement();
flvPlayer.destroy();
flvPlayer = null;
正文完
发表至: javascript
2021-10-30