将摄像头视频流从Rtsp协议转为websocket协议
liuian 2025-10-23 07:07 4 浏览
写在前面
很多通过摄像头拿到的视频流格式都是Rtsp协议的， 比如：海康威视摄像头。 在现代的浏览器中， 已经不支持直接播放Rtsp视频流，而且，海康威视提供的本身的webSdk3.3.0视频插件有很多问题， 比如：视频插件没有dom树的概念， 且总是浮动在所有元素的最上层。 所以， 通过转流方式进行在网页上播放视频是替代官网sdk的一种尝试。
Rtsp视频流是什么？
RTSP（Real Time Streaming Protocol）是一种实时流媒体传输协议，用于在网络上实时传输音视频数据。它可以用于各种应用，例如视频监控、远程教育、视频会议等。
RTSP 是一种基于文本的协议，它使用 TCP 或 UDP 进行传输。RTSP 工作在应用层，它使用 RTP/RTCP 协议来传输音视频数据。
RTSP 的主要特点包括：
- 实时性：RTSP 可以实时传输音视频数据，因此可以用于视频监控、远程教育等实时应用。
- 可靠性：RTSP 使用 TCP 或 UDP 进行传输，因此可以保证数据的可靠性。
- 可扩展性：RTSP 可以扩展到支持多种音视频格式和传输协议。
RTSP 的工作原理如下：
- 客户端向服务器发送一个 RTSP OPTIONS 请求，以获取服务器支持的功能。
- 服务器向客户端发送一个 RTSP OPTIONS 响应，列出服务器支持的功能。
- 客户端向服务器发送一个 RTSP DESCRIBE 请求，以获取媒体流的描述信息。
- 服务器向客户端发送一个 RTSP DESCRIBE 响应，包含媒体流的描述信息。
- 客户端向服务器发送一个 RTSP SETUP 请求，以建立媒体流的传输会话。
- 服务器向客户端发送一个 RTSP SETUP 响应，表示媒体流的传输会话已经建立。
- 服务器开始向客户端发送媒体流数据。
- 客户端接收媒体流数据并播放。
RTSP 的常见应用场景包括：
- 视频监控：RTSP 可以用于视频监控系统，实时传输监控摄像头的视频数据。
- 远程教育：RTSP 可以用于远程教育系统，实时传输课堂教学的视频数据。
- 视频会议：RTSP 可以用于视频会议系统，实时传输参会者的视频数据。
海康威视通过RTSP获取视频流的方式
海康威视的摄像头通常支持通过RTSP（Real Time Streaming Protocol）获取视频流。以下是通过RTSP获取海康威视摄像头视频流的一般步骤：
- 确定RTSP URL格式：
- 海康威视的RTSP URL通常遵循一定的格式，例如：rtsp://[username]:[password]@[camera-ip-address]:[port]/h264/ch1/main/av_stream
- 其中，username 和 password 是摄像头的登录凭据，camera-ip-address 是摄像头的IP地址，port 是RTSP服务的端口号（通常为554），/h264/ch1/main/av_stream 是视频流的具体路径。
- 设置摄像头：
- 登录到摄像头的Web界面，找到视频流相关的设置选项。
- 启用RTSP服务，并设置相应的传输协议（TCP/UDP）和端口号（如果默认端口554未被修改，则无需更改）。
- 构建RTSP URL：
- 根据你的摄像头设置和所需的视频流类型（主码流或子码流），构建正确的RTSP URL。
- 例如，如果你的摄像头IP是192.168.1.64，用户名是admin，密码是12345，你想要获取主码流，那么RTSP URL将是：rtsp://admin:12345@192.168.1.64:554/h264/ch1/main/av_stream
- 使用媒体播放器测试：
- 在尝试集成到Vue项目之前，首先使用媒体播放器（如VLC或EasyPlayer）测试RTSP URL是否能够正确获取视频流。
- 将RTSP URL粘贴到媒体播放器的网络流地址栏中，并尝试播放。
- 集成到Vue项目中：
- 由于浏览器通常不直接支持RTSP，你可能需要将RTSP流转换为HLS或WebRTC等浏览器兼容的格式。
- 使用媒体服务器软件（如Wowza、Kurento、Janus等）进行转换。
- 在Vue项目中，你可以使用<video>标签或第三方库（如Video.js、Hls.js等）来播放视频流。
- 安全性和隐私性：
- 请确保采取适当的安全措施来保护你的视频流，例如使用HTTPS、加密和身份验证等。
- 不要将RTSP流直接暴露在互联网上，而是将其限制在安全的内部网络中，并通过VPN或其他安全方式进行远程访问（如果需要的话）。
- 根据上述描述， 结合你的摄像头设备， 获取 Rtsp 视频地址。 比如： rtsp://admin:12345@192.168.1.64:554/h264/ch1/main/av_stream(后面这一串基本是固定)， 你知道知道你设备登录的 用户名， 密码， IP地址， 端口号，就可以拼接出该地址。
操作步骤
通过vlc检查rtsp视频流是否可用
此处为语雀图册卡片，点击链接查看：
https://www.yuque.com/clean-pfi5o/kg4uhy/seslxg24moabpiyg#lqxrb
点击串流， vlc 软件能正常播放视频即可。
本地下载ffmpeg软件，并配置到path目录中
ffmpeg下载，加压到你的系统中
ffmpeg-6.1.1-full_build.7z
将ffmpeg软件的bin目录配置到系统path路径
此处为语雀图册卡片，点击链接查看：
https://www.yuque.com/clean-pfi5o/kg4uhy/seslxg24moabpiyg#AWXDR
本地安装Node.js
参考:
https://blog.csdn.net/redrose2100/article/details/121675915
下载jsmpeg.min.js
jsmpeg.min.js
编写Server.js代码
const Stream = require("node-rtsp-stream");
new Stream({
name: "camera3",
streamUrl: "rtsp://username:password@192.168.3.xxx:554/h264/ch1/main/av_stream",
wsPort: 10023,
ffmpegOptions: {
'-stats': '',
'-r': 20,
'-s': '1280 720'
},
});
编写客户端html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script src="./jsmpeg.min.js"></script>
</head>
<body>
<canvas id="canvas"></canvas>
<script>
const canvas = document.querySelector("#canvas");
new JSMpeg.Player("ws://localhost:10023", { canvas });
</script>
</body>
</html>代码总目录结构
hello.rar
运行代码
安装Node依赖
npm i node-rtsp-stream运行server端，进行转码
出现次效果，证明已经在成功转码。
双击Html运行查看视频效果
只要写的 rtps 地址是对的， 应该可以在浏览器中，正常播放视频。 我亲测可以。
写在最后
这种方式是将Rtsp格式的视频流转换成ws://(websocket,我们使用的海康威视摄像头不支持websocket取流)格式的视频流。 然后通过 JSMpeg播放器配合h5的canvas标签使用。 就视频转流来讲，是成功的。 而且ws://格式的视频流， 前端有不少支持方案。
但是，现在摄像头都带有云台(控制摄像头上下左右移动)， 语音对讲等功能， 依然需要探索。
参考:
https://zhuanlan.zhihu.com/p/654675504?utm_id=0
https://juejin.cn/post/7221858081485963324
相关推荐
- MySQL慢查询优化:从explain到索引，DBA手把手教你提升10倍性能
-
数据库性能是应用系统的生命线，而慢查询就像隐藏在系统中的定时炸弹。某电商平台曾因一条未优化的SQL导致订单系统响应时间从200ms飙升至8秒，最终引发用户投诉和订单流失。今天我们就来系统学习MySQL...
- 一文读懂SQL五大操作类别(DDL/DML/DQL/DCL/TCL)的基础语法
-
在SQL中，DDL、DML、DQL、DCL、TCL是按操作类型划分的五大核心语言类别，缩写及简介如下：DDL（DataDefinitionLanguage，数据定义语言）：用于定义和管理数据库结构...
- 闲来无事，学学Mysql增、删，改，查
-
Mysql增、删，改，查1“增”——添加数据1.1为表中所有字段添加数据1.1.1INSERT语句中指定所有字段名语法：INSERTINTO表名（字段名1，字段名2，…）VALUES（值1...
- 数据库:MySQL 高性能优化规范建议
-
数据库命令规范所有数据库对象名称必须使用小写字母并用下划线分割所有数据库对象名称禁止使用MySQL保留关键字（如果表名中包含关键字查询时，需要将其用单引号括起来）数据库对象的命名要能做到见名识意，...
- 下载工具合集_下载工具手机版
-
迅雷，在国内的下载地位还是很难撼动的，所需要用到的地方还挺多。缺点就是不开会员，软件会限速。EagleGet，全能下载管理器，支持HTTP(S)FTPMMSRTSP协议，也可以使用浏览器扩展检测...
- mediamtx v1.15.2 更新详解:功能优化与问题修复
-
mediamtxv1.15.2已于2025年10月14日发布，本次更新在功能、性能优化以及问题修复方面带来了多项改进，同时也更新了部分依赖库并提升了安全性。以下为本次更新的详细内容：...
- 声学成像仪:泄露监测 “雷达” 方案开启精准防控
-
声学成像仪背景将声像图与阵列上配装的摄像实所拍的视频图像以透明的方式叠合在一起，就形成了可直观分析被测物产生状态。这种利用声学、电子学和信息处理等技术，变换成人眼可见的图像的技术可以帮助人们直观地认识...
- 最稳存储方案:两种方法将摄像头接入威联通Qu405，录像不再丢失
-
今年我家至少被4位邻居敲门，就是为了查监控！！！原因是小区内部监控很早就停止维护了，半夜老有小黄毛掰车门偷东西，还有闲的没事划车的，车主损失不小，我家很早就配备监控了，人来亮灯有一定威慑力，不过监控设...
- 离岗检测算法_离岗检查内容
-
一、研发背景如今社会许多岗位是严禁随意脱离岗位的，如塔台、保安室、监狱狱警监控室等等，因为此类行为可能会引起重大事故，而此类岗位监督管理又有一定困难，因此促生了智能视频识别系统的出现。二、产品概述及工...
- 消防安全通道占用检测报警系统_消防安全通道占用检测报警系统的作用
-
一、产品概述科缔欧消防安全通道占用检测报警系统，是创新行业智能监督管理方式、完善监管部门动态监控及预警预报体系的信息化手段，是实现平台远程监控由“人为监控”向“智能监控”转变的必要手段。产品致力于设...
- 外出住酒店、民宿如何使用手机检测隐藏的监控摄像头
-
最近，一个家庭在他们的民宿收到了一个大惊喜：客厅里有一个伪装成烟雾探测器的隐藏摄像头，监视着他们的一举一动。隐藏摄像头的存在如果您住在酒店或民宿，隐藏摄像头不应再是您的担忧。对于民宿，房东应报告所有可...
- 基于Tilera众核平台的流媒体流量发生系统的设计
-
曾帅，高宗彬，赵国锋（重庆邮电大学通信与信息工程学院，重庆400065）摘要：设计了一种基于Tilera众核平台高强度的流媒体流量发生系统架构，其主要包括：系统界面管理模块、服务承载模块和流媒体...
- 使用ffmpeg将rtsp流转流实现h5端播放
-
1.主要实现rtsp转tcp协议视频流播放ffmpeg下载安装（公认业界视频处理大佬）a、官网地址：www.ffmpeg.org/b、gitHub：github.com/FFmpeg/FFmp…c、推...
- 将摄像头视频流从Rtsp协议转为websocket协议
-
写在前面很多通过摄像头拿到的视频流格式都是Rtsp协议的，比如：海康威视摄像头。在现代的浏览器中，已经不支持直接播放Rtsp视频流，而且，海康威视提供的本身的webSdk3.3.0视频插件有很多...
- 华芸科技推出安全监控中心2.1 Beta测试版
-
全球独家支持hdmi在线实时监看摄像机画面，具单一、循环或同时监看四频道视频影像，可透过华芸专用红外线遥控器、airemote或是键盘鼠标进行操作，提供摄像机频道增购服务，满足用户弹性扩增频道需...
- 一周热门
- 最近发表
- 标签列表
-
- python判断字典是否为空 (50)
- crontab每周一执行 (48)
- aes和des区别 (43)
- bash脚本和shell脚本的区别 (35)
- canvas库 (33)
- dataframe筛选满足条件的行 (35)
- gitlab日志 (33)
- lua xpcall (36)
- blob转json (33)
- python判断是否在列表中 (34)
- python html转pdf (36)
- 安装指定版本npm (37)
- idea搜索jar包内容 (33)
- css鼠标悬停出现隐藏的文字 (34)
- linux nacos启动命令 (33)
- gitlab 日志 (36)
- adb pull (37)
- python判断元素在不在列表里 (34)
- python 字典删除元素 (34)
- vscode切换git分支 (35)
- python bytes转16进制 (35)
- grep前后几行 (34)
- hashmap转list (35)
- c++ 字符串查找 (35)
- mysql刷新权限 (34)