对摄像头视频流（RTSP）协议二次开发获取视频流在前端，使用

辛勤的程序猿

已于 2024-07-24 14:25:13 修改

阅读量703

点赞数 1

文章标签：前端 webrtc

于 2023-07-22 14:04:46 首次发布

本文链接：https://blog.csdn.net/llz19670/article/details/131867087

版权

文章介绍了如何通过WebRTC技术解决浏览器不支持直接解析RTSP协议的问题。通过建立一个WebRTC服务器，将RTSP视频流转换并中转至前端页面进行播放，示例代码展示了如何连接WebRTC服务器并播放RTSP流。

摘要由CSDN通过智能技术生成

摄像头的数据流现在一般是Rtsp协议视频流，现在直接解析rtsp协议的VLC大多数浏览器不支持，可以采取使用Webrtc实现中转，将RTSP视频流传到Webrtc服务器上解析后，从前端页面展示操作等，样例代码如下：

<html>
<head>
<script src="js/adapter.min.js" ></script>
<script src="js/webrtcstreamer.js" ></script>
<script>
   var webRtcServer = null;
   window.onload = function() {
       webRtcServer = new WebRtcStreamer("video1","http://127.0.0.1:8000");
       webRtcServer.connect("rtsp://admin:admin@ip:端口号/stream1");
   }
   window.onbeforeunload = function() { webRtcServer.disconnect(); }
</script>
</head>
<body>
   <video id="video1" loop autoplay />
</body>
</html>