html播放rtsp低延时(局域网测试500ms左右）

采取的方案

RTSPtoWebRTC + jswebrtc

开源项目：

流媒体：https://github.com/deepch/RTSPtoWebRTC

播放器：https://gitee.com/kernelj/jswebrtc

基本原理：

通过浏览器和RTSPtoWebRTC交换sdp信息，然后读取rtp包或者发送rtp的方式进行

方案1：通过RTSPtoWebRTC config.json 标记流id及流地址，接口请求时，在回传音视频数据

<script>var video = document.getElementById('video-webrtc');var url = 'webrtc://127.0.0.1:8083/stream/1';var player = new JSWebrtc.Player(url, { video: video, autoplay: true, onPlay: (obj) => { console.log("start play") } });//player.stop();</script>

方案2：调用jswebrtc.min.js时，传入流媒体服务器地址，rtsp地址，流媒体服务器接到请求时再去拉流，生成并保存流id，下次再有相同的rtsp请求时，直接返回音视频信息

    <script>var video = document.getElementById('video-webrtc');var url = "http://192.168.0.56:8083"; var player = new JSWebrtc.Player(url, { video: video, rtspurl: 'rtsp://192.168.0.109:554/rtp/34020000001320000012-34020000001320000012', autoplay: true, onPlay: (obj) => { console.log("start play") } });//player.stop();</script>程序后台地址：localhost:8083

配置文件的两种配置方式配置1：通过配置文件取流，流id以live开头{"server": {"http_port": ":8083"},"streams": {"live1": {"on_demand": false,"disable_audio": true,"url": "rtsp://192.168.0.109:554/rtp/34020000001110000087-34020000001320000112"},"live2": {"on_demand": false,"disable_audio": true,"url": "rtsp://192.168.0.109:554/rtp/34020000001110000087-34020000001320000113"},"live3": {"on_demand": false,"disable_audio": true,"url": "rtsp://192.168.0.109:554/rtp/34020000001110000087-34020000001320000114"},"live4": {"on_demand": false,"disable_audio": true,"url": "rtsp://192.168.0.109:554/rtp/34020000001110000087-34020000001320000115"},"live5": {"on_demand": false,"disable_audio": true,"url": "rtsp://192.168.0.109:554/rtp/34020000001110000087-34020000001320000116"},"live6": {"on_demand": false,"disable_audio": true,"url": "rtsp://192.168.0.109:554/rtp/34020000001110000087-34020000001320000117"},"live7": {"on_demand": false,"disable_audio": true,"url": "rtsp://192.168.0.109:554/rtp/34020000001110000087-34020000001320000118"},"live8": {"on_demand": false,"disable_audio": true,"url": "rtsp://192.168.0.109:554/rtp/34020000001320000021-34020000001310000021"},"live9": {"on_demand": false,"disable_audio": true,"url": "rtsp://192.168.0.109:554/rtp/34020000001320000020-34020000001320000020"}}
}配置2：通过api取流,流id从1开始{"server": {"http_port": ":8083"},"streams": {}
}程序启动后访问8083，如果没有流，提示：No Stream Found (add stream and reload page)

效果

html播放rtsp低延时(局域网测试500ms左右）相关推荐

监控摄像头RTSP低延时无插件直播解决方案
监控摄像头RTSP低延时无插件直播解决方案第一章应用简介当前,视频监控应用场景越来越多,传统的视频监控厂商提供的解决方案需要安装厂商自己的手机APP或PC客户端软件,非常不方便在互联网环境下与第 ...
Android 直播播放器 IJK播放器低延时120ms
基于上一篇文件rtmp推流<推流文章地址传送门>,需要解码播放器 ,由于是直播所以需要延时优化到极致,采用播放器也是ijk开源播放器直接修改,目前测试1080p+音频延时效果如下图: 在 ...
支持8K播放且低延时高并发全功能的流媒体播放器如何降低直播延迟？
背景直播行业大火,大家可以在日常生活中接触到各类直播,例如游戏直播.乐秀.在线教育.发布会等.无论哪种类型的直播,延时是直播过程中需要关注的重要方面.直播实现低延迟,是对大部分直播产品的要求,低延迟 ...
支持8K播放，低延时高并发流媒体音视频播放器EasyPlayer.js是如何实现播放8K视频的
需求分析一般对于一个播放器,应该支持如下几种显示模式: 等比例,最大化区域显示,不裁剪等比例,最大区域显示,裁剪拉伸显示,铺满全屏要实现这几种显示模式.其实只要对播放控件的布局进行些许调整即可 ...
传统大华海康宇视安防摄像头RTSP流如何转webrtc直播低延时无插件浏览器视频播放
传统大华海康宇视安防摄像头RTSP流如何转webrtc直播低延时无插件浏览器视频播放 1.问题场景 2.WEBRTC延时对比 3.LiveNVR支持WEBRTC输出 4.RTSP/HLS/FLV/RT ...
LiveQing视频点播RTMP推流直播服务支持H5无插件WebRTC超低延时视频直播
LiveQing视频点播RTMP推流直播服务支持H5无插件WebRTC超低延时视频直播 1.WebRTC超低延时视频直播 2.WebRTC延时对比 3.LiveQing播放WebRTC流 4.分屏页面 ...
可扩展性强且经济高效？RealMedia HD低延时直播方案为你支招
欢迎光临新一期的Real编码研习社,本期我们有幸请到了RealNetworks媒体解决方案架构师罗强,想了解低延时的直播方案如何能兼具可扩展性强和经济高效的特点,今天这一期一定不要错过哦~ 一.在您看 ...
基于libVLC的视频播放器之二：使用VLC-Qt播放RTSP流
此篇是使用VLC浏览器插件播放RTSP流的姊妹篇. 一.直接使用libVLC libVLC是VLC media player多媒体框架的核心引擎和接口,开发者使用它能轻松的创建大量具有VLC特性的应 ...
rtsp服务器如何低延时linux,web实现RTSP无插件低延迟播放方案整理
Web播放RTSP方案调研项目需求:web无插件播放rtsp流,低延迟,支持多客户端 1.rtsp to websocket FFMPEG+JSMPEG实现网页流媒体播放 https://www.c ...

html播放rtsp低延时(局域网测试500ms左右）

html播放rtsp低延时(局域网测试500ms左右）相关推荐

最新文章

热门文章