persagy_videoui
v0.2.4
Published
博锐尚格浏览器端播放摄像头视频组件
Downloads
6
Readme
persagy_videoui
安装
1.打开命令窗口,cd到要使用persagy_videoui的项目目录
2.执行 npm install persagy_videoui
使用
1.在项目入口js里添加以下代码
import 'persagy_videoui/persagy_videoui.css'
import persagyVideo from 'persagy_videoui'
Vue.use(persagyVideo)
2.在要使用视频的组件内加入以下代码
<persagyVideo :videoService="videoService" :rtspUrl="item.rt" :videoType="item.videoType"></persagyVideo>
组件的props说明
1.videoService
视频服务地址,如:http://47.93.132.139:10016/
2.rtspUrl
要播放的视频的rtsp流地址
3.videoType
播放类型,支持:flv、hls
在ios系统上使用hls播放,其他系统建议使用flv播放
4.playSourceUrl
视频源URL,即可以直接播放的视频地址(支持hls格式、flv格式),不可和rtspUrl、videoService同时使用
5.playMode
播放模式。auto 自动播放(组件加载完毕后自动播放) click 点击组件上的播放图标进行播放。默认click
备注
1.不要用v-show控制组件的显示隐藏,会带来连接释放不掉的问题,用v-if控制
2.关于停止播放,可以使用ref标记,示例如下:
<persagyVideo ref="pvideo" :videoService="videoService" :rtspUrl="item.rt" :videoType="item.videoType"></persagyVideo>
在要停止播放的地方:this.$refs.pvideo.stopPlay();