flvjs

flvjs在vue中的使用：

HTML:
<video class="video-content" id="video">
	您的浏览器不支持 HTML5 video！
</video>

import flvjs from "flv.js";
js:
//加载播放
 let flvUrl = 'url'
 let flvPlayer=null//flv实例
 let videoPlayer = document.getElementById('video'); //获取html
 if (flvjs.isSupported()) {
　　flvPlayer = flvjs.createPlayer({
     type: 'flv',
     url: flvUrl
   })
   flvPlayer.attachMediaElement(videoPlayer )
   flvPlayer.load()
   flvPlayer.play()
 }
 // 多路同时播放可能处理不过来，这里要主动追帧
setInterval(()=> {
    if (flvPlayer.buffered.length > 0) {
        const diff = flvPlayer.buffered.end(0) - flvPlayer.currentTime
        console.log(diff)
        if (diff > 0.5) {
            flvPlayer.currentTime = flvPlayer.buffered.end(0) - 0.1
        }
    }
}, 500)
 
 // 销毁
 function pausemix() {
  flvPlayer.pause()
  flvPlayer.unload()
  flvPlayer.detachMediaElement()//销毁实例
  flvPlayer.destroy()
  flvPlayer = null
 }

关于同时播放多路视频问题(6路以上)
用websocket播放六路以上视频, 需后端将视频的URL单独设置端口, 谷歌浏览器最大可进行6路长链接(浏览器请求并发), 如果想要请求第七路会造成请求阻塞, (由于打包后的js文件按需加载, 会造成js文件请求等待, 页面卡死 )