vue项目播放rtsp流视频。

news/2025/2/22 11:13:29/

下载webtrc-streamer的压缩包,在github上有 https://github.com/mpromonet/webrtc-streamer/releases
将下载包html文件夹下webrtcstreamer.js文件和html/libs文件夹下adapter.min.js文件复制到VUE项目public/stactic目录下,在index.html文件里引入这两个js文件。

解压之后打开exe文件就可以播放了。(想做到把exe变成开机自启,这样就不用打开了。但是没做),有需要自行百度吧。

<template><video id="video" autoplay></video>
</template>
data() {
return {webRtcServer: null,videoPath_Channel1: "rtsp://", videoPath_Channel2: "rtsp:// ",
}
}mounted() {this.getVideoSatusPlay();},methods: {// 获取实时视频流rtsp
getVideoSatusPlay() {//192.168.1.100是启动webrtc-streamer的服务器IP,8000是webrtc-streamer的默认端口号,可以在服务端启动的时候更改的this.webRtcServer = new WebRtcStreamer("video",location.protocol + "//127.0.0.1:8000" // 本地);//需要看的rtsp视频地址,可以在网上找在线的rtsp视频地址来进行demo实验,在vlc中能播放就能用this.webRtcServer.connect(this.typeName == '可见光' ? this.videoPath_Channel1 : this.videoPath_Channel2);
},
}
beforeDestroy() {this.webRtcServer.disconnect();this.webRtcServer = null;
}

http://www.ppmy.cn/news/1176496.html

相关文章

vue2、vue3中路由守卫变化

什么是路由守卫&#xff1f; 路由守卫就是路由跳转的一些验证&#xff0c;比如登录鉴权&#xff08;没有登录不能进入个人中心页&#xff09;等等等 路由守卫分为三大类&#xff1a; 全局守卫&#xff1a;前置守卫&#xff1a;beforeEach 后置钩子&#xff1a;afterEach 单个…

sheng的学习笔记-【中】【吴恩达课后测验】Course 3 - 结构化机器学习项目 - 第二周测验

课程3_第2周_测验题 目录&#xff1a;目录 要解决的问题 ① 为了帮助你练习机器学习的策略&#xff0c;本周我们将介绍另一个场景&#xff0c;并询问你将如何行动。 ② 我们认为这个在机器学习项目中工作的“模拟器”将给出一个任务&#xff0c;即领导一个机器学习项目可能…

MySQL——EXPLAIN用法详解

EXPLAIN是MySQL官方提供的sql分析的工具之一&#xff0c;可以用于模拟优化器执行sql查询语句&#xff0c;从而知道MySQL是如何处理sql语句。EXPLAIN主要用于分析查询语句或表结构的性能瓶颈。 以下是基于MySQL5.7.19版本进行分析的&#xff0c;不同版本之间略有差异。 1、EXP…

Kettle循环结果集中的数据并传入SQL组件【或转换】里面

简介&#xff1a;在尝试使用了结果集的Demo循环后&#xff0c;进入到生产还是有一点问题的&#xff0c;以下是各个组件的分解解释、遇到的问题&#xff0c;以及解决问题的思路&#xff0c;最后文章的最后会把完整的Ktr文件放出来。记得收藏点赞喔&#xff01; 先来看张图~来自…

ubuntu 安装 gnome 安装 xrdp

先安装xrdp 更新 apt-get sudo apt-get update && apt-get upgrade安装图形包 apt-get install xubuntu-desktop安装 xrdp apt-get install xrdp安装 xfce4 apt-get install xfce4配置 xfce4 Add xfce to the xfce desktop window manager autorun by fixing the …

【网络协议】聊聊TCP的三挥四握

上一篇我们说了网络其实是不稳定的&#xff0c;TCP和UDP其实是两个不同的对立者&#xff0c;所以TCP为了保证数据在网络中传输的可靠性&#xff0c;从丢包、乱序、重传、拥塞等场景有自己的一套打法。 TCP格式 源端口和目标端口是不可缺少的&#xff0c;用以区分到达发送给拿…

使用Golang策略和最佳实践高效处理一百万个请求

有效处理一百万个请求的策略与最佳实践 在不断发展的Web应用程序领域&#xff0c;处理大规模请求的能力是成功的关键因素。作为一名全栈开发人员&#xff0c;您可能熟悉Golang的效率和性能。在本文中&#xff0c;我们将深入探讨如何利用Golang来优雅地处理处理一百万个请求的挑…

Linux---(四)权限

文章目录 一、shell命令及运行原理1.什么是操作系统&#xff1f;2.外壳程序3.用户为什么不直接访问操作系统内核?4.操作系统内核为什么不直接把结果显示出来&#xff1f;非要加外壳程序&#xff1f;5.shell理解重点总结&#xff08;1&#xff09;shell是什么&#xff1f;&…