前端不使用flash视频流播放(二)

上一篇文章说了一下后他视频流需要用到的工具和对应安装 现在说一下web端
参考:B站的flvjs 这里给B站点赞

组件

这里我打算一口气多展示几个摄像头画面 但是nginx-http-flv这个收到http1.x的限制 只能有6个
如果有好的解决办法 后续会继续写自己的学习内容
问了一圈大佬 websocket-flv可行 这里也有别人没开源的ng模块 https://zhuanlan.zhihu.com/p/77803705

list:[1,2,3,4,5,6,7]

gernerateId(index){
return “videoElement”+index;
},
loadVideo(){
for(var m =1;m var flvPlayer = null;
if (flvjs.isSupported()) {
var videoElement = document.getElementById(‘videoElement’+m);
flvPlayer = flvjs.createPlayer({
type: ‘flv’,
url: ‘http://IP:8080/live?app=live&stream=detect’
});
flvPlayer.attachMediaElement(videoElement);
flvPlayer.load();
}
}

还需在项目中添加flvjs文件
前端不使用flash视频流播放(二)_第1张图片

你可能感兴趣的:(java,flv)