1.安装依赖
apt-get install build-essential libpcre3 libpcre3-dev libssl-dev
2.创建文件夹
mkdir ~/tools
cd tools
3.下载nginx
wget http://nginx.org/download/nginx-1.7.5.tar.gz
4. 下载nginx-http-flv-module 模块包
https://github.com/winshining/nginx-http-flv-module (在github上手动下载到本地,然后再通过scp上传到tools目录下)
5.创建/usr/local/nginx目录
6.将nginx-http-flv-module解压移动到/usr/local/nginx目录下
7.将nginx-http-flv-module模板添加到nginx中,生成make文件 并安装nginx,执行以下语句:
./configure --prefix=/usr/local/nginx --add-module=/usr/local/nginx/nginx-http-flv-module
make && make install
8.修改配置文件(/usr/local/nginx/conf/nginx.conf)
#user nobody; worker_processes 1; #error_log logs/error.log; #error_log logs/error.log notice; #error_log logs/error.log info; #pid logs/nginx.pid; events { worker_connections 1024; } rtmp_auto_push on; rtmp_auto_push_reconnect 1s; rtmp_socket_dir /tmp; rtmp{ out_queue 4096; out_cork 8; max_streams 128; timeout 15s; drop_idle_publisher 15s; log_interval 5s; log_size 1m; server{ listen 1935; application myapp{ live on; gop_cache on; } application hls{ live on; hls on; hls_path /usr/local/nginx/html/hls; } application dash{ live on; dash on; dash_path /usr/local/nginx/html/dash; } } } http { include mime.types; default_type application/octet-stream; #log_format main '$remote_addr - $remote_user [$time_local] "$request" ' # '$status $body_bytes_sent "$http_referer" ' # '"$http_user_agent" "$http_x_forwarded_for"'; #access_log logs/access.log main; sendfile on; #tcp_nopush on; #keepalive_timeout 0; keepalive_timeout 65; #gzip on; server { listen 80; server_name localhost; #charset koi8-r; #access_log logs/host.access.log main; location / { root html; index index.html index.htm; } location /live{ flv_live on; chunked_transfer_encoding on; add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Credentials' 'true'; } location /hls{ types { application/vnd.apple.mpegurl m3u8; video/mp2t ts; } root /usr/local/nginx/html/; add_header 'Cache-Control' 'no-cache'; add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Credentials' 'true'; } location /dash { root /usr/local/nginx/html/dash; add_header 'Cache-Control' 'no-cache'; } location /stat { #configuration of push & pull status rtmp_stat all; rtmp_stat_stylesheet stat.xsl; } location /stat.xsl { root /usr/local/nginx/nginx-http-flv-module; } location /control { rtmp_control all; #configuration of control module of rtmp } #error_page 404 /404.html; # redirect server error pages to the static page /50x.html # error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } # proxy the PHP scripts to Apache listening on 127.0.0.1:80 # #location ~ \.php$ { # proxy_pass http://127.0.0.1; #} # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000 # #location ~ \.php$ { # root html; # fastcgi_pass 127.0.0.1:9000; # fastcgi_index index.php; # fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name; # include fastcgi_params; #} # deny access to .htaccess files, if Apache's document root # concurs with nginx's one # #location ~ /\.ht { # deny all; #} } # another virtual host using mix of IP-, name-, and port-based configuration # #server { # listen 8000; # listen somename:8080; # server_name somename alias another.alias; # location / { # root html; # index index.html index.htm; # } #} # HTTPS server # #server { # listen 443 ssl; # server_name localhost; # ssl_certificate cert.pem; # ssl_certificate_key cert.key; # ssl_session_cache shared:SSL:1m; # ssl_session_timeout 5m; # ssl_ciphers HIGH:!aNULL:!MD5; # ssl_prefer_server_ciphers on; # location / { # root html; # index index.html index.htm; # } #} }
9.本地执行推流操作
ffmpeg -loglevel verbose -re -i C:\Users\zc\Desktop\a.mp4 -vcodec libx264 -vprofile baseline -acodec libmp3lame -ar 44100 -ac 1 -f flv rtmp://139.9.174.107:1935/hls/test
10.编写html代码,播放m3u8文件
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>前端播放m3u8格式视频</title> <!--https://www.bootcdn.cn/video.js/--> <link href="https://cdn.bootcss.com/video.js/7.6.5/alt/video-js-cdn.min.css" rel="stylesheet"> <script src="https://cdn.bootcss.com/video.js/6.6.2/video.js"></script> <!--https://www.bootcdn.cn/videojs-contrib-hls/--> <script src="https://cdn.bootcss.com/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js"></script> </head> <body> <video id="myVideo" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto" width="1080" height="708" data-setup='{}'> <source id="source" src="http://139.9.174.107/hls/test.m3u8" type="application/x-mpegURL"> </video> </body> <script> // videojs 简单使用 var myVideo = videojs('myVideo',{ bigPlayButton : true, textTrackDisplay : false, posterImage: false, errorDisplay : false, }) myVideo.play() // 视频播放 myVideo.pause() // 视频暂停 </script> </html>