flv.js插件播放flv格式的视频实例(vue)

这段代码展示了如何使用FLV.js库在Vue.js应用中实现实时视频播放和关闭功能。`videoPlay`方法创建并加载视频播放器,而`videoPause`方法则负责暂停、卸载和销毁视频流,同时调用接口关闭视频流。
摘要由CSDN通过智能技术生成
data(){
	return{
		flvPlayer:null,//flv对象
	}
},
methods:{
	  //视频播放
        videoPlay() {
            var self = this;
            //调用视频地址的接口,返回flv的播放地址
                videoPlayRequest({ devId: self.devId }).then((res) => {
                var video = self.$refs.videoRef;
                self.flvPlayer = flvjs.createPlayer(
                    {
                        type: 'flv',
                        isLive: true,
                        url: res.FLV
                    },
                    {
                        enableStashBuffer: false
                    }
                );
                self.flvPlayer.attachMediaElement(video);
                self.flvPlayer.load();
                setTimeout(function () {
                    self.flvPlayer.play();
                }, 2000);

            });
        },
         //视频关闭
        videoPause() {
            var self = this;
            //关闭当前视频流
            if(self.flvPlayer){
                self.flvPlayer.pause();
                self.flvPlayer.unload();
                self.flvPlayer.detachMediaElement();
                self.flvPlayer.destroy();
                self.flvPlayer=null;
                //调用关闭流的接口
                videoStopRequest({ deviceId: self.devId }).then((res) => {});
            }
        }
}

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值