CentOS7
動画配信サーバー構築†
nginx+nginx-rtmp-moduleインストール†
| [root@centos ~]# wget https://nginx.org/download/nginx-1.17.3.tar.gz ← nginxダウンロード |
| ※最新版のダウンロードURL |
| [root@centos ~]# tar zxf nginx-*.tar.gz ← nginx展開 |
| [root@centos ~]# cd nginx-* ← nginx展開先ディレクトリへ移動 |
| [root@centos nginx-1.17.3]# git clone https://github.com/arut/nginx-rtmp-module.git ← nginx-rtmp-moduleダウンロード |
| [root@centos nginx-1.17.3]# ./configure --add-module=nginx-rtmp-module/ && make && make install ← nginx+nginx-rtmp-moduleインストール |
| [root@centos nginx-1.17.3]# cd ← nginx展開先ディレクトリを抜ける |
| [root@centos ~]# rm -rf nginx-* ← nginx展開先ディレクトリとダウンロードしたファイルを削除 |
nginx設定†
| [root@centos ~]# vi /usr/local/nginx/conf/nginx.conf ← nginx設定ファイル編集 |
http {
server_tokens off; ← 追加(バージョン情報隠蔽)
・
・
・
server {
listen 80;
faviconエラーログ無効化設定追加（ここから）
# faviconが存在しない旨のログを出力しないようにする
location /favicon {
empty_gif;
access_log off;
log_not_found off;
}
faviconエラーログ無効化設定追加（ここまで）
RTMPサーバー設定を最後尾へ追加（ここから）
rtmp_auto_push on;
rtmp {
server {
listen 1935;
access_log logs/rtmp_access.log;
chunk_size 4096;
timeout 10s;
# ライブ配信設定
application live {
live on;
# 192.168.1.0/24からのみライブ配信データの受信を許可
allow publish 192.168.1.0/24;
deny publish all;
# HLS配信設定
hls on;
hls_path /usr/local/nginx/html/live; # HLS(HTTP Live Streaming)ファイル作成先
hls_fragment 10s; # HLS(HTTP Live Streaming)ファイル分割時間
}
# オンデマンド配信設定
application vod {
play /usr/local/nginx/html/vod; # 動画ファイル格納先
}
}
}
| [root@centos ~]# mkdir /usr/local/nginx/html/vod ← 動画ファイル格納先ディレクトリ作成 |
| [root@centos ~]# chown nobody /usr/local/nginx/html/vod ← 動画ファイル格納先ディレクトリ所有者変更 |
| [root@centos ~]# vi /etc/logrotate.d/nginx ← nginxログローテーション設定ファイル作成 |
/usr/local/nginx/logs/*.log {
missingok
notifempty
sharedscripts
delaycompress
postrotate
/bin/systemctl reload nginx.service > /dev/null 2>/dev/null || true
endscript
}
nginx起動†
| [root@centos ~]# vi /usr/lib/systemd/system/nginx.service ← nginx起動スクリプト作成 |
[Unit]
Description=nginx - high performance web server
Documentation=http://nginx.org/en/docs/
After=network.target remote-fs.target nss-lookup.target
[Service]
Type=forking
ExecStartPre=/usr/local/nginx/sbin/nginx -t -c /usr/local/nginx/conf/nginx.conf
ExecStart=/usr/local/nginx/sbin/nginx -c /usr/local/nginx/conf/nginx.conf
ExecReload=/bin/kill -s HUP $MAINPID
ExecStop=/bin/kill -s TERM $MAINPID
PrivateTmp=true
[Install]
WantedBy=multi-user.target
| [root@centos ~]# systemctl start nginx ← nginx起動 |
| [root@centos ~]# systemctl enable nginx ← nginx自動起動設定 |
オンデマンド配信確認†
動画変換スクリプト作成†
#!/bin/bash
FILENAME=`basename ${1} | sed 's/\.[^\.]*$//'`
ffmpeg -re -i ${1} -vcodec libx264 -vprofile baseline -acodec copy -ar 44100 -ac 1 -f segment -segment_ format mpegts -segment_time 10 -segment_list ${FILENAME}.m3u8 ${FILENAME}-%03d.ts
if [ $? -eq 0 ]; then
echo "convert completed. => ${FILENAME}.m3u8"
else
echo "convert failed."
fi
動画をHLS形式に変換†
変換元動画をWinSCPで動画格納先（/usr/local/nginx/html/vod）へ格納する。
| [root@centos ~]# cd /usr/local/nginx/html/vod ← 動画格納先ディレクトリへ移動 |
| [root@centos ~]# sh /root/convert_to_hls.sh 変換元動画ファイル名 ← HLS形式動画変換 |
・
・
・
convert completed. => xxxxxxxx.m3u8 ← 動画変換成功 |
| [root@centos ~]# cd ← 動画格納先ディレクトリを抜ける |
動画視聴用ページ作成†
| [root@centos ~]# vi /usr/local/nginx/html/vod.html ← 動画視聴用ページ作成 |
<!DOCTYPE html>
<html lang="en" class="">
<head>
<title>ONDEMAND</title>
<link href="//vjs.zencdn.net/5.11/video-js.min.css" rel="stylesheet">
<script src="//cdn.jsdelivr.net/hls.js/latest/hls.min.js"></script>
</head>
<body>
<video id="video" class="video-js vjs-default-skin" width="640" height="480" controls>
<script type="text/javascript">
var source = '/vod/動画ファイル名.m3u8';
var ua = navigator.userAgent;
if (ua.indexOf('iPhone') > 0 || ua.indexOf('iPad') > 0 || ua.indexOf('Android') > 0) {
// iOS
document.write('<source src=' + source + ' type="application/x-mpegURL">');
document.write('</video>');
}else{
// OTHER
document.write('</video>');
if(Hls.isSupported()) {
var video = document.getElementById('video');
var hls = new Hls();
hls.loadSource(source);
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED,function() {
video.play();
});
}
}
</script>
</body>
</html>
ライブ配信確認†
【PCから配信する場合】†
- Flash Media Live Encoderインストール
Flash Media Live Encoderを使用してカメラ映像・音声をサーバーへ送信するため、カメラを接続する端末でFlash Media Live Encoderをダウンロードしてインストール
- ライブ配信
Flash Media Live Encoderを起動
「Encoding Options」タブを選択
【画面左側】
「Preset」で「High Bandwidth（800Kbps）-H.264」を選択
「Format」のレンチボタンを押下して「Advanced Encoder Settings」ダイアログボックスの「Keyframe Frequency」で「4 Seconds」を選択
【画面右側】
「FMS URL」に"rtmp://サーバーIPアドレス/live"と入力※左記の"live"はアプリケーション名（nginx.confのapplicationで指定した値）を指定
「Stream」に"live"と入力※左記の"live"はストリームキー（任意の値）を指定
「Connect」ボタン押下
「Start」ボタン押下
これでサーバーにカメラ映像・音声の送信が開始される。
【iPhoneから配信する場合】†
- Live:Air Soloインストール
iPhoneにLive:Air Soloをインストール
- ライブ配信
- Live:Air Soloを起動
- 「CUSTOM RTMP」をタップ
- 「URL」に"rtmp://サーバー名/live"、「Stream」に"live"と入力して、「Add RTMP」をタップ※左記の最初の"live"はアプリケーション名（nginx.confのapplicationで指定した値）、次の"live"はストリームキー（任意の値）を指定
- 右へスワイプして「Add New Source」をタップ
- 「iOS Camera」をタップ
- iOSカメラ映像をタップして左へスワイプ
- 「Go Live!」をタップ
- これでサーバーにカメラ映像・音声の送信が開始される。
| [root@centos ~]# vi /usr/local/nginx/html/live.html ← ライブ動画視聴用ページ作成 |
<!DOCTYPE html>
<html lang="en" class="">
<head>
<title>LIVE</title>
<link href="//vjs.zencdn.net/5.11/video-js.min.css" rel="stylesheet">
<script src="//cdn.jsdelivr.net/hls.js/latest/hls.min.js"></script>
</head>
<body>
<video id="video" class="video-js vjs-default-skin" width="640" height="480" controls>
<script type="text/javascript">
var source = '/HLS(HTTP Live Streaming)ファイル作成先/アプリケーション名.m3u8（例:/live/live.m3u8） ';
var ua = navigator.userAgent;
if (ua.indexOf('iPhone') > 0 || ua.indexOf('iPad') > 0 || ua.indexOf('Android') > 0) {
// Mobile
document.write('<source src=' + source + ' type="application/x-mpegURL">');
document.write('</video>');
}else{
// OTHER
document.write('</video>');
if(Hls.isSupported()) {
var video = document.getElementById('video');
var hls = new Hls();
hls.loadSource(source);
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED,function() {
video.play();
});
}
}
</script>
</body>
</html>
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
![[heart]](image/face/heart.png)
