当前位置： 首页 > news >正文

EasyMedia播放rtsprtmp视频流（flvhls）

news 2024/12/4 17:15:07

学习链接

MisterZhang/EasyMedia - gitee地址

EasyMedia转码rtsp视频流flv格式，hls格式，H5页面播放flv流视频

EasyMedia播放rtsp视频流（vue2、vue3皆可用）

EasyMedia转码rtsp视频流flv格式，hls格式，H5页面播放flv流视频

flv.js直播点播，播放flv视频时快进、重连、卡死、延迟等问题

banmajio/RTSPtoHTTP-FLV - gitee 使用JavaCV开发的rtsp流转http-flv(rtmp也支持但不建议)流并进行推流的流媒体服务

Java中使用FFmpeg拉取RTSP流

[webrtc-streamer]

  • 史上最详细的webrtc-streamer访问摄像机视频流教程
  • vue实现rtsp视频流浏览器实时播放
  • VUE3 播放RTSP实时、回放(NVR录像机)视频流（使用webrtc-streamer）
  • vue项目中播放rtsp视频流

文章目录

  • 学习链接
  • 介绍
  • 步骤
    • easydarwin启动rtsp服务，ffmpeg推送摄像头（模拟rtsp视频流）
    • nginx添加rtmp支持模块，obs推送本地桌面（模拟rtmp视频流）
    • 启动EasyMedia
    • 添加流
    • 效果
      • 演示FLV
      • testFlv.html
      • testFlv2.html
      • 演示hls
  • EasyMedia文档
    • 如何运行
      • flv播放
      • hls播放
      • 参数使用
      • 页面功能
      • restful api
      • 云台功能

介绍

Springboot、netty实现的http-flv、websocket-flv直播点播，支持rtsp、h264、h265、rtmp等多种源，h5纯js播放（不依赖flash），不需要nginx等第三方拉流服务，低延迟（支持识别h264、aac编码自动转封装）

步骤

首先，浏览器无法直接播放rtsp或rtmp格式的视频流，就比如之前 nginx搭建直播推流服务中，我们通过obs把流推送到nginx的rtmp服务，此时可以通过vlc直接通过rtmp的url链接直接播放rtmp视频流，但是浏览器不能直接使用这个rtmp的url链接，因此就通过nginx的rtmp模块插件配置到http服务开启flv_live，这样浏览器就访问这个http服务来播放视频了。

因此，要在浏览器播放rtmp和rtsp视频流，需要对这些视频流做转换。java提供了javacv库可以做到这个，easyMedia使用了这个实现流媒体播放。

easydarwin启动rtsp服务，ffmpeg推送摄像头（模拟rtsp视频流）

启动easydarwin，可以参考：EasyDarwin搭建直播推流服务，注意到rtsp服务端口是10054
在这里插入图片描述
把摄像头捕捉的视频推过去

ffmpeg -f dshow -i video="Integrated Camera" -vcodec libx264 -preset:v ultrafast -tune:v zerolatency -rtsp_transport tcp -f rtsp rtsp://127.0.0.1:10054/test

在这里插入图片描述
此时可以通过vlc打开此流查看是否能够正常查看到视频 rtsp://127.0.0.1:10054/test
在这里插入图片描述

nginx添加rtmp支持模块，obs推送本地桌面（模拟rtmp视频流）

nginx添加rtmp支持模块参考：nginx搭建直播推流服务

obs设置推送目的地，在来源添加显示器采集

在这里插入图片描述
在这里插入图片描述
同样通过vlc查看是否推送成功，rtmp://192.168.134.3:8002/flv/test
在这里插入图片描述

启动EasyMedia

拉下easymedia的代码，本地启动

...
--------------------------------------------------------- EasyMedia is running! Access address: media port at : 	 8866 http port at : 	 8888 web Local: 	 http://localhost:8888 web External: 	 http://192.168.134.5:8888 httpflv: 	 http://192.168.134.5:8866/live?url={您的源地址} wsflv: 	 ws://192.168.134.5:8866/live?url={您的源地址} hls(m3u8): 	 http://192.168.134.5:8888/hls?url={您的源地址} h2-database: 	 http://192.168.134.5:8888/h2-console 
---------------------------------------------------------

