flv.js 播放多个rtsp流【二】

①添加模板

<template><div><video class="demo-video" ref="player" muted autoplay></video><video class="demo-video" ref="player1" muted autoplay></video></div>
</template>

②我这儿简单演示，所以写的简单点，大家可以使用动态获取数据或json文件优化哦

export default {data () {return {productLists: [{id: "1",rtsp: "rtsp://localhost/0210test6",player: null},{id: "2",rtsp: "rtsp://localhost/0210test1",player1: null}]}}

③修改钩子函数mounted ()

mounted () {if (flvjs.isSupported()) {let video = this.$refs.player;

flv.js 播放多个rtsp流【二】相关推荐

videojs-flvjs：video.js + flv.js播放m3u8和flv视频
videojs-flvjs是video.js的扩展,让video.js支持flv.js播放器,可以在video.js的techOrder里配置flvjs播放器. 下面做了一个切换m3u8和flv直播流 ...
c#调用VLC播放视频，rtsp流
c# 使用VLC播放视频,监控视频最近公司要做一个监控视频的播放页面,让我用VLC做一个,就再网上找资料,找了很多,大部给的代码都是可以的,但是要学会自己去拼装,好多都是要用积分下载,我也下载了几个 ...
整合SpringBoot + Nginx-http-flv-module + JavaCV(FFmpeg) RTSP推流，使用VUE + Flv.js播放
目录 1.安装nginx-rtmp-module 2.Maven引入JavaCV包 3.编写Java核心代码 4.VUE安装video.js和flv.js 5.编写前端测试代码 6.运行效果 1.安装 ...
flv.js播放视频时遇到的问题
文章目录前言一.报错二.原因三.方案前言 rtsp流通过ffmpeg+nginx-http-flv转成rtmp以及http-flv流,并通过flv.js在页面播放,带有音频的流出现播放不了问 ...
vue3使用flv.js播放推流视频，完整版组件
目录前言 1.构建 2.销毁 3.断流.卡顿重连 4.报错.停滞重连 5.累计延时处理 6.手动全屏前言本人是在vue3中使用flv.js处理推流时,遇到的一些问题,以及处理办法,归纳总结为一个 ...
TSINGSEE青犀视频H265播放器FLV.js播放一段时间后报内存不足怎么处理？
EasyPlayer随着多年不断的更新和迭代,不断基于成功的实践经验,发展出包括有: EasyPlayer RTSP.EasyPlayer RTMP.EasyPlayerPro 和EasyPlayer ...
flv.js播放卡顿，短线重连，包括九宫格，四宫格，一宫格
解决flv.js断网重连等一些问题这里简单做一下改动请看下图这张图片就展示了宫格以及设备等一些问题附上解决断流以及卡顿的代码,各位前端的精英,看看就能懂 this.$nextTick(() = ...
flv.js播放flv视频
flv.js是FLV视频播放器,纯JS开发,无需Flash. <!DOCTYPE html> <html><head><meta charset=" ...
FLV.js播放报错,及浏览器播放flv缓存内存不足导致黑屏
1.浏览器Flv播放器时,十分钟左右浏览器会出现崩溃的情况,报内存不足而导致黑屏,页面卡顿, 导致崩溃的原因有很多种,此处我们排除网络问题后,猜测是视频播放后浏览器缓存没有及时释放,导致内存持续增长, ...

flv.js 播放多个rtsp流【二】

flv.js 播放多个rtsp流【二】

flv.js 播放多个rtsp流【二】相关推荐

最新文章

热门文章