(function() {
/**0.依赖flv.js和jquery
* 1.引入script标签 <script type="text/javascript" src="/static/javascripts/lib/flvVideo.js"></script>
* 2.直接使用 createStream(),传入dom节点,httpurl,即可
* 形参domId: 是一个dom对象,及需要将创建的video放置的盒子
* httpurl: 是播放的地址
* perFlvObj: 第三个参数不用传入,是在内部用于处理错误的情况
* 3.返回一个flv实例对象
* 4.提供三个方法 clearAllFlv 使用 createStream.clearAllFlv()
* clearOneFlv 使用 createStream.clearOneFlv(flvObj)
* checkObj 使用 createStream.checkObj()
*/
let num = 0
let flvArr = []
let createStream = function createStream(domId, httpurl, perFlvObj) {
if (domId == null) return
let self = this
//出现错误传入(错误的flv对象),将其清空
if (perFlvObj) {
try {
perFlvObj && perFlvObj.interValTimer && clearInterval(perFlvObj.interValTimer)
perFlvObj.destroy && perFlvObj.destroy()
} catch (error) {
console.log('err', error)
}
var errobjNum = flvArr.indexOf(perFlvObj)
if (errobjNum != -1) {
flvArr.splice(errobjNum, 1)
}
perFlvObj = null
}
let videoDom = $(`<video id="videoElement" disablePictureInPicture width="100%" height="100%" muted controls></video>`)
domId.html(videoDom)
if (!httpurl) return
if (flvjs.isSupported()) {
var flvPlayer = flvjs.createPlayer({
type: 'flv',
"isLive": true,
duration: 0,
url: httpurl
}, {
enableWorker: true,
enableStashBuffer: false,
stashInitialSize: 0,
isLive: true,
lazyLoad: false,
lazyLoadMaxDuration: 0,
lazyLoadRecoverDuration: 0,
deferLoadAfterSourceOpen: false,
fixAudioTimestampGap: false,
})
// obj.flvList.push(flvPlayer)
flvPlayer.attachMediaElement(videoDom[0])
flvPlayer.load()
var myTimeer = setTimeout(function() {
flvPlayer.play()
}, 2000)
videoDom[0].onerror = function(err) {
// console.log('videoDomerror')
myTimeer && clearTimeout(myTimeer)
createStream(domId, httpurl, flvPlayer)
}
flvPlayer.on("error", (err) => {
// console.log('fLVDomerror')
myTimeer && clearTimeout(myTimeer)
createStream(domId, httpurl, flvPlayer)
})
// if (self['timer' + domId]) {
// clearInterval(self['timer' + domId])
// }
var interValTimer = setInterval(function() {
if (!videoDom[0].buffered.length) {
try {
// console.log('buffered')
myTimeer && clearTimeout(myTimeer)
createStream(domId, httpurl, flvPlayer)
} catch (error) {
console.log('catch', error)
}
return
}
var end = videoDom[0].buffered.end(0)
var diff = end - videoDom[0].currentTime
if (diff >= 0.5 || diff < 0) {
videoDom[0].currentTime = end
}
if (diff == 0) {
// console.log('diff')
myTimeer && clearTimeout(myTimeer)
createStream(domId, httpurl, flvPlayer)
return
}
}, 3000)
flvPlayer.interValTimer = interValTimer
flvArr.push(flvPlayer)
return flvPlayer
}
}
//清除当前所有flv对象,用于全部视频窗口重置
createStream.clearAllFlv = function clearAllFlv() {
for (var i = 0
try {
flvArr[i] && flvArr[i].destroy()
flvArr[i] && flvArr[i].interValTimer && clearInterval(flvArr[i].interValTimer)
} catch (error) {
console.log(error)
}
flvArr.splice(i, 1)
i = i - 1
}
}
//传入一个flv对象地址,如果是当前存在的flv对象,则清除,用于单一视频窗口刷新
createStream.clearOneFlv = function clearOneFlv(obj) {
try {
obj && obj.interValTimer && clearInterval(obj.interValTimer)
obj.destroy && obj.destroy()
} catch (error) {
console.log('err', error)
}
var errobjNum = flvArr.indexOf(obj)
if (errobjNum != -1) {
flvArr.splice(errobjNum, 1)
}
obj = null
}
//查询当前共有多多少flv对象
createStream.checkObj = function() {
return flvArr
}
window.createStream = createStream
})()