Setup Nginx di Ubuntu untuk Streaming Live HLS Video

HTTP Live Streaming (HLS) adalah protokol video streaming yang sangat kuat yang diterapkan oleh Apple Inc. HLS menggunakan transaksi HTTP yang melintasi firewall, proksi, dan dapat didistribusikan melalui CDN dengan mudah. Oleh karena itu, teknologi ini mampu menjangkau pemirsa yang jauh lebih besar daripada RTP atau protokol berbasis UDP lainnya. Banyak video streaming langsung online hari ini di-host oleh sistem mahal yang menggunakan HLS, tetapi mereka umumnya mahal dan membutuhkan banyak sumber daya server. Tutorial ini akan menunjukkan kepada Anda cara mengatur Ubuntu 14.04 VULTR VPS yang sangat terjangkau untuk melakukan acara streaming langsung HLS hanya menggunakan perangkat lunak sumber terbuka.

Langkah pertama adalah membaca dan mengatur server Anda sesuai dengan Vultr Doc " Setup Nginx-RTMP di Ubuntu 14.04 ". Instruksi dalam dokumen tersebut adalah yang paling komprehensif untuk tahap pengaturan, pada saat penulisan. Saya akan menyebutkan bahwa Anda mungkin ingin mengganti "nginx-1.7.5" dengan "nginx-1.9.4" atau apa pun versi terbaru Nginx yang tersedia. Saran lainnya adalah mengkompilasi Nginx dengan modul status rintisan HTTP untuk memberi Anda kemampuan untuk memantau berapa banyak pemirsa HLS langsung yang Anda miliki nanti.

Alih-alih kompilasi dengan:

./configure --with-http_ssl_module  --add-module=../nginx-rtmp-module-master

Gunakan string ini dalam prosedur yang dijabarkan dalam dokumen prasyarat:

./configure --with-http_ssl_module --with-http_stub_status_module --add-module=../nginx-rtmp-module-master

Contoh dalam tutorial ini akan membuat aliran "langsung" dan "seluler" (dioptimalkan) dan akan menggunakan ffmpeg (dipasang di tutorial sebelumnya) untuk menghasilkan aliran HLS yang disesuaikan dengan kecepatan seluler yang dioptimalkan untuk seluler. Contoh ini juga akan menunjukkan bagaimana menyebabkan server merekam streaming langsung Anda secara otomatis dan memungkinkan Anda memutar rekaman kembali sebagai layanan pemutaran ulang video on demand (VOD).

Pertama, buat struktur folder yang diperlukan untuk menyimpan manifes HLS dan fragmen video seluler dan seluler:

sudo mkdir /HLS
sudo mkdir /HLS/live
sudo mkdir /HLS/mobile
sudo mkdir /video_recordings
sudo chmod -R 777 /video_recordings

Mungkin ide yang baik untuk mengaktifkan firewall Anda jika Anda belum melakukannya. Jika demikian, Anda harus mengizinkan lalu lintas ke port yang digunakan oleh Nginx dan HLS. Jika Anda ingin menjalankan tanpa firewall untuk saat ini, abaikan bagian ufw di bawah ini.

sudo ufw limit ssh
sudo ufw allow 80
sudo ufw allow 1935
sudo ufw enable

Streaming HLS memerlukan konfigurasi Nginx yang sangat berbeda dari konfigurasi RTMP di artikel pertama. Edit nginx.conffile Anda untuk menggunakan yang berikut, gantikan "my-ip" dan "my-stream-key" dengan info Anda. Anda dapat menggunakan apa pun yang Anda inginkan untuk "my-stream-key" itu hanya sebuah kata yang unik dan bermanfaat bagi Anda. Anda mungkin ingin membuat cadangan file konfigurasi asli Anda terlebih dahulu, lalu tempel info konfigurasi yang disediakan saya ke editor, menggantikan semua yang ada di sana:

sudo cp /usr/local/nginx/conf/nginx.conf /usr/local/nginx/conf/nginx.conf.original
sudo nano /usr/local/nginx/conf/nginx.conf

Nginx.conf baru:

