nginx實現最簡單的直播
關於直播技術的原理,這里我就不啰嗦了,可以參考文章https://blog.csdn.net/leifukes/article/details/73244012
我的環境
[root@controller ~]# cat /etc/redhat-release
CentOS Linux release 7.2.1511 (Core)
[root@controller ~]# getenforce
Disabled
[root@controller ~]# systemctl stop firewalld
[root@controller ~]# hostname -I
10.0.0.11
1:git拉取nginx-rtmp插件
mkdir -p /server/tools
cd /server/tools
git clone https://github.com/arut/nginx-rtmp-module.git
2:編譯安裝nginx
useradd -s /sbin/nologin -M nginx
wget http://nginx.org/download/nginx-1.14.0.tar.gz
tar xf nginx-1.14.0.tar.gz
ls
cd nginx-1.14.0/
yum install pcre-devel -y
yum install openssl-devel.x86_64 -y
./configure --user=nginx --group=nginx --with-http_ssl_module --prefix=/application/nginx --add-module=../nginx-rtmp-module
make
make install
3:配置啟動nginx
cd /application/nginx/conf/
grep -Ev '^$|#' nginx.conf.default >nginx.conf
vim nginx.conf
worker_processes 1;
events {
worker_connections 1024;
}
rtmp {
server {
listen 1935;
chunk_size 4096;
application live {
live on;
hls on;
hls_path /application/nginx/html/live;
hls_fragment 5s;
}
}
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 80;
server_name localhost;
location /live {
types {
application/vnd.apple.mpegurl m3u8;
video/mp2t ts;
}
alias /application/nginx/html/live;
expires -1;
add_header Cache-Control no-cache;
}
location / {
root html;
index index.html index.htm;
}
}
}
#測試nginx語法
../sbin/nginx –t
啟動nginx
../sbin/nginx
4:使用EV錄屏實現推流
串流地址: rtmp://10.0.0.11:1935/live
地址密鑰隨便填,我這里是test
如果你的地址密鑰填寫和一樣的話,
開啟直播之后,測試能否下載test.m3u8文件
http://10.0.0.11/live/test.m3u8
如果能夠成功下載,恭喜你離成功很近了!
5:配置站點首頁
vi /application/nginx/html/index.html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>前端播放m3u8格式視頻</title>
<link rel="stylesheet" href="http://vjs.zencdn.net/5.5.3/video-js.css">
<script src="http://vjs.zencdn.net/5.5.3/video.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.12.2/videojs-contrib-hls.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://10.0.0.11/live/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>
打開瀏覽器測試:
http://10.0.0.11/
至此成功!!!