video标签布播放FLV直播视频
不多哔哔 直接上案例
<video
ref="video"
class="video-js vjs-default-skin vjs-big-play-centered flex-grid aaaa"
style="object-fit: fill;width:100%"
:width="width"
:height="height"
autoplay
loop
>抱歉, 你的浏览器不支持</video>
createPlayer(url) {
console.log(url);
//url是flv格式的视频播放地址
this.loading = true;
if (flvjs.isSupported()) {
if (this.player) {
this.player.pause();
this.player.unload();
this.player.detachMediaElement();
this.player.destroy();
}
this.player = flvjs.createPlayer(
{
type: "flv",
url,
isLive: true,
hasAudio: false,
hasVideo: true
},
{
isLive: true,
enableStashBuffer: true,
enableWorker: true,
lazyLoad: false,
stashInitialSize: 120
// autoCleanupSourceBuffer:true
}
);
this.player.attachMediaElement(this.$refs.video);
this.player.load(); //加载
this.$refs.video.addEventListener("loadedmetadata", e => {
this.loading = false;
this.player.play();
});
}
},
//关闭视频 -----放在事件中
if (this.player) {
this.player.pause();
this.player.unload();
this.player.detachMediaElement();
this.player.destroy();
this.player = null;
}