worker_processes  1;
error_log  logs/error.log debug;
events {
worker_connections  1024;
}
rtmp {
server {
listen 1935;
allow play all;

#creates our "live" full-resolution HLS videostream from our incoming encoder stream and tells where to put the HLS video manifest and video fragments
application live {
allow play all;
live on;
record all;
record_path /video_recordings;
record_unique on;
hls on;
hls_nested on;
hls_path /HLS/live;
hls_fragment 10s;

#creates the downsampled or "trans-rated" mobile video stream as a 400kbps, 480x360 sized video
exec ffmpeg -i rtmp://192.168.254.178:1935/$app/$name -acodec copy -c:v libx264 -preset veryfast -profile:v baseline -vsync cfr -s 480x360 -b:v 400k maxrate 400k -bufsize 400k -threads 0 -r 30 -f flv rtmp://192.168.254.178:1935/mobile/$;
}

#creates our "mobile" lower-resolution HLS videostream from the ffmpeg-created stream and tells where to put the HLS video manifest and video fragments
application mobile {
allow play all;
live on;
hls on;
hls_nested on;
hls_path /HLS/mobile;
hls_fragment 10s;
}

#allows you to play your recordings of your live streams using a URL like "rtmp://my-ip:1935/vod/filename.flv"
application vod {
play /video_recordings;
}
}
}


http {
include       mime.types;
default_type  application/octet-stream;

server {
listen 80;
server_name 192.168.254.178;

#creates the http-location for our full-resolution (desktop) HLS stream - "http://my-ip/live/my-stream-key/index.m3u8"      
location /live {
types {
application/vnd.apple.mpegurl m3u8;
}
alias /HLS/live;
add_header Cache-Control no-cache;
}

#creates the http-location for our mobile-device HLS stream - "http://my-ip/mobile/my-stream-key/index.m3u8"        
location /mobile {
types {
application/vnd.apple.mpegurl m3u8;
}
alias /HLS/mobile;
add_header Cache-Control no-cache;
}   

#allows us to see how stats on viewers on our Nginx site using a URL like: "http://my-ip/stats"     
location /stats {
stub_status;
}

#allows us to host some webpages which can show our videos: "http://my-ip/my-page.html"     
location / {
root   html;
index  index.html index.htm;
}   
}
}

Tekan Ctrl + X untuk keluar. Katakan "ya" untuk menyimpan perubahan.

Anda dapat menemukan instruksi yang jelas dan contoh-contoh variabel yang mungkin dalam nginx.conffile ini jika Anda meminta mesin pencari favorit Anda untuk "arahan nginx-rtmp". Saya telah menggunakan nginx-rtmp dengan HLS selama beberapa tahun sekarang, tanpa menggunakan arahan "allow publish" dan "deny publish" dan saya telah melihat nol contoh orang yang menggunakan / menginvasi server video saya. Jadi saya tidak memasukkan arahan-arahan itu di sini. Baca dan tambahkan arahan ini jika Anda mau.

Setelah mengubah nginx.conffile, Anda harus memulai ulang Nginx untuk menggunakan konfigurasi baru:

sudo service nginx restart

Perhatikan baik-baik semua pesan kesalahan Nginx dan atasi kesalahan yang mungkin disebabkan oleh kesalahan ejaan, kepemilikan folder, atau masalah izin. Jika Anda tidak memiliki pesan kesalahan, maka Anda siap untuk membuat aliran enkode Anda.

Anda harus memiliki pembuat enkode video untuk membuat aliran. Saya menggunakan OBS (Open Broadcaster Software) - yang merupakan open-source dan bekerja dengan baik untuk saya. Ada solusi lain untuk dipilih, yang berada di luar cakupan tutorial ini. Saya tidak akan membahas segala sesuatu tentang mengkonfigurasi enkoder video RTMP. Mereka semua membutuhkan variabel input yang kira-kira sama. Pengaturan tombol yang harus Anda input agar dapat menggunakan nginx.confkonfigurasi saya yang tepat dan agar berfungsi dengan baik di sebagian besar pemain / browser / platform adalah sebagai berikut:

1. Encoder-x264
2. Bitrate variabel (bukan CBR atau Constant Bit Rate), Kualitas tertinggi
3. Maks bitrate-600kbps
4. Audio-Codec-AAC
5. Audio-Format-44.1khz
6. Audio-bitrate-64kbps
7. URL FMS- "rtmp: // my-ip: 1935 / live"
8. Stream Key- "my-stream-key"
9. Resolusi-640x480
10. FPS (bingkai per detik) -30
11. CFR (Constant Frame Rate) - Ya
12. Interval keyframe-2 detik (satu keyframe setiap 2 detik)
13. x264 Encoding Profile-baseline (dapat bekerja dengan main — tergantung pada pemain yang digunakan)
14. x264 CPU Present-veryfast

