31/12/2016 · nginx livestream nginx-rtmp-module hls stream

Nginx + HLS ile canlı yayın

Canlı yayın yapmak ve tüm tarayıcılarda sorunsuz yayınlamak mı istiyorsunuz?
Lisans ücreti veya saat başına ödeme yapmak istemiyor musunuz?
Ozaman doğru yerdesiniz :)

Mobil cihazların kullanım oranlarının artması, rtmp protokülü ile yapılan bir canlı yayının flash player ile oynatılması, mobil cihazların flashı desteklememesi ayrıca güncel tarayıcaların flash'a olan desteğini zamanla çekeceğini duyurması yeni teknolojilerin ortaya çıkmasına neden olmuştur.

Biz ise bu ihtiyaca Nginx'in HLS (HTTP Live Streaming) desteğini aktif ederek cevap vereceğiz. HLS desteği rtmp modülü ile birlikte gelmektedir. Biz zaten rtmp modülünü Nginx ile beraber kurmuştuk. HLS yayını tüm tarayıcılarda sorunsuz oynatmak için sadece HLS desteğini aktif etmemiz yeterli olMAyacaktır. Bir de HLS yayını destekleyen player'a ihtiyacımız olacaktır. Böyle bir player biliyorum, yazının sonunda paylaşacağım.

Daha önce Nginx ile canlı yayın isimli makalemde Nginx + Rtmp (Real-Time Messaging Protocol) modülü ile canlı yayın alt yapısını hazırlamıştık.

Nginx'te HLS desteğini aktif etmek için daha önce /etc/nginx/nginx.conf dosyasına eklediğimiz mytv kanalımıza hls parametrelerini ekliyoruz.

sudo nano /etc/nginx/nginx.conf  

Önceki

rtmp {  
    server {
    listen 1935;

        application mytv {
            live on;
        }
    }
}

Sonraki

rtmp {  
    server {
    listen 1935;

        application mytv {
            live on;
            hls on;
            hls_path /tmp/hls;
        }
    }
}

Canlı yayına HTTP protokokü üzerinden erişmek için Nginx'te virtual hostumuza aşağıdaki parametleri ekliyoruz.

Varsayılan host bilgileri nginx.conf dosyası içinde olduğu için buraya ekledim. Siz yeni sanal bir host oluşturup kullanabilirsiniz.

       location /hls {
            types {
                application/vnd.apple.mpegurl m3u8;
                video/mp2t ts;
            }
            root /tmp;
            add_header Cache-Control no-cache;
        }

Benim sunucumda olan /etc/nginx/nginx.conf dosyasını aşağıda paylaşıyorum. Sizinki de buna benzer birşey olması gerekiyor.

user  nginx;  
worker_processes  auto;  
pid /var/run/nginx.pid;

events {  
    worker_connections  1024;
}

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

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';
    sendfile        on;

    server {

        listen       80;
        server_name  localhost;

        location / {
           root   html;
           index  index.html index.htm;
           }

        location /hls {
            types {
                application/vnd.apple.mpegurl m3u8;
                video/mp2t ts;
            }
            root /tmp;
            add_header Cache-Control no-cache;
        }

    }
}

rtmp {  
   server {
       listen 1935;
       application mytv {
           live on;
           hls on;
           hls_path /tmp/hls;
       }
   }
}

Nginx'i yeniden başlatmadan önce nginx -t komutu ile söz dizimi hatası var mı kontrol edin.

sudo service nginx restart  

Nginx sunucusunu yeniden başlattık.

Şimdi Flash Media Encoder'u açıp canlı yayına başlayalım.

FMS URL: rtmp://192.168.10.145:1935/mytv
BACKUP URL:
Stream: canli1

Üstteki url ve stream adıyla sunucuya connect olduktan sonra start'a tıklayıp canlı yayını sunucuya gönderebilirsiniz.

Sunucuya gönderdiğimiz yayının HLS formatına dönüşüp dönüşmediğini anlamak için /tmp/hls dizinin içine bakabilirsiniz. Eğer alttaki gibi dosyalar oluşmaya başladıysa sorun yok demektir.

[[email protected] ~]# sudo ls -l /tmp/hls/
total 156  
-rw-r--r--. 1 nginx nginx 67116 Dec 31 17:13 canli1-0.ts
-rw-r--r--. 1 nginx nginx 75576 Dec 31 17:14 canli1-1.ts
-rw-r--r--. 1 nginx nginx  5264 Dec 31 17:14 canli1-2.ts
-rw-r--r--. 1 nginx nginx   148 Dec 31 17:14 canli1.m3u8

Bu dosyalardan m3u8 uzantılı olan dosya bizim ana dosyamızdır ve player'da bunu kullanacağız.

Canlı yayın için Clapper player'ı tercih ediyorum. Bu player m3u8 yani HLS yayınları tüm cihazlarda sorunsuz olarak oynatmaktadır. Çok güzel bir player ve yazının sonunda kaynak olarak paylaştım detaylı olarak inceleyebilirsiniz.

Clapper'ın desteklediği formatlar. Gördüğünüz gibi HLS yi tümünde destekliyor.

Canlı yayını aynı sucunu üzerinden izlemek için Nginx'in varsayılan karşılama sayfanın bulunduğu dizine /etc/nginx/html/ canli1.html adında bir dosya oluşturup aşağıdaki html kodlarını ekliyoruz.

Html kodlarında gördüğünüz gibi Clapper için gerekli JS (Java Script) dosyası CDN (Content Delivery Network) olarak eklenmiştir.

sudo nano /etc/nginx/html/canli1.html  

Nano ile canli1.html dosyayı oluşturup aşağıdaki kodları ekliyoruz.

<html>  
<head>  
  <script type="text/javascript" src="https://cdn.jsdelivr.net/clappr/latest/clappr.min.js"></script>
</head>

<body>  
  <div id="player"></div>
  <script>
    var player = new Clappr.Player({source: "http://192.168.10.145/hls/canli1.m3u8", parentId: "#player"});
  </script>
</body>

</html>  

Bu kodları istediğiniz bir web sayfasında kullanabilirsiniz.

Canlı yayın artık hazır!
Band genişliğinize ve sunucu performansınıza göre dilediğiniz gibi yayın yapabilirsiniz.

Sorularınız için yorum kısmını kullanabilirsiniz.
Başka bir makalede görüşmek üzere.

  1. Clapper Player http://clappr.io/