使用ffmpeg将rtsp流转流实现h5端播放

素颜马尾好姑娘i 2023-10-12 20:45 17阅读 0赞

主要实现rtsp转tcp协议视频流播放

ffmpeg下载安装（公认业界视频处理大佬）  
a、官网地址：www.ffmpeg.org/  
b、gitHub：github.com/FFmpeg/FFmp…  
c、推荐下载地址：ffmpeg.zeranoe.com/builds/ (选择如下图)  
![1536e5c4d02a4b5485b37d4ac875741a.png][]

2.配置[ffmpeg][]环境变量：

a、解压缩上一步的ffmpeg文件  
b、配置环境变量，把ffmpeg下的bin配置到系统path变量里面，根据自己不同的路径配置 如下图 ：（如何配置环境变量可自行百度）

![f9764e8809f9431e9407d5d376089baa.png][]

c、检测ffmpeg是否配置成功：配置之后控制台输入ffmpeg出现下面的文字说明安装正确，否则请自行百度![f217f2728f44448ca166911872539c12.png][]

3.Node.js安装：nodejs.org/zh-cn/ 官网下载后直接下一步下一步……（自行百度）

4. 下载livertsp（运行主程序）到本地： gitee.com/Anan\_ct/liv…

5.在项目中安装ws包：在vscode打开 livertsp -> 在终端中打开 -> 执行:

npm i ws

6.在vscode打开 livertsp -> 在终端中打开 -> 执行:

node websocket-anan.js anankey 8081 8082

（即：在node中执行websocket-anan.js文件）

6.1说明：

anankey 是密码

8081 是ffmpeg推送端口

8082 是前端webSocket端口

出现下图结果则表示成功：

![300753c031d740bfbadc8516a81b16e7.png][]

7.上述进程不要停止：运行ffmpeg

在cmd执行下面的代码：（一定要注意这里不能出错）

ffmpeg -rtsp_transport tcp -i "你的rtspurl" -q 0 -f mpegts -codec:v mpeg1video -s 1366x768 http://127.0.0.1:8081/anankey

出现下面的文字（最后一行在不断解析）说明运行正确![91601e33023249f6bc9fa4566be4ee71.png][]

7.在vscode 里运行 livertsp 中的 anan-view.html 即可看见实时监控视频 （建议使用 Live Server插件打开 不然会出错 ）

![3252f4c4821047df96cad360bec7780a.png][]

[1536e5c4d02a4b5485b37d4ac875741a.png]: https://img-blog.csdnimg.cn/1536e5c4d02a4b5485b37d4ac875741a.png
[ffmpeg]: https://so.csdn.net/so/search?q=ffmpeg&spm=1001.2101.3001.7020
[f9764e8809f9431e9407d5d376089baa.png]: https://img-blog.csdnimg.cn/f9764e8809f9431e9407d5d376089baa.png
[f217f2728f44448ca166911872539c12.png]: https://img-blog.csdnimg.cn/f217f2728f44448ca166911872539c12.png
[300753c031d740bfbadc8516a81b16e7.png]: https://img-blog.csdnimg.cn/300753c031d740bfbadc8516a81b16e7.png
[91601e33023249f6bc9fa4566be4ee71.png]: https://img-blog.csdnimg.cn/91601e33023249f6bc9fa4566be4ee71.png
[3252f4c4821047df96cad360bec7780a.png]: https://img-blog.csdnimg.cn/3252f4c4821047df96cad360bec7780a.png