Angular中播放RTSP
要使用这个库需要先安装

我使用了npm来安装
https://www.npmjs.com/package/webrtc-streamer
需要启动webrtc-streamer后端,这里有下载地址
https://github.com/mpromonet/webrtc-streamer/releases/tag/v0.7.1
组件使用方法加载播放组件

dom上给了一个输入框和video

由于需要导入js需要在angular.json中引用

tsconfig.json中需要准许这个js的加载

由于我更新了最新版本nodejs,这里直接运行会有问题,,所以加了一个前缀,如果你是老版本的nodejs记得去掉再运行

给出代码
https://github.com/lu1770/video-site
架构是dotnet3.1+angular+webrtc-streamer+rtsp流
需要一直保持开启webrtc-streamer
测试过程中使用了webrtc这里给出源代码仓库以供查阅https://github.com/mpromonet/webrtc-streamer
之前有试过ffmpeg方案但是延时非常严重,使用webrtc就非常完美,感谢前人写的博客.

感谢.
Angular中播放RTSP的更多相关文章
- 使用Gin+WebSocket在HTML中无插件播放RTSP
在后台的开发中遇到了对接显示摄像头视频流的需求.目前获取海康及大华等主流的摄像头的视频流使用的基本都是RTSP协议.不过HTML页面并不能直接播放RTSP协议的视频流,查询了一番各种网页播放RTSP的 ...
- 使用vlc播放器播放rtsp流视频
可参考: 使用vlc播放器做rtsp服务器 web网页中使用vlc插件播放相机rtsp流视频 使用vlc进行二次开发做自己的播放器 首先需要安装vlc播放器,下载及安装步骤略 使用vlc播放器播放rt ...
- 【FFmpeg】ffplay播放rtsp视频流花屏问题
问题描述:ffplay播放rtsp视频流时,播放过程中随机出现花屏现象. 基本流程学习:阅读ffplay源码,熟悉其播放rtsp视频流的基本流程. 在ffplay源码阅读和分析的基础上,画出了其播放r ...
- 浏览器播放rtsp流媒体解决方案
老板提了一个需求,想让网页上播放景区监控的画面,估计是想让游客达到未临其地,已知其境的状态吧. 说这个之前,还是先说一下什么是rtsp协议吧. RTSP(Real Time Streaming ...
- 谷歌浏览器Chrome播放rtsp视频流解决方案
找半天,HTML5的可以支持RTMP 但是无法播放RTSP,flash也止步于RTMP,最后同事推荐了个开源的好东东 VLC ,请教谷歌大神之后,这货果然可以用来让各浏览器(IE activex方式, ...
- [转] web无插件播放RTSP摄像机方案,拒绝插件,拥抱H5!
需求 问题:有没有flash播放RTSP的播放器?H5能不能支持RTSP播放? 答案:没见过,以后估计也不会有: 问题:可以自己做浏览器插件播放RTSP吗? 答案:可以的,chrome做ppapi插件 ...
- 【FFmpeg】ffplay播放rtsp视频流花屏问题 (转)
问题描述:ffplay播放rtsp视频流时,播放过程中随机出现花屏现象. 基本流程学习:阅读ffplay源码,熟悉其播放rtsp视频流的基本流程. 在ffplay源码阅读和分析的基础上,画出了其播放r ...
- VLC播放RTSP视频延迟问题 (转)
原帖地址:http://blog.chinaunix.net/uid-26611383-id-3755283.html ======================================== ...
- web无插件播放RTSP摄像机方案,拒绝插件,拥抱H5!
本文转自:http://www.cnblogs.com/babosa/p/7355468.html 需求 问题:有没有flash播放RTSP的播放器?H5能不能支持RTSP播放? 答案:没见过,以后估 ...
- Web下无插件播放rtsp视频流的方案及各家优秀内容资源整理
Web下无插件播放rtsp视频流的方案及各家优秀内容资源整理 方案一:服务器端用 websocket 接受 rtsp ,然后,推送至客户端 实现步骤: 方案二:使用 ffmpeg + nginx 把 ...
随机推荐
- Windows QT程序配置删除网卡IP
1.Windows下可在CMD控制终端使用Dos命令对指定网卡进行IP配置,需要使用管理员权限打开CMD终端 往网卡添加IP主要有以下两种方法: 方法1: netsh interface ip add ...
- 题解 [AHOI2009]同类分布
不理解之前为什么不会哈哈哈哈哈哈哈哈. 我是个天才(喜 显然记录 \(f_{i, t, r, s, limit, lead}\),\(i, limit, lead\) 是数位 dp 的套路,\(t\) ...
- DESIR队列:早期axSpA的脊柱放射学进展
DESIR队列:早期axSpA的脊柱放射学进展 EULAR2015; PresentID: FRI0234 SPINAL RADIOGRAPHIC PROGRESSION IN EARLY AXIAL ...
- ajax请求头添加参数
在请求ajax时 ,有时后台要求在请求头里边上参数 ,这种情况下一般都是在原生APP项目当中,因为要在登录状态下才,所有要传token和登录id, var token = localStorage.g ...
- springboot跳转页面404的问题
今天测试的时候出现了这个问题: Cannot forward to error page for request [/] as the response has already been commit ...
- left join(二)
left join 通俗的解释:以左表为主表,返回左表的所有行,如果右表中没有匹配,则依然会有左表的记录,右表字段用null填充.看起来非常好理解,但实际操作的过程中可能会有一些很容易被忽略的点. 一 ...
- 问题记录——mysql服务忘记root密码后加skip-grant-tables 跳过权限认证参数启动报错处理
问题描述: 误操作将root密码重置后root原先密码登录不上,加skip-grant-tables 参数数据库启动失败,排查错误日志如下: 由于Mysql节点用到了半同步复制,尝试把半同步参数去掉试 ...
- 面试笔记1-redis
1.什么是RDB? RDB实际上是Redis的一种数据持久化机制.它每隔一段时间就会把内存中的数据写入到磁盘中的临时文件,作为快照,宕机重启之后,就会把rdb文件读取到内存中去,就可以恢复数据. 2. ...
- 类型提示和python函数中'->'的用法
一.类型提示 在python中,我们定义一个有参函数,调用该函数时需要传入参数,如下所示: # 定义一个简单的函数 def get_full_name(first_name, last_name): ...
- jquery实现多图片上传
在做后台管理的时候,遇到这样一个需求,实现多张图片上传并按选中的顺序显示.PS:图片上传的时候是即时上传到服务器,后台返回图片在服务器上的地址,在最后点击提交按钮的时候,把地址传给后端写入数据库即可. ...