原址： https://www.cnblogs.com/cnsanshao/p/6370938.html
另外： vlc播放器能播放rtsp协议
nginx安装和配置
模块下载
https://github.com/arut/nginx-rtmp-module
nginx编译参数 ./configure --user="www" --group="www" --prefix=/opt/nginx --with-http_stub_status_module --with-http_ssl_module --with-http_flv_module --with-http_gzip_static_module --with-pcre=/opt/tools/pcre-8.36 --add-module=/opt/tools/echo-nginx-module-master --add-module=/opt/tools/nginx-rtmp-module-master nginx.conf配置 [root@localhost ~ 16:18:12&&5]#cat /opt/nginx/conf/nginx.conf | grep -v "^.*#|^$" worker_processes 1; #注意 这里必须设置为1，页面上显示不了 events { worker_connections 1024; } rtmp{ server{ listen 1935; chunk_size 4000; application hls { live on; hls on; hls_path /opt/nginx/html/hls; hls_fragment 5s; } } } http { include mime.types; default_type application/octet-stream; sendfile on; keepalive_timeout 65; server { listen 80; server_name localhost; location /{ root /opt/nginx/html ; index index.html index.htm; } error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } } }
ffmpeg安装配置
包位置
F:sharesrcffmpeg
安装yasm tar -zxvf yasm-1.3.0.tar.gz cd yasm-1.3.0 ./configure make make install
安装ffmpeg ./configure --prefix=/opt/ffmpeg --enable-gpl --enable-version3 --enable-nonfree --enable-shared --enable-zlib --enable-bzlib --enable-pic make && make install [root@localhost ~ 16:35:13&&9]#vim /etc/ld.so.conf include ld.so.conf.d/*.conf /opt/ffmpeg/lib #添加 ldconfig
rtsp转rtmp nohup ffmpeg -i rtsp://admin:abc12345@192.168.2.22:554/ -vcodec copy -acodec copy -f flv rtmp://192.168.30.71:1935/hls/22 > 22.out &
编写展示html
[root@localhost /opt/nginx/html 16:37:41&&15]#cat test2.html <!DOCTYPE html> <html> <head> <title>123</title> <link href="http://static.sgamer.com/css/video-js.css" rel="stylesheet"> <script src="http://static.sgamer.com/js/video.min.js"></script> </head> <body> <video id="my-player" class="video-js" controlspreload="auto" data-setup='{}' style=" 256px;height: 256px;"> <source src='rtmp://192.168.30.71:1935/hls/22' type='rtmp/m3u8'/> </video> <video id="my-player2" class="video-js" controlspreload="auto" data-setup='{}' style=" 256px;height: 256px;"> <source src='rtmp://192.168.30.71:1935/hls/21' type='rtmp/m3u8'/> </video> <video id="my-player3" class="video-js" controlspreload="auto" data-setup='{}' style=" 256px;height: 256px;"> <source src='rtmp://192.168.30.71:1935/hls/30' type='rtmp/m3u8'/> </video> <video id="my-player4" class="video-js" controlspreload="auto" data-setup='{}' style=" 256px;height: 256px;"> <source src='rtmp://192.168.30.71:1935/hls/20' type='rtmp/m3u8'/> </video> <video id="my-player5" class="video-js" controlspreload="auto" data-setup='{}' style=" 256px;height: 256px;"> <source src='rtmp://192.168.30.71:1935/hls/10' type='rtmp/m3u8'/> </video> <script type="text/javascript"> var player = videojs('my-player'); var options = {};
#根据video的id 来获取video播放 var player = videojs('my-player', options, function onPlayerReady() { videojs.log('Your player is ready!'); // In this context, `this` is the player that was created by Video.js. this.play(); // How about an event listener? this.on('ended', function() { videojs.log('Awww...over so soon?!'); }); }); var player2 = videojs('my-player2', options, function onPlayerReady() { videojs.log('Your player is ready!'); // In this context, `this` is the player that was created by Video.js. this.play(); // How about an event listener? this.on('ended', function() { videojs.log('Awww...over so soon?!'); }); }); var player3 = videojs('my-player3', options, function onPlayerReady() { videojs.log('Your player is ready!'); // In this context, `this` is the player that was created by Video.js. this.play(); // How about an event listener? this.on('ended', function() { videojs.log('Awww...over so soon?!'); }); }); var player4 = videojs('my-player4', options, function onPlayerReady() { videojs.log('Your player is ready!'); // In this context, `this` is the player that was created by Video.js. this.play(); // How about an event listener? this.on('ended', function() { videojs.log('Awww...over so soon?!'); }); }); var player5 = videojs('my-player5', options, function onPlayerReady() { videojs.log('Your player is ready!'); // In this context, `this` is the player that was created by Video.js. this.play(); // How about an event listener? this.on('ended', function() { videojs.log('Awww...over so soon?!'); }); }); </script> </body> </html>