一、ffmpeg安装
官网地址:http://ffmpeg.org
安装包下载地址:https://ffmpeg.org/releases/
1、下载安装包并解压
wget http://ffmpeg.org/releases/ffmpeg-4.1.tar.gz
tar -xf ffmpeg-4.1.tar.gz
2、安装依赖
yum install -y nasm
如果不提前安装在 ./configure
会报以下错误
3、编译安装ffmpeg
./configure --prefix=/usr/local/ffmpeg
make
make install
4、添加环境变量
export PATH=/usr/local/ffmpeg/bin:$PATH
二、nginx安装
1、安装依赖
yum install -y pcre-devel
2、下载安装包,并编译安装
wget https://nginx.org/download/nginx-1.20.2.tar.gz
unzip nginx-1.20.2.tar.gz
cd nginx-1.20.2
./configure --user=root --group=root --prefix=/usr/local/nginx --with-file-aio --with-pcre --with-http_realip_module --with-http_stub_status_module --with-http_gzip_static_module --with-http_ssl_module --with-stream
make
make install
3、nginx相关配置
修改配置文件:nginx/conf/nginx.conf
在http --> server下增加:
location /hls {
#若nginx\conf\mime.types中没有配置如下type,请加上,或直接在mime.types加
types {
#application/x-mpegURL m3u8;
application/vnd.apple.mpegurl m3u8 ;
video/mp2t ts ;
}
root /home/wwwroot/ffmpeg;
add_header Cache-Control no-cache ;
add_header Access-Control-Allow-Origin *;
}
三、ffmpeg命令行转流
/usr/local/ffmpeg/bin/ffmpeg -i "rtsp://chgry:chgry888@192.168.16.219:554/h264/sub/av_stream" -c copy -f hls -hls_time 3.0 -hls_list_size 2 -hls_wrap 1200 /home/wwwroot/ffmpeg/hls/test.m3u8
其中: /home/wwwroot/ffmpeg/hls/test.m3u8
是对应nginx.conf
配置中的hls访问路径 /hls
ffmpeg 关于hls方面的指令说明:
-hls_time n: 设置每片的长度,默认值为2。单位为秒
-hls_list_size n:设置播放列表保存的最多条目,设置为0会保存有所片信息,默认值为5
-hls_wrap n:设置多少片之后开始覆盖,如果设置为0则不会覆盖,默认值为0.这个选项能够避免在磁盘上存储过多的片,而且能够限制写入磁盘的最多的片的数量
-hls_start_number n:设置播放列表中sequence number的值为number,默认值为0
备注:
①现在最新新版中hls_wrap
参数已经没有了,用 hls_flags
参数替代
②ffmpeg用法 https://zhuanlan.zhihu.com/p/268200552
③ 目前我们生产所用的示例 ffmpeg -i "rtsp://username:passwd@192.168.16.219:554/Streaming/Channels/1001" -c copy -f hls -hls_time 3.0 -hls_list_size 2 -hls_wrap 28800 ${src}/rawMaterialFeeding.m3u8 > ${src}/logs/rawMaterialFeeding.out
,数据是保留1天
四、HTML通过H5播放
浏览器播放m3u8文件,这里使用video.js插件,下载地址: http://www.jq22.com/jquery-info404
1、下载demo示例,并配置
wget http://www.jq22.com//jquery/jQueryVideo.js7.10.2.zip
unzip jQueryVideo.js7.10.2.zip
cp -a vide7.10.2/* /home/wwwroot/ffmpeg/
##修改 /home/wwwroot/ffmpeg/index.html 文件
源内容
<video id="my-video" class="video-js" controls preload="auto" width="960" height="400"
poster="m.jpg" data-setup="{}">
<source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
<source src="http://vjs.zencdn.net/v/oceans.webm" type="video/webm">
<source src="http://vjs.zencdn.net/v/oceans.ogv" type="video/ogg">
<p class="vjs-no-js"> To view this video please enable JavaScript, and consider upgrading to a web browser that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a> </p>
</video>
修改后内容
<video id="my-video" class="video-js" controls preload="auto" width="960" height="400"
poster="m.jpg" data-setup="{}">
<source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
<!-- <source src="http://vjs.zencdn.net/v/oceans.webm" type="video/webm">
<source src="/hls/canning.m3u8" type="application/x-mpegURL"> 这个是我们生产环境目前用的(把摄像头监控的数据转换为m3u8格式的数据流)
<source src="http://vjs.zencdn.net/v/oceans.ogv" type="video/ogg"> -->
<p class="vjs-no-js"> To view this video please enable JavaScript, and consider upgrading to a web browser that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a> </p>
</video>
2、浏览器打开index.html。点击开始播放,即可看到效果。