添加流

在这里插入图片描述

效果

演示FLV

点击四分屏，选择1个屏，然后选择流，点击播放。
在这里插入图片描述

  • ws://localhost:8866/live?url=rtsp://127.0.0.1:10054/test
  • ws://localhost:8866/live?url=rtmp://192.168.134.3:8002/flv/test
    在这里插入图片描述
  • 把桌面和本地文件配置上去
    在这里插入图片描述

testFlv.html

访问：localhost:8888/testFlv.html

在这里插入图片描述
testFlv.html是项目中已经存在的文件

<!DOCTYPE html>
<html><head><meta charset="utf-8"><meta name=viewport content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,minimal-ui"><meta name="referrer" content="no-referrer"><title>xgplayer</title><style type="text/css">html, body {width:100%;height:100%;margin:auto;overflow: hidden;}</style></head><body><div id="mse"></div><script src="//cdn.jsdelivr.net/npm/xgplayer@1.1.4/browser/index.js" charset="utf-8"></script><script src="//cdn.jsdelivr.net/npm/xgplayer-flv.js/browser/index.js" charset="utf-8"></script><script>let player = new FlvJsPlayer({"id": "mse","playsinline": true,"whitelist": [""],"url": "ws://localhost:8866/live?url=rtsp://127.0.0.1:10054/test"});</script></body>
</html>

testFlv2.html

访问：localhost:8888/testFlv2.html
在这里插入图片描述

在static目录下新建testFlv2.html，验证是否可以播放

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>FLV Stream Player</title><script src="https://cdnjs.cloudflare.com/ajax/libs/flv.js/1.5.0/flv.min.js"></script>
</head>
<body><video id="videoElement" controls></video><script>if (flvjs.isSupported()) {var videoElement = document.getElementById('videoElement');var flvPlayer = flvjs.createPlayer({type: 'flv',url: 'http://localhost:8866/live?url=rtsp://127.0.0.1:10054/test'});flvPlayer.attachMediaElement(videoElement);flvPlayer.load();flvPlayer.play();}</script>
</body>
</html>

演示hls

首先，点击开启切片，会发出这个请求：http://localhost:8888/startHls?url=rtsp:%2F%2F127.0.0.1:10054%2Ftest，后台执行命令：C:\Users\zzhua195\.javacpp\cache\ffmpeg-4.4-1.5.6-windows-x86_64.jar\org\bytedeco\ffmpeg\windows-x86_64\ffmpeg.exe -i rtsp://127.0.0.1:10054/test -r 25 -g 25 -c:v libopenh264 -c:a aac -f hls -hls_list_size 1 -hls_wrap 6 -hls_time 1 -hls_base_url /ts/c9b5fc1f5dabc7615e14c901028fc0fb/ -method put http://localhost:8888/record/c9b5fc1f5dabc7615e14c901028fc0fb/out.m3u8
在这里插入图片描述
可以看到一直请求http://localhost:8888/hls?url=rtsp://127.0.0.1:10054/test，请求返回的是m3u8内容。然后请求对应的ts文件。
在这里插入图片描述

EasyMedia文档

如何运行

java -jar EasyMedia-0.0.1-SNAPSHOT.jar
还可以这样改端口
java -jar -Dserver.port=页面端口 -Dmediaserver.port=媒体端口 EasyMedia-0.0.1-SNAPSHOT.jar

flv播放

#播放url规则，easymedia启动后，直接将此链接用flv播放器就能放
http://localhost:8866/live?url={您的源地址}
ws://localhost:8866/live?url={您的源地址}例如rtsp：
http://localhost:8866/live?url=rtsp://admin:VZCDOY@192.168.2.84:554/Streaming/Channels/102
ws://localhost:8866/live?url=rtsp://admin:VZCDOY@192.168.2.84:554/Streaming/Channels/102本地文件（支持格式参照ffmpeg支持的格式）：
http://localhost:8866/live?url=d:/flv/testVideo.mp4
ws://localhost:8866/live?url=d:/flv/testVideo.mp4电脑桌面投影（url改成desktop即可）：
http://localhost:8866/live?url=desktop
ws://localhost:8866/live?url=desktop

