使用FFmpeg+Nodejs+JSMpeg实现rtsp视频流在web播放

1,548 阅读1分钟

一、Rtsp

简单来说就是一种实时视频流协议,不能直接在浏览器上播放,因此需要借助工具使其能够在浏览器上播放。

二、方案

FFmpeg+Nodejs+JSMpeg

FFmpeg:rtsp流转码工具,下载地址:ffmpeg.org/download.ht… ,下载好之后配置环境

JSMpeg:前端解码插件

三、原理

0627e26a885e9eb0b029cd15c654d72.png

大致流程:

先借助FFmpeg转码工具,把rtsp流转换为MPEG-TS流,然后推流到http服务,再通过websocket转发流到前端,最后前端使用JSMpeg插件解码来播放视频

1、ffmpeg转码 image.png image.png

2、http服务器监听 image.png

3、websocket转发 image.png

4、JSMpeg解码播放 image.png

细节方面

node服务端:

1.使用了express框架,方便处理静态资源、路由和接口参数处理等;

2.将http与websocket合并在一起,只使用一个端口;

四、PM2进程守护

安装PM2,让其管理服务

五、已有功能

1.实时播放;

2.视频回放;

3.视频下载;

4.视频暂停与播放

六、优势与缺点

优势:

1.延迟小,如果不算网络延迟,延迟大概在1-3s;

2.不需要安装任何插件;

3.多个客户端可以同时使用

缺点

1.一个客户端同时只能播放一路视频;

2.频繁切换视频源会出现WebGL的警告;

3.视频没有声音;

七、项目地址

github.com/xiaosen125/…

参考文章:

juejin.cn/post/684490…