Saya sarankan mencoba pembuat enkode yang berbeda dan bereksperimen dengannya. Anda mungkin menginginkan rasio aspek yang luas - atau kamera Anda (atau siaran lainnya) mungkin membutuhkannya. Jika demikian, pastikan untuk mengubah info ini di enkoder Anda dan juga aspek rasio yang tercantum di bagian exec-ffmpeg dari nginx.conffile yang saya berikan; kalau tidak, Anda akan mendapatkan beberapa umpan video yang konyol.

Setelah pembuat enkode Anda diatur, Anda dapat menguji semuanya. Mulai pembuat enkode dengan webcam Anda atau semacam uji-pakan yang berjalan di atasnya. Anda dapat melihat siaran Anda pada titik ini dengan pemutar VLC menggunakan URL seperti:

http://my-ip/live/my-stream-key/index.m3u8
http://my-ip/mobile/my-stream-key/index.m3u8

Ini adalah masing-masing untuk streaming video utama dan seluler Anda. Ganti IP Anda dan kunci aliran sesuai.

Setelah Anda berhasil menyiarkan cek aliran pertama Anda (melalui ssh atau ftp) bahwa siaran langsung Anda direkam dalam /video_recordingsfolder di Vultr VPS Anda. Anda juga dapat mencoba memutar file rekaman ini dalam VLC dengan URL seperti:

rtmp://my-ip/vod/filename.flv

Statistik Nginx juga tersedia (dengan Nginx stub_status). Untuk melihat statistik pengunjung / pengunjung, akses:

http://my-ip/stats

Untuk melihat video Anda di halaman web, Anda membutuhkan pemutar yang dapat disematkan. Ada banyak pemain yang dapat disematkan yang akan memutar video HLS. Saya telah menggunakan JW Player selama beberapa tahun sekarang, tetapi versi gratis tidak akan memainkan HLS. Flowplayer dan Bitdash oleh Bitmovin (di antara solusi lain) cukup murah hati untuk menawarkan versi non-komersial dari pemain mereka secara gratis yang akan membuat aliran HLS Anda tertanam di laman web. Untuk artikel ini, saya telah mencoba keduanya dan menemukan keduanya bekerja dengan baik dengan server video berbasis Vultr / Nginx saya. Saya akan menunjukkan secara singkat bagaimana saya membuat Flowplayer bekerja dengan mesin testbed saya.

Jika Anda akan menggunakan streaming HLS langsung dengan cara reguler, berkelanjutan, atau komersial, saya akan mendorong Anda untuk membeli lisensi dari Flowplayer atau pemain mana pun yang Anda putuskan untuk digunakan. Anda akan mendapatkan pemain yang memiliki batasan lebih sedikit, lebih banyak fitur, dan dapat dicap ke organisasi Anda. Anda juga akan mendapatkan dukungan - yang bisa sangat penting. Selain Vultr VPS, ini adalah satu-satunya biaya yang terkait dengan proyek.

Sebelum Anda melakukan hal lain, penting untuk berhati-hati dengan apa yang disebut pembatasan "lintas-domain", yang jika tidak akan mematikan kemampuan Anda untuk melakukan streaming ke halaman web / situs web. Buat crossdomain.xmlfile di nginx/htmlfolder Anda dan letakkan instruksi di dalamnya untuk memungkinkan data mengalir di antara domain:

sudo nano /usr/local/nginx/html/crossdomain.xml

Salin pertama (dari halaman ini) dan kemudian tempel (klik kanan) ke bidang editor nano data XML berikut:

<?xml version="1.0"?>
<!DOCTYPE cross-domain-policy SYSTEM "http://www.adobe.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
<allow-access-from domain="*"/>
</cross-domain-policy>

Tekan Ctrl + O untuk menulis, lalu Ctrl + X untuk menyimpan file ke disk dan keluar.

Saya meraih HTML5 (versi 6.0.3) dari Flowplayer yang memberi saya sejumlah file dan folder saat membuka ritsleting. Saya mengunggah semua file dan folder ke subfolder dari folder root Nginx / HTML yang saya beri nama "flowplayer". Jalan persisnya adalah /usr/local/nginx/html/flowplayer.

Untuk menguji video kami saat disematkan di halaman web, buat beberapa file HTML di root folder Nginx / HTML menggunakan nano dan isi dengan konten berikut.

Mengajukan:

sudo nano /usr/local/nginx/html/hls.html

Kode HTML:

<!doctype html>
<head>
<link rel="stylesheet" href="#">
</head>

