nodejs将rtsp视频流打上水印后通过websocket发送给前端

网上有把rtsp流通过websocket发送到前端的方法,就是用rtspStream,具体代码如下:

javascript 复制代码
var stream = require('node-rtsp-stream')
stream = new stream({
  name: 'name',
  streamUrl: 'rtsp://xxxxx',
  wsPort: 9999,
})

我们还需要给视频加上水印,比如我需要给视频进行画框,可以采用ffmpeg来进行画框

ffmpeg的代码如下

javascript 复制代码
ffmpeg -i ${rtspUrl} -vf "drawbox=${watermarkX}:${watermarkY}:${watermarkWidth}:${watermarkHeight}:red@0.5" 

你可以使用ffplay试播放一下

javascript 复制代码
ffplay -i ${rtspUrl} -vf "drawbox=${watermarkX}:${watermarkY}:${watermarkWidth}:${watermarkHeight}:red@0.5"

但是如果将ffmpeg的这个代码推至留一个rtsp流中就会报错,而且报错没有报错信息,只有一些奇怪的东西报错上来(目前还不知道原因,如果知道了原因会补上)

javascript 复制代码
ffmpeg -i ${rtspUrl} -vf "drawbox=${watermarkX}:${watermarkY}:${watermarkWidth}:${watermarkHeight}:red@0.5" -f rtsp rtsp://localhost:8554/output

stderr: Input #0, rtsp, from 'rtsp://admin:shuju12345@192.168.120.201:554/Streaming/Channels/101':

Metadata:

title : Media Presentation

Duration: N/A, start: 0.040000, bitrate: N/A

stderr: Stream #0:0: Video: hevc (Main), yuv420p(tv), 1920x1080, 25 fps, 25 tbr, 90k tbn

stderr: Stream mapping:

Stream #0:0 -> #0:0 (hevc (native) -> mpeg4 (native))

后来在网上找了很多办法,最后发现可以在rtspstream里面使用ffmpeg,不用再新建一条rtsp流,代码如下:

javascript 复制代码
stream = new stream({
  name: 'name',
  streamUrl: 'rtsp://xxx',
  wsPort: 9999,
  ffmpegOptions: { // options ffmpeg flags
    '-stats': '', // 没有必要值的选项使用空字符串
    '-vf': `drawbox=${watermarkX}:${watermarkY}:${watermarkWidth}:${watermarkHeight}:red@0.5`,
    '-s': '1920*1080', // 视频窗口大小 1920*1080 或 2560*1920
    '-r': 25, // 视频帧率
  }
})

这样就可以在传输的过程中直接绘制图形。

相关推荐
梦帮科技3 小时前
GRAVIS v4.0:基于Web的极速套利架构设计与实时数据流实现
前端·人工智能·rust·自动化·区块链·智能合约·数字货币
爱勇宝3 小时前
办公资料反复修改、补传、交接混乱,我做了个桌面工具来解决这件事
前端·后端·程序员
微信开发api-视频号协议4 小时前
企业微信外部群开发自动化实践过程
java·前端·微信·自动化·企业微信·ipad
甲维斯4 小时前
Fable5:20美金的顶级设计师!
前端·人工智能
kyriewen4 小时前
我同时用了 Claude Code、Cursor 和 Codex,说说三个工具的真实差距——2026 年选错工具比不用 AI 更浪费时间
前端·ai编程·claude
Jackson__5 小时前
为了拯救我的腰椎和颈椎,我做了款浏览器插件!
前端·javascript·开源
闲猫5 小时前
Python FastAPI + SQLAlchemy 入门教程:从零搭建你的第一个 Web 应用
前端·python·fastapi
HelloWorld工程师5 小时前
新手如何快速申请SSL通配符证书...
网络协议·https·ssl
林小帅5 小时前
NestJS v11 + Prisma v7 ESM 迁移配置解析
前端·javascript·后端
IT_陈寒5 小时前
React的setState竟然不是立刻生效的,害我调试半天
前端·人工智能·后端