動画配信サーバー設定の変更点

追加された行はこの色です。
削除された行はこの色です。
動画配信サーバー設定へ行く。
動画配信サーバー設定の差分を削除
#author("2020-10-09T22:08:51+09:00","default:egashira","egashira")
#author("2020-10-09T22:09:09+09:00","default:egashira","egashira")
[[CentOS7]]

*動画配信サーバー設定 [#n84e66a2]

**動画をHLS形式に変換 [#zc646bcf]
変換元動画をWinSCPで動画格納先へ格納する。

|BGCOLOR(black):COLOR(white):|c
|[root@centos ~]# cd /usr/local/nginx/html/vod　&color(lime){←　動画格納先ディレクトリへ移動};|
|[root@centos ~]# sh /root/convert_to_hls.sh &color(lime){ 変換元動画ファイル名　←　HLS形式動画変換};|
|convert completed. => xxxxxxxx.m3u8 &color(lime){　←　動画変換成功};|
|[root@centos ~]# cd　&color(lime){←　動画格納先ディレクトリを抜ける};|

**動画視聴用ページ作成 [#xea584ee]
|BGCOLOR(black):COLOR(white):|c
|[root@centos ~]# vi /usr/local/nginx/html/vod.html　&color(lime){←　動画視聴用ページ作成};|
 <!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>

**認証用ユーザー名／パスワード登録 [#s50418bb]
|BGCOLOR(black):COLOR(white):|c
|[root@centos ~]# mkdir /usr/local/nginx/passwd/　&color(lime){←　ユーザー名／パスワードファイル作成先ディレクトリ作成
};|
|[root@centos ~]# mkdir /usr/local/nginx/passwd/　&color(lime){←　ユーザー名／パスワードファイル作成先ディレクトリ作成};|
|[root@centos ~]# yum -y install httpd-tools　&color(lime){←　httpd-toolsインストール};|
|[root@centos ~]# htpasswd -b -c -m /usr/local/nginx/passwd/.htpasswd　&color(lime){ユーザー名 パスワード　←　ユーザー名／パスワード登録};|
|Adding password for user xxxxxxxx|
動画配信サーバー設定 の変更点

動画配信サーバー設定の変更点