hls播放

#用hls播放器播放，必须要通过页面或者api开启切片后才能放，这功能是最近新增内容，后期会做优化
# （支持hls内存切片（不占用本地磁盘，只占用网络资源））
#注意此处是http端口8888，后期将统一使用媒体端口
http://localhost:8888/hls?url={您的源地址}

参数使用

#参数
autoClose=false（无人观看一分钟后自动关闭推流，默认true开启自动关闭，false不关闭）
ffmpeg=true （true为强制使用ffmpeg，否则默认使用javacv）#永久播放
http://localhost:8866/live?url=rtsp://admin:VZCDOY@192.168.2.84:554/Streaming/Channels/102&&&autoClose=false
ws://localhost:8866/live?url=rtsp://admin:VZCDOY@192.168.2.84:554/Streaming/Channels/102&&&autoClose=false#ffmpeg方式推流（遇到不支持的流可以使用此参数，强制使用ffmpeg）
http://localhost:8866/live?url=rtsp://admin:VZCDOY@192.168.2.84:554/Streaming/Channels/102&&&ffmpeg=true
ws://localhost:8866/live?url=rtsp://admin:VZCDOY@192.168.2.84:554/Streaming/Channels/102&&&ffmpeg=true#可以多个参数一起，只需参数前面增加&&&
http://localhost:8866/live?url=rtsp://admin:VZCDOY@192.168.2.84:554/Streaming/Channels/102&&&autoClose=false&&&ffmpeg=true
ws://localhost:8866/live?url=rtsp://admin:VZCDOY@192.168.2.84:554/Streaming/Channels/102&&&autoClose=false&&&ffmpeg=true

页面功能

访问 http://localhost:8888

restful api

新增流 http://localhost:8888/add?url={您的源地址}&remark={备注}
停止并删除 http://localhost:8888/del?url={您的源地址}
停止flv推流 http://localhost:8888/stop?url={您的源地址}
开启flv推流 http://localhost:8888/start?url={您的源地址}
开启hls切片 http://localhost:8888/startHls?url={您的源地址}
停止hls切片 http://localhost:8888/stopHls?url={您的源地址}
查看保存的流 http://localhost:8888/list

云台功能

目前支持海康相机，大华待更新
http://localhost:8888/hk/ctrl?ip=192.168.2.120&op=left&username=admin&password=VZCDOY
ip 相机ip
op 操作，up、down、left、right、left_up、left_down、right_up、right_down、big、small
username 相机用户名
password 相机密码
port 控制端口（可不传）

http://www.mrgr.cn/news/78880.html

相关文章：

  • SOA、分布式、微服务之间的关系和区别？
  • DM-VIO（ROS）+t265配置运行记录（ubuntu18.04+ros melodic）
  • 我们项目要升级到flutter架构的几点原因
  • Cannot resolve symbol ‘ActivityThread‘ | Android 语法
  • MacBook上安装 Windows 10 后，System 进程 CPU 占用 100% 的问题
  • 如何手搓一个智能宠物喂食器
  • 运输层总结
  • Win10+Ubuntu20.04双系统重装Ubuntu22.04单系统
  • Hive学习基本概念
  • 在全志 T113-S3 开发板上运行 AWTK
  • Rust : 生成日历管理markdown文件的小工具
  • 人体热释电传感器
  • 从最浅层剖析C语言————第六节（深入了解数组传参、嵌套调用以及链式访问）
  • 2024.12.2工作复盘
  • yolov10 获取误检，漏检
  • shell编程（4）脚本与用户交互以及if条件判断
  • 初识一维和二维数组
  • 编译器优化技术
  • AI-学习路线图-PyTorch
  • NuHertz/HFSS： 使用矩形、径向和阻抗短截线的平面 LPF 切比雪夫-II 实现
  • 公专业务能力
  • 【C语言】结构体（二）
  • Hot100 - 二叉树的中序遍历
  • 利用市场分析工具对特定国家的产品市场情况进行深入分析的全面指南
  • 无需U盘引导！快速在实体机上安装黑群晖 DSM 7.2（一步到位！黑群晖 DSM 7.2 内置硬盘引导安装教程）
  • Kafka-Connect自带示例