华为实时视频使用FLV播放RTSP流

import flvjs from 'flv.js';

安装flv

复制代码
<video style="width:100%;height:100%;" ref="videoHWRef" ></video>

  // src 华为rtsp流    rtsp://admin:Huaweivideo@10.10.8.151:554/xxx/trackID=1
  // url 需要后端提供视频源地址
  playVideo() {
	if (flvjs.isSupported() && src) {
	   let video = this.$refs['videoHWRef']
	   if (video) {
	     this.flvPlayer = flvjs.createPlayer(
	       {
	           type: "flv",
	           isLive: true,
	           hasAudio: false,
	           url: `${baseUrl}/iot/live/${window.btoa(src)}/live.flv`
	       },
	       {
	           autoCleanupSourceBuffer: true,
	           enableWorker: false, //不启用分离线程
	           enableStashBuffer: true, //关闭IO隐藏缓冲区
	           isLive: true,
	           lazyLoad: false,
	       }
	     );
	     this.flvPlayer.attachMediaElement(video);
	     try {
	       this.flvPlayer.load();
	       this.flvPlayer.play();  // 他还有很多的函数可以看一下flv.js的官方文档
	       // this.listenVideo(index);
	     } catch (error) {
	         console.log(error);
	     };
	   }
	 }
	}
  }

beforeDestroy() {
  if (this.flvPlayer) {
     this.flvPlayer.pause();
     this.flvPlayer.unload();
     this.flvPlayer.detachMediaElement();
     this.flvPlayer.destroy();
     this.flvPlayer = null;
   }
}

可播放

相关推荐
_丿丨丨_5 小时前
XSS(跨站脚本攻击)
前端·网络·xss
天天进步20155 小时前
前端安全指南:防御XSS与CSRF攻击
前端·安全·xss
呼啦啦呼啦啦啦啦啦啦6 小时前
利用pdfjs实现的pdf预览简单demo(包含翻页功能)
android·javascript·pdf
拾光拾趣录7 小时前
括号生成算法
前端·算法
拾光拾趣录8 小时前
requestIdleCallback:让你的网页如丝般顺滑
前端·性能优化
前端 贾公子8 小时前
vue-cli 模式下安装 uni-ui
前端·javascript·windows
拾光拾趣录8 小时前
链表合并:双指针与递归
前端·javascript·算法
@大迁世界9 小时前
前端:优秀架构的坟墓
前端·架构
拼图2099 小时前
element-plus——图标推荐
javascript·vue.js·elementui
期待のcode9 小时前
图片上传实现
java·前端·javascript·数据库·servlet·交互