pseudostreaming HTTP

Parliamo degli aspetti tecnici di una piattaforma video online on-demand, ovvero di un servizio in Rete che fornisce video su richiesta fruibili da un archivio di contenuti pre-registrati. La soluzione più semplice è quella di rivolgersi ad un video host providers: ce ne sono molti, sia gratuiti (You Tube su tutte) che a pagamento (dai più economici come Vimeo Plus, ai più costosi come Ooyala).
[VEDI IL NOSTRO ARTICOLO → “streaming RTMP vs download progressivo”]

In questo articolo prenderemo in considerazione il caso in cui volessimo noi stessi diventare fornitori del servizio, implementando un video server dedicato allo streaming specifico per la distribuzione di video in tempo reale. Dovremmo in tal caso necessariamente affrontare la parte tecnica ed entrare nel vivo dei meccanismi di funzionamento di uno streaming.

Tale server dovrebbe gestire tutta la parte di distribuzione video attraverso un protocollo come l’RTSP (Real Time Streaming Protocol) in grado di gestire richieste dei client (come play, pause, ecc..) tipiche dei contenuti video, i quali essendo un flusso di dati continuo in real time, sono gestiti in modo ottimale, a livello di trasporto, dal protocollo UDP, su cui l’RTSP si appoggia.
Ad esempio, per il formato QuickTime, potremmo usare QuickTime Streaming Server o l’alternativa Open Source Darwin Streaming Server, così come lo stesso popolare software VLC (che funziona sia da client che da server). Tuttavia noi qui ci occuperemo del formato Flash (estensione dei file FLV), per il quale il protocollo per lo streaming video è l’RTMP (Real Time Messaging Protocol) sviluppato prima da Macromedia poi da Adobe e basato a livello di trasporto sul protocollo TCP. E’ implementato da software quali Adobe Flash Media Server, o l’alternativa Wowza.

streaming1Un normale web server gestisce contenuti (iper) testuali, ovvero richieste da parte di un client di pagine web collegate tra loro, attraverso lo standard del protocollo HTTP (che si appoggia a livello di trasporto al protocollo TCP). Tale protocollo pur non essendo pensato per lo streaming, potrebbe comunque essere sufficiente a gestire la nostra piattaforma video on-demand, evitandoci il costoso (acquisto o noleggio di un server dedicato) e i relativi complessi interventi di configurazione.
La condizione, ovviamente, è che la nostra piattaforma sia esclusivamente on-demand. In tal caso il protocollo HTTP gestito dal nostro web server (Apache o IIS, ad esempio) potrebbe comunque consentire la visione dei video attraverso la modalità de cosiddetto download progressivo con il quale, il download parte subito e anche la visualizzazione, ma bisogna attendere la “bufferizzazione” (ovvero il caricamento in locale) di una determinata parte del video, prima di poter saltare da un punto all’altro della stesso: il caricamento prosegue progressivamente (in base alla banda della connessione e al bitrate di codifica del file video). Questa funzionalità dello streaming detta random access (accesso casuale), ovvero la possibilità di saltare a qualsiasi parte del video in ogni momento, SENZA che il video venga bufferizzato, ovvero caricato in locale (chiunque abbia visto un video su You Tube o Vimeo lo ha sperimentato).
[VEDI IL NOSTRO ARTICOLO → “streaming RTMP vs download progressivo”]

Tuttavia è proprio questo il caso in cui vi è la possibilità di utilizzare una soluzione che unisce i vantaggi del download progressivo (semplicità e costo quasi zero) a quelli dello streaming (in particolare il random access). Tale soluzione si chiama (pseudo) streaming HTTP.

Si tratta di una sorta di simulazione dello streaming reale (appunto pseudo) che si appoggia al protocollo HTTP, dunque ad un classico web server come Apache a cui va aggiunto un piccolo script PHP, come xmoov, che gestisca le funzionalità del random access ai video richiesti .

Per realizzare ciò abbiamo bisogno di due cose:

  • il meta data injection nei file video distribuiti
  • Un semplice script in PHP da aggiungere alla nostra pagina web che gestisca tali informazioni, come xmoov.

Vediamo il  punto 1.
Per poter essere distribuito sul web un video deve essere codificato correttamente (encoding) in un formato adatto come Flash Video (FLV con codec H.263 o H.264) a tale scopo esistono molte soluzioni software (Sorenson Squeeze, Adobe Media Encoder, FFmpeg, ecc..). I file video così ottenuti hanno anche dei metadati (informazioni sul file in formato xml), indispensabili al player video per poter saltare da un punto all’altro del video. Ma alcuni programmi di encoding, come FFmpeg, mettono alla fine del file video i metadati, costringendo il player al caricamento dell’intero file. Al contrario sarà necessario collocare tali dati ALL’INIZIO del file in modo che il player da subito saltare in avanti nella timeline e richiedere la posizione della keyframe più vicina dai metadati e passarla al server, il quale invierà il file a partire da tale posizione.
Possiamo usare il software FLV MetaData Injector (FLVMDI) scaricabile da qui.

