小型直播系统系列-乐聊TV的开发（二）
小型直播系統(tǒng)系列-樂(lè)聊TV的開(kāi)發(fā)（二）
上一節(jié)我們講到系統(tǒng)概括，這一節(jié)我們?cè)敿?xì)講解一下nginx的使用：
nginx-rtmp-module的使用
1.軟件編譯
從下面的網(wǎng)址分別下載nginx和nginx-rtmp-module：
http://nginx.org/en/download.html
https://github.com/arut/nginx-rtmp-module
然后解壓 -zxvf
2.進(jìn)入nginx的源碼目錄下面
./configure –add-module=/path/to/nginx-rtmp-module –with-http_ssl_module –with-debug
來(lái)增加這個(gè)模塊，然后
make
make install
3.在原有的nginx.conf中加入如下配置
其中rtmp部分與原有的http部分在同一個(gè)級(jí)別，但是下面的http部分要放到已有的http部分中，也就是增加一個(gè)server部分。
然后運(yùn)行如下命令檢查nginx.conf是否有語(yǔ)法錯(cuò)誤
service nginx configtest
重新加載配置文件
service nginx reload
運(yùn)行下面的命令查看nginx狀態(tài)
service nginx status
然后查看端口
netstat -nlp
前端播放m3u8視頻
當(dāng)我們成功安裝好了rtmp模塊之后，就可以用作為直播服務(wù)器，那么直播的來(lái)源哪里來(lái)呢？這里用到一個(gè)推流播放器 obs。
obs的使用
http://soft.qazwaxs.com/OBS到這里現(xiàn)在下載obs，然后進(jìn)行設(shè)置，步驟如下圖
步驟一：
——————————
步驟二
步驟三
現(xiàn)在你已經(jīng)成功的推流成功，cd到你設(shè)置的目錄下面，就可以看到后綴是.m3u8的視頻了,下面開(kāi)始拉流，介紹的是前端拉流用到的框架結(jié)構(gòu) vue-video-player + videojs-contrib-hls。如果你迫不及待，現(xiàn)在就可以用頁(yè)面進(jìn)行觀看一波
<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>HLS Player</title> </head> <body> <video poster="poster.png" height="720" width="1280" controls> <source src="http://192.168.90.26:8080/hls/mystream.m3u8" type="application/vnd.apple.mpegurl" /> <p class="warning">Your browser does not support HTML5 video.</p> </video> </body> </html>但是很遺憾，只有蘋果手機(jī)的Safari瀏覽器支持，安卓手機(jī)的沒(méi)測(cè)試。
vue-video-player + videojs-contrib-hls
前端拉流采用的是 vue-video-player + videojs-contrib-hls，github地址是https://github.com/videojs/videojs-contrib-hls，video.js是一個(gè)開(kāi)源的視頻播放器，開(kāi)始我使用的是一個(gè)cdplayer，同樣支持m3u8的播放，這里可能有人有疑問(wèn)，為什么不用h5直接播放呢？
因?yàn)樘O果手機(jī)天生支持m3u8格式的播放，但是pc很遺憾并不支持，所以需要我們自己編寫播放規(guī)則
可以百度一下 vue-video-player + videojs-contrib-hls的使用
很重要的一點(diǎn)，需要解決視頻跨域問(wèn)題。也就是視頻播放路徑和我們的項(xiàng)目在同一域名端口下。
總結(jié)
以上是生活随笔為你收集整理的小型直播系统系列-乐聊TV的开发（二）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： Json-server简单实现mock数
- 下一篇： 小红帽中用eclipse编译window