現在抖音、快手等直播實在是太火了，因此對音視頻的開發非常感興趣，查閱了相關資料，使用Nginx搭建一個簡單的直播跟點播流媒體服務器，能夠實時推流到服務器，同時在網頁端播放直播的視頻，
先上效果
? 使用OBS軟體錄制電腦桌面操作推流到自己搭建的流媒體服務器，然后在網頁拉流播放，當然也可以采集攝像頭、麥克風推流，或者推送本地視頻到流媒體服務器，
搭建步驟
Ubuntu18.04安裝nginx-flv模塊擴展
這里我是用虛擬機安裝了Ubuntu18.04先下載nginx1.19.3的原始碼與nginx-http-flv-module的原始碼，
wget https://github.com/winshining/nginx-http-flv-module/archive/master.zip
wget http://nginx.org/download/nginx-1.19.3.tar.gz && tar -zxvf nginx-1.19.3.tar.gz
解壓下載的個原始碼進行編譯，這樣一個Nginx搭建的流媒體服務器就好了，
cd nginx-1.19.3 #進入nginx原始碼目錄
./configure --add-module=../nginx-http-flv-module-master
vim objs/Makefile #洗掉-Werror
make
make install
進行點播與直播配置
? 上面已經安裝好了nginx，編輯/usr/local/nginx/conf/nginx.conf進行相關配置，這里直接貼出完整的配置，其中rtmp為開啟rtmp服務功能，并且為了能夠在網頁端播放開啟了hls，推流的rmtp流會轉換成hls協議的ts切片，保存在服務器上，nginx配置了location讓網頁能夠訪問切好的hls切片，
? 這里解釋下rtmp是adboe的私有協議，必須使用flash播放，hls是蘋果開發的視頻傳輸協議使用http進行傳輸，ios跟android支撐的都很好，一般進行跨平臺直播使用hls協議比較常見，
#user nobody;
worker_processes 1;
events {
worker_connections 1024;
}
rtmp { #RTMP服務
server {
listen 1935; #//服務埠
chunk_size 4096; #//資料傳輸塊的大小
application vod {
play /opt/video/vod; #//視頻檔案存放位置，
}
application live{
live on; #直播
hls on; #把直播服務器改造成實時回發服務器,視頻切片成ts
wait_key on; #對視頻切片進行保護
hls_path /opt/video/rtmp/hls; #ts切片存放位置
hls_fragment 10s; #切片大小
hls_playlist_length 60s; #回看的時間
hls_continuous on; #連續模式
hls_cleanup on; #對多余切片進行洗掉
hls_nested on; #嵌套模式
}
}
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 80;
server_name localhost;
location /stat { #第二處添加的location欄位，
rtmp_stat all;
rtmp_stat_stylesheet stat.xsl;
}
location /stat.xsl { #第二處添加的location欄位，
root /usr/local/nginx-http-flv-module/;
}
location /hls {
types {
application/vnd.apple.mpegurl m3u8;
video/mp2t ts;
}
alias /opt/video/rtmp/hls;
add_header Cache-Control no-cache;
add_header Access-Control-Allow-Origin *;
}
location / {
root html;
index index.html index.htm;
}
}
進行測驗
使用obs推流推送到rtmp://192.168.227.128/live串流密鑰隨便填寫即可，
? h5網頁端采用video.js進行播放直播流視頻,這里的播放的地址是切好片的m3u8檔案地址，m3u8存放了每一個小切片的地址，
<body>
<video id=example-video width=600 height=300 class="video-js vjs-default-skin" controls>
<source
src="http://192.168.227.128/hls/test/index.m3u8"
type="application/x-mpegURL">
</video>
<link href="//vjs.zencdn.net/7.8.2/video-js.min.css" rel="stylesheet">
<script src="//vjs.zencdn.net/7.8.2/video.min.js"></script>
<script src="videojs-contrib-hls.min.js"></script>
<script src="https://unpkg.com/browse/@videojs/http-streaming@2.2.3/dist/videojs-http-streaming.min.js"></script>
<script>
var player = videojs('example-video');
player.play();
</script>
</body>
? 上面的nginx配置還配置了本地視頻檔案點播配置，把視頻檔案放在/opt/video/vod位置，使用vlc填寫rtmp://192.168.227.128/vod/qlgame.mp4進行播放即可，
以上搭建只是測驗學習使用，實際音視頻開發涉及采集、編碼、推流、傳輸、拉流、解碼等等程序，每一個程序都設計許多知識，后面音視頻開發學習筆記，等我攢了一些筆記發出來互相學習，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/183692.html
標籤：其他
上一篇：QT內嵌CEF3制作瀏覽器（一）