将mp4视频推流rtsp,并转为http直播流,在前端显示

最近有个需求,在vue页面的video组件播放直播流,本来想用flv.js,但是必须要flv格式才行,所以还是用原生video播放http直播流。

1. 将本地mp4推流rtsp

  1. 下载并解压EasyDarwin,双击EasyDarwin.exe运行,在控制台可以看到开启了两个服务,一个是rtsp服务端,一个是http服务。访问http://localhost:10008可以进入EasyDarwin的管理页面,之后会用到。另外一个就是rtsp服务,默认端口是554。
  2. 下载FFmpeg并解压,打开cmd,进入到FFmpeg的bin路径下,输入以下命令进行推流
.\ffmpeg -re -stream_loop -1 -i ../videos/1.mp4 -vcodec copy -codec copy -f rtsp rtsp://127.0.0.1:554/video
  1. 开始推流后,可以在EasyDarwin管理页面看到有推流
    在这里插入图片描述

2. 使用 VLC Media Player将rtsp转为http流

将mp4视频推流rtsp,并转为http直播流,在前端显示_第1张图片
将mp4视频推流rtsp,并转为http直播流,在前端显示_第2张图片
将mp4视频推流rtsp,并转为http直播流,在前端显示_第3张图片
将mp4视频推流rtsp,并转为http直播流,在前端显示_第4张图片
将mp4视频推流rtsp,并转为http直播流,在前端显示_第5张图片
将mp4视频推流rtsp,并转为http直播流,在前端显示_第6张图片
转换完以后不要关闭此应用,http://localhost:8888/123即为转换后的直播流地址,可直接在VLC中播放,也可以在html标签中播放
将mp4视频推流rtsp,并转为http直播流,在前端显示_第7张图片
将mp4视频推流rtsp,并转为http直播流,在前端显示_第8张图片

你可能感兴趣的:(web开发,前端,ffmpeg,vue)