史上最详细的webrtc-streamer访问摄像机视频流教程

已于 2024-12-27 21:31:56 修改
阅读量86 收藏
点赞数
文章标签： webrtc
于 2024-12-27 21:27:22 首次发布
原文链接：https://gitcode.youkuaiyun.com/65aa2847b8e5f01e1e44b1cd.html?dp_token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpZCI6MzYwOTc2MiwiZXhwIjoxNzM1OTA5MjM3LCJpYXQiOjE3MzUzMDQ0MzcsInVzZXJuYW1lIjoicXFfMzQ0NzY3MjcifQ.MTbd4xKsykY6ms5UJMKIys8t6H981ci29ojGYtYTm2A&spm=1001.21
版权

最近公司在搞流媒体，我推荐了webrtc-streamer进行搭建，使用了一段时间后，出现新的需求，需要将内网的摄像机进行公网访问，我查询了几乎所有的帖子和github的问题回复，都没有给我一个准确的答案，经过不断尝试和摸索，我终于成功了，我希望将我的过程记录下来，让更多的中国开发者可以少走弯路，我对于webrtc不是很了解，但是这并不影响我使用开源的webrtc-streamer进行开发

项目文章地址请移驾

2

使用 WebRtcStreamer 实现实时视频流播放
Davi的博客
12-09 5688
WebRtcStreamer 是一个基于 WebRTC 协议的轻量级开源工具，可以在浏览器中直接播放 RTSP 视频流。它利用 WebRTC 的强大功能，提供低延迟的视频流播放体验，非常适合实时监控和其他视频流应用场景。本文将介绍如何在Vue.js项目中使用实现实时视频流播放，并分享相关的代码示例。注意:只支持H264格式流媒体方式文章。
Vue前端播放rtsp视频流（vue+webrtc-streamer）
m0_74825360的博客
12-10 1908
(Web Real-Time Communications) 是一项实时通讯技术，它允许网络应用或者站点，在不借助中间媒介的情况下，建立浏览器之间点对点（Peer-to-Peer）的连接，实现视频流和（或）音频流或者其他任意数据的传输。WebRTC 包含的这些标准使用户在无需安装任何插件或者第三方的软件的情况下，创建点对点（Peer-to-Peer）的数据分享和电话会议成为可能。检查是否启动成功，在浏览器输入http://127.0.0.1:8000/，如果有显示自己的桌面，则启动成功。
使用webrtc-streamer查看rtsp实时视频
zouxin_88的专栏
07-09 1928
将下载包html文件夹下webrtcstreamer.js文件和html/libs文件夹下adapter.min.js文件复制到webrtc文件夹下。rtsp地址（html中配置）： rtsp://admin:admin@192.168.43.110:554/stream0。浏览网址（phpstudy中配置）:http://192.168.43.102/webrtc/webrtc.html。在浏览器访问127.0.0.1:8000，点击窗口可以看到本机上各窗口实时状态，点击摄像头可以显示摄像头画面。
vue前端部署webrtc-streamer访问摄像机视频流教程
hxd_0316的博客
12-11 3702
经过一番查找，最终决定使用B站（bilibili）开源的flvjs作为解决方案，其原理是后端用ffmpeg将rtsp视频流转换为flv，然后通过websocket传输flv视频流，然后前端通过websocket获取到视频流后，使用flvjs对视频流再一次处理并进行播放，这是一套无插件无flash免费的视频直播解决方案。后面我们又发现了通过webrtc-streamer播放视频流的方法，成功解决了延迟卡顿的问题。再次强调-H后面是你要监听的地址端口， -o 为了不转码，使用GPU运行，从而降低CPU负荷。
记浏览器使用webrtc-streamer 播放rtsp 流
weixin_41838201的博客
07-14 2535
vue中使用webrtcstreamer播放rtsp流
webrtc基于webrtc-streamer推流实现直播
02-02
WebRTC-Streamer是WebRTC的一个扩展，它提供了一个服务器端的解决方案，使得非WebRTC兼容的设备或者服务也能参与到WebRTC的流媒体传输中。 在"webrtc-streamer"中，主要作用是将来自WebRTC的流转换为其他格式，如...
webrtc-streamer
05-22
WebRTC-streamer-v0.7.2-dirty-Windows-AMD64-Release 是一个特定版本的WebRTC-streamer软件包，适用于64位Windows操作系统。这个版本可能包含了一些修复和改进，其“dirty”标记可能意味着这不是一个正式的发布版本...
webrtc-streamer v0.8.6 一款werbrtc服务器（windos版本），可以直接将rtsp流拉到网页上显示
最新发布
03-10
webrtc-streamer的使用方法可能包括以下几个步骤：首先，需要有一个RTSP流源，例如网络摄像头或视频服务器；然后，运行webrtc-streamer程序，输入RTSP流地址及相关配置信息；最后，webrtc-streamer会处理RTSP流，并...
webrtc-streamer-v0.8.1-dirty-Windows-AMD64-Release.zip
01-26
在"webrtc-streamer-v0.8.1-dirty-Windows-AMD64-Release.zip"这个压缩包中，我们看到的是一个针对Windows操作系统，AMD64架构的WebRTC流媒体服务器的发行版本。 WebRTC-Streamer是基于WebRTC的开源项目，它提供了...
海康威视有插件、无插件播放；webrtc直播；西瓜视频播放器；mpegts.js直播；flvjs直播
inprivacy的博客
02-02 4223
海康威视有插件、无插件播放；webrtc直播；西瓜视频播放器；mpegts.js直播；flvjs直播。
在vue中使用webrtcstreamer解析播放rtsp流
zero_er的博客
09-12 3725
adapter.min.js文件位置：webrtc-streamer-v0.8.6-dirty-Windows-AMD64-Debug\html\libs中。webrtcstreamer.js文件位置：webrtc-streamer-v0.8.6-dirty-Windows-AMD64-Debug\html中。测试输入流是否可以播放（这里可以播放，但有些原因嵌入到页面里也无法播放）启动完成后可以在浏览器中输入设置的ip和端口打开，看看是否启动成功。播放成功了，右键，打开编码器信息，查看是否是h264编码。
【Vue2 + webrtc-steamer】rtsp流在Web端实时播放
weixin_47375144的博客
05-09 6587
海康威视：需要申请accessKey、ip、port等，有专门的管理平台（太麻烦，没有研究，简单了解了下）。（1）支持：WebRTC、FLV、HLS的直播流地址，以及HLS、FLV、MP4等格式的点播播放地址。vue-video-player+video.js：只支持flash插件的浏览器。（2）不支持：RTSP、RTMP流地址。（2）支持：FLV格式的点播播放地址。（3）不支持：非FLV格式的地址。（1）原理：RTSP转FLV。⑤ 播放rtsp流结果如下。腾讯云TCPlayer。
ubuntu20.04使用webrtc协议拉流显示步骤
suxioapian的博客
05-27 889
-------使用webrtc-streamer这个流媒体框架拉usb数据并直接推送webrtc流。访问网页：http://localhost:8080/ 查看状态，如果不成功检查端口是否占用。----------使用Gstresmer推rtmp流。--------直接使用srs网站推送webrtc流。----------使用FFmpeg推rtmp流。------------jswebrtc播放器。我验证的延时很大，要尝试的话具体可以参考。但我不知道选择推送那个摄像头的流。--------srs播放器。
使用VUE和webrtc-streamer实现rtsp实时监控
热门推荐
泪耳的博客
01-07 1万+
本文简单总结了自己使用过程的一些知识点和VUE和webrtc-streamer实现rtsp实时监控的一些步骤，希望可以帮到你。
webrtc-streamer实现rtsp流播放
feng4175的博客
11-22 893
浏览器是不直接支持rtsp流的直接播放，纯前端实现rtsp流，在之前有flash，但是随着浏览器不在支持flash之后直接播放很难实现。对于vlc播放rtsp流，目前可有使用的浏览器基本上时360，如果是单一需求或者只用此浏览器的话vlc是一个很nice的实现办法。海康的web无插件开发包也是一大神器，应该只支持海康的摄像头。找了一大通，发现有一款叫做webtrc-streamer的神器，通过启动服务，连接服务，再连接rtsp流，可在video标签上实现rtsp流的直接播放。页面上引入两个js文件。
网页嵌入本地设备[摄像头/屏幕/网页等]的实时画面或网络摄像头的实时画面——视频流转码(基于webrtc)
weixin_60275604的博客
05-20 1819
获取本地设备[摄像头/屏幕/网页等]的画面，或者网络摄像头的推流地址。将这些画面通过webrtc服务器进行访问，将目标设备的视频流播放用html文件体现。后续web开发时，嵌入html文件(可多个)即可。 本地设备和webrtc运行在同一局域网，部署webrtc服务时如果使用内网穿透地址运行，可以使用外网访问。
webrtc 网络的一些坑（webrtc-streamer）
似水流年
01-23 511
这是个随机端口，可以在webrtcstreamer里面配置开启的端口范围（-R Udp_port_min:Udp_port_min : Set the webrtc udp port range (default:0:65535) 我没有试过），如果服务器的端口不放开的话，会导致浏览器无法打开视频。先收集到的是内网信息，然后是公网信息。webrtc-streamer的demo在调用call方法的时候，会加上options这一个参数，而我们在自己的系统前端没有加，导致部分视频打不开，或者打开极慢。
webrtc streamer&前端页面js播放摄像头rtsp流
梨子社区
01-06 2018
如果能正常播放，那就是没问题的，等会引入js，进行页面播放。如果一直转圈圈，可能是摄像头的编码格式是H265的，我买的最新款萤石摄像头默认的就是H265，大华的可以正常播放，但是萤石的就一直转圈圈。这个时候需要下载一个萤石客户端，去设置一下摄像头的转码格式（有主码流和辅码流之分，如果都要用，那每个码流的格式都要设置成H264）。设置后就可以正常播放了。里面会罗列出你电脑任务栏上所有的应用，点击就是类似录制当前应用的一个窗口，可以不用管，我们找到我们配置文件中的dahua和yingshi两个选项卡。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值