<body>
640x480 664kbps (live) Desktop Browsers<br>
<div style="width:640px;" class="flowplayer" data-swf="flowplayer/flowplayer.swf" data-ratio="0.75">
<video>
<source type="application/x-mpegurl" src="">
</video>
</div>
<br><br>
480x360 464kbps (mobile) Mobile Browsers <br>
<div style="width:480px;" class="flowplayer" data-swf="flowplayer/flowplayer.swf" data-ratio="0.75">
<video>
<source type="application/x-mpegurl" src="">
</video>
</div>
</body>

Mengajukan:

sudo nano /usr/local/nginx/html/hls_progressive.html

Kode HTML:

<!doctype html>
<head>
<link rel="stylesheet" href="#">
<style> .flowplayer { width: 640px; } </style>
</head>

<body>
<div class="flowplayer" data-swf="flowplayer/flowplayer.swf" data-ratio="0.75">
<video>
<source type="application/x-mpegurl" src=""> 
<source type="application/x-mpegurl" src="">
</video>
</div>
<br>
</body>

Pastikan untuk mengganti "my-ip" dan "my-stream-key" dengan data Anda.

Anda harus mengganti jalur flowplayer/skin/functional.cssuntuk tanda "#" di stylesheet href="#". Perangkat lunak tutorial menghapus jalurnya. Anda harus mengisi URL di src=""bagian - itu dihapus oleh perangkat lunak tutorial, gunakan http://my-ip/live/my-stream-key/index.m3u8dan http://my-ip/mobile/my-stream-key/index.m3u8, masing-masing. Anda juga harus menambahkan srctag skrip di kepala untuk keduanya jquery-1.11.2.min.jsdan untuk flowplayer.min.js. Tag sedang dihapus oleh perangkat lunak tutorial. Anda dapat menemukan cara membuat tag ini dengan melihat example htmlfile yang disertakan dengan kit Flowplayer.

Mulai pembuat enkode dengan webcam Anda atau semacam uji-pakan yang berjalan di atasnya. Anda dapat melihat siaran Anda di browser menggunakan URL berikut:

http://my-ip/hls.html
http://my-ip/hls_progressive.html

Halaman pertama hanya menampilkan masing-masing aliran Anda - yang utama dan platform seluler. Anda akan dapat memulai keduanya dan melihatnya. Anda akan melihat bahwa aliran platform seluler berukuran lebih kecil. Langkah-langkah ini hanya untuk memastikan bahwa semuanya berjalan.

Halaman kedua menunjukkan aliran tunggal. Tetapi diatur dengan cara yang disebut "streaming progresif". Artinya adalah ketika pemirsa memutar video, baik server maupun pemutar mencoba memberikan kepada pemirsa aliran bitrate tinggi dan berkualitas tinggi jika koneksi pemirsa dapat mempertahankannya. Jika koneksi mereka buruk dan tidak dapat mempertahankan koneksi, itu turun untuk menunjukkan aliran bitrate (mobile) lebih rendah yaitu 200 kbps lebih rendah dalam bandwidth. Jika Anda mau, Anda bisa membuat lebih banyak, aliran progresif dengan ffmpeg dan mengkonfigurasinya menggunakan contoh saya.

Saya telah menguji konfigurasi ini pada satu inti, 1GB Vultr VPS dan saya menemukan bahwa dengan live streaming tunggal, ditambah aliran seluler trans-rated yang dibuatnya dengan ffmpeg, penggunaan cpu kurang dari 35% dan hanya mengkonsumsi 100MB ram 1GB saya. Nah, itu pengaturan yang sangat efisien.

Jika Anda berencana untuk streaming video yang jauh lebih besar dalam dimensi piksel daripada SD, Anda mungkin menemukan bahwa Anda harus menggunakan VPS yang lebih kuat. Saya ingin tahu tentang hal ini dan menjalankan streaming utama saya hingga 1280x960 piksel dan 2Mbps - menempatkan beban tambahan pada hal-hal. Tetapi VPS masih hanya menggunakan 50% CPU dan penggunaan memori tetap pada 100MB. Saya menambahkan selusin pemirsa / browser dan hampir tidak ada perbedaan pada beban pada VPS — hanya bandwidth yang digunakan naik. Saya yakin bahwa membuat aliran trans-rated tambahan dengan ffmpeg akan terus menambah beban pada sistem.

Saya telah menggunakan server jenis ini di lingkungan produksi dengan antara 50 dan 100 pengguna secara bersamaan dan menemukan bahwa penggunaan sumber daya naik sangat sedikit dengan meningkatnya koneksi pemirsa. Percobaan dengan itu. Tapi saya pikir sebagian besar pengguna akan senang menggunakan single-core, 1GB VPS. Nikmati server streaming HLS baru Anda!