Vediamo il punto 2.
Esso è da eseguire nel caso la nostra pagina web sia gestita da un web server generico come Apache. Se abbiamo la possibilità di scegliere un web server da installare potremmo usare, ad esempio, LightTPD che incorpora nativamente le funzionalità di streaming e il random access.
Una volta che il nostro file video è stato “trattato” (vedi punto 1) avrà incorporati i meta tag relativi alle informazione di tempo che saranno interpretabili dal nostro script PHP xmoov.php (scaricabile da qui) rilasciato sotto licenza Creative Commons e che gira su “normali” server con PHP 4 (o superiori). Cosa fa tale script? Trasforma il nostro web server in una sorta di server di streaming, facendo essenzialmente 3 cose:

  • gestisce le richieste dal player, adeguando la qualità video alla larghezza di banda del client (bandwidth throttling)
  • inibisce la memorizzazione delle informazioni del filmato nella cache del browser
  • gestisce la funzionalità random access

In tal modo saremo in grado di gestire a richiesta al server dei video attraverso xmoov e a partire da un certo punto (keyframes) del filmato e potremo passare direttamente la richiesta dal browser via GET in modo simile a questo:

http://openstream.tv/xmoov.php?file=AEF2012-3.flv

Il video in questione è gestito analogamente a quanto avviene nel più importante server di streaming del mondo: You Tube. Il video relativo all’URL seguente viene gestito dalla piattaforma YouTube attraverso le due variabili GET, “v” e “t”. E sarà il video identificato dalla variabile “v” e partirà non dall’inizio, bensì dalla posizione indicata dalla variabile “t”, ovvero a 1′ e 28”:

http://www.youtube.com/watch?v=o322TIvmqtc&t=1m28s

E’ necessario fare alcune configurazioni di base di xmoov editando tale file, la principale delle quali è l’indicazione della directory dove sono presenti i file video:
define('XMOOV_PATH_FILES', 'video/');
Questa è la parte più delicata della configurazione dello script in quanto a volte crea problemi l’indicazione del percorso in termini assoluti o relativi. Consiglio di fare alcune prove..
Lo scopo è quello di arrivare ad avere una piattaforma video on-demand che funzioni con la stessa logica di You Tube, ovvero che gestisca i video attraverso il passaggio di una semplice variabile GET con il nome del file video conservato nel server. Nell’esempio sotto, tale variabile è “video”:

http://openstream.tv/xmoov.php?file=sigla.flv
http://openstream.tv/xmoov.php?file=jingle.flv

Tali url consentiranno al nostro browser di aprire il player video predefinito e visualizzare il file video indicato. Nel mio caso il sistema lancia di default VLC..
Ovviamente è anche possibile fare l’embedding del player all’interno della pagina HTML con il “vecchio sistema”, incorporando il codice.

Nota importante: Nel caso in cui disponiamo dell’accesso al server in modo da poter installarci software (se ad esempio abbiamo un server dedicato o un VPS), è possibile aggiungere moduli ad Apache e dunque funzionalità ulteriori, quali ad es.:

  • l’installazione degli applicativi FFmpeg e Flvtool2 nel server provvederà alla codifica corretta in automatico dei file caricati nella piattaforma e all’inserimento dei metadati, in modo da evitare di doverlo fare manualmente lato client
  • l’installazione del modulo di Apache mod_h264_streaming consentirà la gestione dei file con estensione mp4. Per l’installazione e configurazione di tale modulo vedi, ad esempio, questo articolo.
  • E’ anche possibile installare il modulo mod_flvx che serve a far gestire direttamente ad Apache lo pseudostreaming dei file flv (grossomodo assolve alle funzioni viste sopra per lo script xmoov.php). Per le istruzioni di installazioni vedi questo articolo.

 

A questo punto non resta che un ultimo passaggio: l’aggiunta nella pagina HTML del codice Javascript che genera il player SWF, che farà da contenitore dei nostri file video.

Vediamo quanto spiegato come si implementa nella pratica a livello di codice. Il codice seguente fa riferimento all’ottimo flashpalyer JWplayer e al relativo file jwplayer.js che dovremo caricare nel nostro server assieme ovviamente al file SWF relativo al player flash (vedi sito del JWplayer qui). Il codice javascript definisce le cosiddette flashvar, le variabili che intervengono sui parametri del nostro streaming, in particolare, le due essenziali sono l’indirizzo del file SWF del player e quello del file video:
'flashplayer': "http://openstream.tv/players/video/OSplayer.swf",
'file': "http://openstream.tv/MULTIMEDIA/video/test.mp4"

 

Vediamo un esempio di codice completo e il relativo risultato.

Pseudostreaming HTTP

[wp-js-fiddle url=”http://jsfiddle.net/molven/AADEJ/” style=”width:100%;height:400px;border:solid #4173A0 1px;”]