Università degli studi di Padova
Facoltà di scienze MM. FF. NN.
Laurea in Informatica
Progettazione di una piattaforma per lo
streaming video e la sincronizzazione di
contenuti multimediali
Laureando: Roberto Baldin
Matricola: 561592
Relatore: Dott.ssa Ombretta Gaggi
Anno accademico 2008/2009
Indice
1 Introduzione
1
1.1
Descrizione dell’azienda QBGROUP . . . . . . . . . . . . . . . . . . . . . .
1
1.2
Descrizione dello stage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
2
2 Streaming server
2.1
2.2
2.3
Introduzione . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
5
2.1.1
Concetto di streaming, storia e protocolli . . . . . . . . . . . . . . .
5
2.1.2
Confronto tra progressive download, pseudo streaming e
streaming . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
6
Scelta del server di streaming . . . . . . . . . . . . . . . . . . . . . . . . . .
7
2.2.1
Configurazione hardware e software del server . . . . . . . . . . . . .
7
2.2.2
Soluzioni individuate . . . . . . . . . . . . . . . . . . . . . . . . . . .
8
2.2.3
Installazione di Adobe Flash Media Streaming Server . . . . . . . .
8
2.2.4
Installazione di Red5 Media Server . . . . . . . . . . . . . . . . . . . 11
2.2.5
Installazione di Windows Media Services . . . . . . . . . . . . . . . . 15
2.2.6
Confronto tra le soluzioni e benchmark . . . . . . . . . . . . . . . . . 16
Completamento configurazione del server di streaming . . . . . . . . . . . . 17
2.3.1
Problematiche di accessibilità dei contenuti . . . . . . . . . . . . . . 17
2.3.2
Scelta del client . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
2.3.3
Formati e caratteristiche dei video . . . . . . . . . . . . . . . . . . . 21
2.3.4
Automazione della procedura di conversione . . . . . . . . . . . . . . 25
3 Sincronizzazione di contenuti multimediali
3.1
5
31
Introduzione . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
3.1.1
Strumenti e tecnologie utilizzate . . . . . . . . . . . . . . . . . . . . 32
3.1.2
SMIL: Synchronized Multimedia Integration Language . . . . . . . . 36
i
3.2
Sviluppo di un’applicazione web per la sincronizzazione di contenuti multimediali . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
3.2.1
Sviluppo di un’applicazione per la sincronizzazione tra video e slide
39
3.2.2
Sviluppo di un player SMIL per il web . . . . . . . . . . . . . . . . . 46
4 Conclusioni
57
Ringraziamenti
59
ii
Capitolo 1
Introduzione
Negli ultimi anni, si è assistito ad un interesse crescente verso le tecnologie per lo streaming di contenuti multimediali attraverso la rete ed, in particolare, attraverso Internet;
la diffusione della banda larga e l’aumento delle prestazioni dei calcolatori ne sono stati
contemporaneamente la causa e l’effetto. Aree applicative come e-learning, entertainment
e telemedicina sono solo alcuni degli esempi dove streaming e video on-demand risultano
di rilevanza critica, ma in molti altri campi queste tecnologie si stanno facendo avanti,
rivestendo sempre maggiore interesse per le aziende.
1.1
Descrizione dell’azienda QBGROUP
L’azienda QBGROUP [1] lavora nel settore della sanità. La principale caratteristica,
che le permette di differenziarsi dalle altre nello stesso ambito, consiste nella particolare
attenzione che dedica alle nuove tecnologie. I clienti dell’azienda possono essere riassunti
in aziende farmaceutiche, società scientifiche, strutture sanitarie pubbliche e private, e
altri enti o aziende che operano nell’ambito medicosanitario. Per rispondere in modo
mirato alle esigenze dei clienti, QBGROUP è formata da cinque divisioni specializzate che
collaborano tra loro:
• etiCRO: studi e ricerche
• Medilon: strategie Internet
• CAtedra: formazione
• Telèmesys: strumenti e telemedicina
• QUBIsoft: tecnologie informatiche
In particolare, etiCRO può essere definita come una Contract Research Organization,
ovvero un’organizzazione di servizio che offre appoggio all’industria farmaceutica/biotecnica. Si focalizza principalmente nell’epidemiologia clinica, nelle ricerche osservazionali e
negli studi di management sanitario. Medilon si occupa di realizzare siti internet italiani
all’avanguardia per la medicina specialistica, i pazienti e le società scientifiche. CAtedra è
la divisione specializzata nella realizzazione di corsi e percorsi di aggiornamento e approfondimento rivolti ai medici e agli operatori sanitari. Rivolge particolare attenzione alle
1
nuove tecnologie, utilizzandole per fornire una formazione innovativa. Telèmesys concentra
l’attenzione nella progettazione, realizzazione e distribuzione di strumenti elettromedicali,
atti soprattutto al telemonitoraggio di pazienti con patologie croniche. Utilizza la rete
Internet per la trasmissione, la visualizzazione e l’analisi dei dati. Infine QUBIsoft è la divisione il cui compito è progettare e sviluppare tecnologie informatiche in ambito sanitario.
QUBIsoft agisce sia per clienti esterni, rispondendo adeguatamente ai bisogni del mondo
sanitario, sia per l’azienda stessa, studiando e implementando le tecnologie informatiche
a supporto dei progetti sviluppati da QBGROUP.
1.2
Descrizione dello stage
Sono molti i campi applicativi in cui le soluzioni di streaming di contenuti multimediali,
sia live che on-demand, risultanto di grande interesse per l’azienda QBGROUP. Lo stage
nasce però inizialmente dall’esigenza di aggiornare la propria offerta relativa ad un portale
web: eDott [2].
eDott è un portale dedicato alla formazione e all’aggiornamento dei medici, nato nel
2000 e che conta oggi oltre 30 mila utenti registrati. Sin dalla nascita, il portale offre ai
visitatori gran parte dei contenuti in formato video, siano essi corsi di formazione, interviste a esperti di rilievo in ambiente medico, presentazioni di nuovi farmaci o registrazioni di
convegni. Attualmente il portale offre questo tipo di contenuti utilizzando la tecnica progressive download, che consente unicamente un accesso sequenziale ai dati: in pratica non
è possibile, usando questa tecnica, scegliere arbitrariamente dove iniziare la riproduzione
del video senza prima scaricare tutti i dati dall’inizio del video sino al punto scelto. Negli
ultimi anni però l’aspettativa dell’utente è cresciuta e QBGROUP ha deciso di allineare la
sua offerta a quella dei grandi portali e delle community di condivisione video. L’azienda
non può in effetti sfruttare le funzionalità offerte da questi portali, trattando materiale
relativo all’ambito medico che non può essere reso pubblico indiscriminatamente. In questo campo, l’adozione di un server di streaming consente maggior controllo sugli accessi e
quindi maggior sicurezza; inoltre usando una tecnologia di streaming, il client, al termine della visualizzazione, non ha una copia del media sul proprio computer. Non ultimo,
l’aggiornamento dell’offerta permetterebbe anche di ospitare trasmissioni live e non solo
on-demand.
Lo stage si prefigge in primo luogo l’obiettivo di studiare le soluzioni esistenti in materia
di streaming server, scegliere e quindi provare sul campo le opzioni ritenute più valide, in
merito a prestazioni, costi, scalabilità e flessibilità. Una seconda fase prevede lo studio delle
problematiche di accessibilità dei contenuti multimediali; in questo caso con accessibilità
si intendono in particolare le limitazioni dovute all’infrastruttura tecnologica con cui si
intende accedere ai contenuti, quindi configurazione del client e configurazione della rete.
L’ultima fase di questa prima parte di stage prevede infine lo studio delle caratteristiche
dei video da pubblicare. La scelta del formato e di altre caratteristiche, quali ad esempio
il bitrate di codifica, non sono infatti da trascurare e dovrebbero essere commisurate al
traffico reale di visitatori. Scelti questi parametri, si intende infine realizzare una procedura
per automatizzare le operazioni di conversione.
Per provare in maniera adeguata quanto svolto nella prima parte di stage, si è deciso
di realizzare un piccolo applicativo di interesse per l’azienda. L’esigenza è quella di crea2
re un software per la sincronizzazione di video e slide, che faccia naturalmente uso delle
tecnologie opportunamente approntate in precedenza e che sia il più accessibile possibile;
anche in questo caso il termine accessibile è usato per indicare la volontà di raggiungere il
massimo numero di utenti, indipendentemente dalla piattaforma di lavoro. L’ultima fase
dello stage, inizialmente non prevista nel piano, ha visto il potenziamento dell’applicativo
creato in precedenza, fino a renderlo un player in grado di interpretare un sottoinsieme
del linguaggio SMIL.
Di seguito sono esposti due diagrammi Gantt con il piano preventivo dello stage, uno
relativo alla prima parte e l’altro relativo alla seconda.
Figura 1.1: piano preventivo della prima parte dello stage
Durante il primo periodo dello stage il lavoro è stato incentrato principalmente sull’installazione, la configurazione e il test del server di streaming.
Rispetto a quanto previsto nel piano vi sono state poche variazioni; si sono verificati infatti
alcuni piccoli ritardi in alcune attività, che sono però stati compensati da altre attività
che si sono svolte in minor tempo. Alla fine si è scelto tra l’altro di installare e studiare
tre diverse soluzioni di streaming e non due, come inizialmente preventivato.
Figura 1.2: piano preventivo della seconda parte dello stage
Nella seconda parte dello stage ci si è concentrati principalmente su aspetti più applicativi
e si sono in particolare sviluppati alcuni software che fanno uso del server di streaming
predisposto precedentemente. In questo caso si sono verificati dei forti ritardi iniziali dovuti ad alcuni problemi esterni e non prevedibili (vedi paragrafo 2.2.4). Per poter tornare
in linea con il piano è stato necessario accelerare alcune attività ed eliminarne una, considerata di minor importanza. Inizialmente si era infatti previsto di sviluppare un sistema
che permettesse agli utenti di caricare i propri video in uno spazio web apposito; in seguito quest’attività è stata eliminata, in quanto l’azienda dispone già di alcune applicazioni
dedicate all’upload di contenuti sul web, e sarebbe sufficiente adattare una di queste per
ottenere il servizio voluto, senza svilupparne un’applicazione da zero.
Alla fine si è avanzato del tempo rispetto al piano iniziale, perciò si è creato lo spazio
CAPITOLO 1. INTRODUZIONE
3
necessario per un’ultima attività di interesse per l’azienda e cioè lo sviluppo del player
web per SMIL; per poterla completare è stato però necessario prolungare lo stage di una
settimana.
4
Capitolo 2
Streaming server
2.1
2.1.1
Introduzione
Concetto di streaming, storia e protocolli
Il termine stream indica, in ambito multimediale, un flusso di dati; la terminologia usa
la metafora di un flusso d’acqua che si sposta attraverso delle condutture, espandendosi
e riducendosi a seconda della dimensione delle stesse. In maniera simile, il media inizialmente presente sul server di streaming viene spezzato in diversi pacchetti più piccoli
(detti appunto stream), poi è trasmesso attraverso la rete e quando giunge a destinazione
è decompresso e infine riprodotto. Il vantaggio principale nell’utilizzo di una trasmissione
in streaming è quello di non dover attendere di ricevere interamente il media prima di
poter iniziare la riproduzione; per questo scopo sono state comunque realizzate alcune
tecniche in grado di lavorare con HTTP e che saranno discusse più approfonditamente nel
paragrafo 2.1.2.
Nel campo della trasmissione di contenuti multimediali, le tecnologie di streaming hanno cominciato a diffondersi solo nella seconda metà degli anni novanta. In precedenza per
distribuire questo tipo di contenuti, la soluzione più comune era quella di rendere disponibili i file per lo scaricamento tramite l’utilizzo di un server web. I limiti di questa soluzione
erano già noti da tempo, ma per poter migliorare l’offerta era necessario prima potenziare
fortemente le infrastrutture sottostanti, in particolare per quanto riguarda l’ampiezza di
banda e la potenza dei calcolatori (in termini di velocità di calcolo e di trasferimento dati
nel bus).
Quando le condizioni furono favorevoli, l’interesse per questa tecnologia crebbe fortemente. HTTP si rivelò essere inadatto alle trasmissioni in streaming, per cui furono
ideati opportunamente alcuni protocolli a livello di applicazione. Il più celebre fu Real
Time Streaming Protocol (RTSP), ideato nel 1998 da IETF e pubblicato nella RFC2326
[3]. RTSP lavora in congiunzione con altri due protocolli: Real-time Transport Protocol
(RTP), che si occupa dell’effettiva trasmissione del flusso di dati e Real-Time Control
Protocol (RTCP) che si occupa del controllo e della qualità di servizio (QoS)1 . Real Time Streaming Protocol offre dei comandi simili a quelli di un videoregistratore; oltre ai
normali comandi di setup iniziale, ci sono infatti
1
Il termine qualità di servizio indica alcuni parametri di rete, quali banda, ritardo, jitter, probabilità
di perdita di pacchetti, ecc. Tali parametri sono utili nell’inizializzazione della connessione.
5
• PLAY, che richiede la riproduzione di un media
• PAUSE, che ferma temporaneamente la riproduzione
• TEARDOWN, che ferma definitivamente la riproduzione e chiude la connessione
(STOP)
• RECORD, che registra su disco la trasmissione
Oggi RTSP è molto diffuso e tutti i maggiori player permettono la riproduzione di stream
RTSP. La sua diffusione però si limita ai player standalone, come Windows Media Player,
QuickTime, Real Player, VLC Media Player, ecc, eventualmente integrati nei browser
sotto forma di plug-in (controlli ActiveX su Internet Explorer).
Nel 2003 Adobe sviluppa un proprio protocollo per lo streaming video, Real Time
Messaging Protocol (RTMP); l’obiettivo primario di questo lavoro è il supporto alla trasmissione di contenuti Flash video. Inizialmente RTMP è proprietario e così rimane fino a
gennaio 2009, quando Adobe ne annuncia l’apertura entro la prima metà dello stesso anno.
Curiosamente, la stessa azienda decide di bloccare in seguito lo sviluppo di un progetto
open source ospitato su sourceforge [4], appellandosi al Digital Millennium Copyright Act
(DMCA) nel maggio 2009. Il progetto, rtmpdump, era un’implementazione di alcune specifiche RTMP individuate tramite reverse engineering, e mirava a memorizzare dei flussi
RTMP su disco [5]. Nel giugno 2009 Adobe rilascia definitivamente le specifiche complete
del proprio protocollo [6].
RTMP contiene molti dei comandi già visti in RTSP e aggiunge inoltre il comando SEEK
che permette di spostarsi ad un qualsiasi punto della timeline (anche RTSP permette di
effettuare le operazioni di seeking, ma solo attraverso il campo Range del comando PLAY;
non esiste quindi un comando esplicito SEEK). Real Time Messaging Protocol lavora in
maniera predefinita sulla porta 1935 e usa TCP al livello di trasporto. Per superare alcune limitazioni dovute a infrastrutture di rete particolarmente protette, RTMP può essere
anche incapsulato in pacchetti HTTP e viaggiare su porta 80; in questo caso si parla di
RTMP Tunneled (RTMPT). Esiste infine RTMP Secure (RTMPS), che lavora esattamente
come RTMPT, ma su pacchetti HTTPS e su porta 443.
Per concludere questa breve presentazione, è doveroso citare il prossimo avvento di
HTML5 che include un tag <video> che potrebbe in futuro eliminare l’esigenza di utilizzare
plug-in per la visualizzazione di video tramite browser. Ad oggi, però, non è chiaro se
saranno supportati protocolli di streaming per l’attributo src o come i diversi browser
decideranno di implementare questa funzione, per esempio per quanto riguarda l’interfaccia
per controllare la riproduzione.
2.1.2
Confronto tra progressive download, pseudo streaming e
streaming
Il progressive download, già citato in precedenza, è il modo più semplice per trasmettere dei
contenuti multimediali attraverso la rete. Il media è diviso in frammenti, incapsulati poi in
pacchetti HTTP insieme ad un header che contiene alcune informazioni (come la durata,
nel caso di un audio o un video); i pacchetti sono poi inviati a destinazione in ordine. Non
occorre attendere l’arrivo di tutti i pacchetti per iniziare la riproduzione, tuttavia non è
6
possibile scegliere arbitrariamente dove iniziare la riproduzione. Inoltre a destinazione è
necessario riordinare e memorizzare i vari frammenti del media su disco, di conseguenza al
termine della ricezione sul client sarà disponibile una copia esatta del media. Questo può
essere un problema serio nel caso in cui il video sia protetto da diritti d’autore o non si
desidera comunque che sia diffuso liberamente, per esempio perché contiene informazioni
riservate. La tecnica del progressive download è stata utilizzata per la prima volta per la
trasmissione delle immagini in formato jpeg ed è molto usata anche oggi per questo tipo
di media.
Per risolvere il problema dell’accesso casuale al media si può far uso di script lato server;
in questo caso si parla di HTTP pseudo-streaming. Lo script si occupa di interpretare le
richieste di seek del client e di costruire opportunamente i pacchetti del media dal punto
richiesto in poi. Questa soluzione è economica e non è difficile da mettere in pratica; per
questo motivo è molto diffusa ed è usata anche da grandi community, come per esempio
Youtube.
Con l’utilizzo di un server di streaming si può fare un ulteriore passo in avanti, permettendo non solo l’accesso casuale, ma rendendo inutile il caching del media sul client.
In questo modo si riesce ad evitare, o quanto meno limitare, la diffusione non controllata
di materiale confidenziale o protetto da diritti d’autore. È sempre possibile memorizzare
su disco uno stream, ma l’operazione non è banale e comunque lato server si ha maggior
controllo ed è quindi possibile individuare più facilmente eventuali client sospetti. In genere, inoltre, un server di streaming permette anche un discreto risparmio di traffico rispetto
alla soluzione pseudo-streaming; questo comunque non è sempre vero: in caso di numerosi
seek da parte del client, per esempio, il traffico può risultare molto più elevato.
2.2
2.2.1
Scelta del server di streaming
Configurazione hardware e software del server
Per effettuare test esaustivi sulle soluzioni di streaming individuate, si è reso necessario
disporre di un ambiente di test opportuno. L’azienda dispone di diversi server Dell, alcuni
dei quali fortemente orientati alla virtualizzazione. Mi è stata fornita quindi una macchina
virtuale vuota in uno di questi server, dove ho provveduto ad installare personalmente Microsoft Windows Server 2008. Grazie alla partnership con Microsoft, la licenza del server
è risultata gratuita, di conseguenza tutti i test sono stati fatti a costo zero.
Le specifiche hardware e software dell’ambiente di test sono:
CPU: Intel Xeon E5520 @ 2.27GHz
Memoria: 512MB
Sistema operativo: Microsoft Windows Server 2008 SP1 - edizione 32 bit
Per completezza, la soluzione di virtualizzazione adottata dall’azienda è VMware Server
[7], un prodotto gratuito di VMware Inc., che permette di gestire diverse macchine virtuali
attraverso un’interfaccia web di amministrazione, anche in maniera remota.
CAPITOLO 2. STREAMING SERVER
7
2.2.2
Soluzioni individuate
Dopo un attento studio delle soluzioni in commercio, si è deciso di proseguire lo studio
solo sulle seguenti soluzioni:
• Red5: software libero
Supporta i formati: FLV, AAC, and MP3
Costo: 0
Sito web: http://osflash.org/red5
• Windows Media Services 2008: soluzione di Microsoft, proprietaria
Supporta i formati: WMA, WMV, ASF, MPEG e MP3
Costo: 0 (compreso con la licenza server di Microsoft)
Sito web: http://technet.microsoft.com/it-it/library/cc645570.aspx
• Flash Media Streaming Server: soluzione di Adobe, proprietaria
Supporta i formati: FLV, MP3, AMF, MPEG4, H264
Costo: circa 1200 euro, oppure gratuito fino a 10 stream, ma solo per uso non
commerciale
Sito web: http://www.adobe.com/products/flashmediastreaming/features
• Helix Server: soluzione di RealNetworks
Supporta i formati: FLV, MP3, AMF, MPEG4, H264, formati Real e altri ancora
Costo: da 1500 a 10000 dollari, gratuito fino a 5 stream
Sito web: http://www.realnetworks.com/products/media_delivery.html
• Wowza Media Server: soluzione di Wowza Media System, proprietaria
Supporta i formati: FLV, MP3, AMF, MPEG4 (solo nelle versioni a pagamento),
H264
Costo: 65$ al mese, o 995$ per licenza illimitata. Versione gratuita fino a 10 stream
e senza supporto a MP4.
Sito web: http://www.wowzamedia.com/pricing.html
A causa dell’elevato costo di licenza, Helix Server è stato scartato prima dell’inizio dei
test. Analogamente, anche Wowza Media Server è stato scartato, perchè offre funzionalità
molto vicine a quelle di Adobe Flash Media Streaming Server, ad un prezzo simile. I
test sono quindi proseguiti unicamente su Adobe FMS, Red5 e Windows Media Services.
L’installazione, la configurazione e la prova d’uso degli stessi è descritta nei prossimi
paragrafi.
2.2.3
Installazione di Adobe Flash Media Streaming Server
Flash Media Streaming Server è la soluzione offerta da Adobe nel campo dello streaming.
La controparte client è Adobe Flash Player, un plugin disponibile per tutti i maggiori
browser, in grado di eseguire delle piccole applicazioni, note come filmati Shockwave Flash.
Nato nel 1996 dall’azienda FutureWave, è stato acquisito prima da Macromedia e poi da
Adobe nel 2004. Inizialmente pensato per portare la grafica vettoriale e alcune semplici
animazioni sul web, oggi Flash è prevalentemente utilizzato per la creazione di contenuti
web accattivanti e per l’inserimento di oggetti multimediali nelle pagine web. Diverse
8
statistiche affermano che le ultime versioni del Flash Player sono presenti in oltre il 97%
dei computer che navigano su Internet, e per questo motivo questa tecnologia, e la sua
controparte server, destano molto interesse per le aziende2 .
Adobe Flash Media Server è presente in tre versioni: Interactive, Streaming e Development. La prima versione è indicata per le aziende che vogliono sviluppare applicazioni
con tecnologia Flex, mentre la seconda si limita ad offrire le funzionalità per lo streaming
dei media. È inoltre possibile provare gratuitamente Adobe Flash Media Server, scegliendo la versione Development [8]. A differenza della versione completa, questa permette la
connessione concorrente di soli 10 utenti nello stesso momento, ma per la fase di testing
si è rivelata più che adatta.
L’installazione è guidata e risulta molto semplice; durante la stessa ci è chiesto di inserire
un nome utente e una password da utilizzare per accedere all’interfaccia di amministrazione. Una volta terminata l’installazione, sulla macchina sono attivi tre servizi:
Figura 2.1: installazione di Adobe Flash Media Streaming Server
• Il demone RTMP standard, sulla porta 1935
• Il demone RTMP Tunneled, sulla porta 80
• Un server web per l’amministrazione, sulla porta 1111.
Attraverso Start > Programmi > Adobe > Flash Media Server > Flash Media Administration Console, è possibile accedere all’interfaccia web di amministrazione, visibile in
figura 2.2.
La versione Development è una versione limitata di Adobe Flash Media Interactive Server,
2
Uno studio condotto per conto di Adobe nel settembre 2009 da una grande azienda in campo di
ricerche di mercato, Millward Brown, indica che il Flash player è installato in oltre il 99% dei computer
desktop nei mercati maturi, mentre si ferma al 97% nei mercati cosiddetti emergenti [9]. Altre statistiche
che riportano dati simili, pur se individuati con metodologie differenti, sono presenti sul sito StatOwl.com
[10]
CAPITOLO 2. STREAMING SERVER
9
Figura 2.2: interfaccia web per l’amministrazione di Adobe Flash Media Streaming Server
quindi contiene anche le funzionalità per lo sviluppo di applicazioni con tecnologia Flex3 ;
per questa ragione, dall’interfaccia di amministrazione è possibile trovare le voci apposite
per creare directory per le applicazioni, creare utenti, ecc.
È anche possibile controllare e amministratore i client che accedono ad una risorsa, come
per esempio un media in streaming (figura 2.3). In questo modo risulta facile ottenere dei
log di accesso alla risorsa e quindi individuare eventuali client sospetti; per esempio, può
capitare che l’indirizzo del media in streaming sia usato in pagine web esterne a quelle
dell’azienda, senza autorizzazione. In questo caso è possibile effettuare un controllo incrociato tra le informazioni contenute nei log del server di streaming e quelle contenute nei
log del server web per individuare gli utenti non autorizzati; naturalmente si tratta di una
procedura delicata che dev’essere progettata in maniera accurata, però in questo momento
si vuole solo evidenziare la possibilità di effettuare controlli di questo tipo, senza scendere
troppo nel dettaglio della loro implementazione.
Il server di streaming e il server di amministrazione sono due servizi distinti e si possono
attivare in maniera indipendente.
Per creare una directory dove inserire i media da rendere disponibili per lo streaming, è
sufficiente fare clic su New Instance, nella scheda View Application. Quando si crea
3
Adobe Flex [11] è un ambiente di sviluppo per applicazioni web sofisticate nato nel 2004. Questa
tecnologia richiede l’utilizzo di Adobe Flash Player per poter eseguire le applicazioni, ma non soffre dei
problemi di incompatibilità tra browser che si possono verificare con altre tecnologie. A differenza delle
applicazioni realizzate con Adobe Flash Professional, Flex non utilizza il paradigma delle animazioni per
lo sviluppo di applicazioni, ma un più comune linguaggio imperativo (ActionScript), in modo da rendere
più semplice il lavoro degli sviluppatori. Un esempio interessante di applicazione realizzata con tecnologia
Flex è Photoshop Express, una versione web del famoso strumento di fotoritocco di Adobe [12]
10
Figura 2.3: interfaccia per l’amministrazione degli utenti e delle risorse
una nuova istanza, viene creata anche una directory su disco, all’interno della directory
application dove è installato Adobe FMS; con essa vengono create anche due subdirectory annidate: streams e _definst_ ed è all’interno di quest’ultima che vanno inseriti
i media da pubblicare. Quando si specifica l’url del media è sufficiente indicare il nome
dell’applicazione e non quello delle subdirectory.
Esempio: se si è creata l’applicazione esempio, i media vanno inseriti nella directory
C: \ percorso_di_installazione_di_Adobe_FMS \ a p p l i c a t i o n \ e se m pi o \ s t r e a m s \ _ d e f i n s t _
e l’URL da usare per accedere al media è rtmp://nome_host/esempio/nome_media.
Il file di configurazione principale di Adobe FMS è fms.ini e si trova nella directory
conf dove si è installato il server. All’interno di questo file si possono modificare i parametri
immessi durante la fase di installazione, come nome e password dell’utente amministratore,
porte su cui avviare i servizi, percorsi, ecc.
2.2.4
Installazione di Red5 Media Server
Red5 Media Server [13] è uno streaming server open source che usa il protocollo RTMP e
lavora con tecnologia Flash; è generalmente considerato come un’alternativa libera e gratuita alla soluzione di Adobe. Nasce nel settembre 2005 da una comunità di appassionati
della tecnologia Flash e dell’ideologia open source, senza alcuna direzione aziendale alle
spalle. Poichè all’inizio del lavoro le specifiche di RTMP non sono libere, gli sviluppatori sono costretti ad adottare tecniche di Reverse Engeenering; nonostante ciò riescono a
realizzare una versione funzionante del server già per la fine dello stesso anno. Negli anni
seguenti il lavoro procede senza sosta, attirando un pubblico sempre maggiore ed anche
CAPITOLO 2. STREAMING SERVER
11
alcuni nomi importanti; tra i tanti, anche il social network Facebook utilizza Red5 per la
gestione dei video caricati dagli utenti [14].
Oggi il progetto è arrivato alla versione 0.8 ed è in grado di trasmettere in streaming, media
nei formati FLV, MP3 e AAC. Una versione in grado di lavorare anche con MPEG4 Part
10, un formato video ad alta definizione, è in via di sviluppo e dovrebbe essere rilasciato
a breve (la versione 0.9 RC2 è stata rilasciata a novembre 2009).
Red5 per Microsoft Windows è disponibile in tre versioni: installer binario, servlet da
usare in congiunzione con Apache Tomcat e codice sorgente. La soluzione più semplice
per provare questo server di streaming è tramite l’utilizzo dell’installer.
Figura 2.4: installazione di Red5
I servizi attivi al termine della configurazione sono:
• RTMP standard: in ascolto sulla porta 1935
• Server web: in ascolto su una porta specificata in fase di installazione (default: 5080).
Questa versione di Red5 incorpora un server web (Apache Tomcat), che è possibile utilizzare liberamente per caricare le proprie pagine web, ma è anche utile per verificare il
corretto funzionamento del server di streaming e per accedere al pannello di amministrazione.
Per avviare gli altri servizi offerti da Red5, occorre modificare il file red5-core.xml all’interno della directory conf dove si è installato il server, decommentando la parte desiderata.
Per esempio, per attivare RTMP Tunneled, bisogna decommentare il blocco XML
<bean i d ="rtmpt . s e r v e r " c l a s s =" o r g . r e d 5 . s e r v e r . tomcat . rtmpt . RTMPTLoader " i n i t −
method=" i n i t " l a z y −i n i t =" t r u e ">
<p r o p e r t y name=" webappFolder " v a l u e ="$ { r e d 5 . r o o t }/ webapps " />
<p r o p e r t y name=" c o n n e c t o r ">
<bean c l a s s =" o r g . apache . c a t a l i n a . c o n n e c t o r . Connector ">
<c o n s t r u c t o r −a r g t y p e =" j a v a . l a n g . S t r i n g " v a l u e =" o r g . apache .
c o y o t e . h t t p 1 1 . H t t p 1 1 N i o P r o t o c o l " />
<p r o p e r t y name=" p o r t"><v a l u e >$ { rtmpt . p o r t }</ v a l u e ></
property>
12
<p r o p e r t y name=" e n a b l e L o o k u p s"><v a l u e >f a l s e </v a l u e ></
property>
</bean>
</p r o p e r t y >
<p r o p e r t y name=" c o n n e c t i o n P r o p e r t i e s ">
<map>
<e n t r y key=" maxKeepAliveRequests " v a l u e ="$ { rtmpt .
max_keep_alive_requests }"/>
<e n t r y key=" u s e E x e c u t o r " v a l u e =" t r u e "/>
<e n t r y key="maxThreads " v a l u e ="$ { rtmpt . max_threads }"/>
<e n t r y key=" acceptorThreadCount " v a l u e ="$ { rtmpt .
a c c e p t o r _ t h r e a d _ c o u n t }"/>
<e n t r y key=" p r o c e s s o r C a c h e " v a l u e ="$ { rtmpt . p r o c e s s o r _ c a c h e
}"/>
</map>
</p r o p e r t y >
<p r o p e r t y name=" h o s t ">
<bean c l a s s =" o r g . apache . c a t a l i n a . c o r e . StandardHost ">
<p r o p e r t y name="name " v a l u e ="$ { rtmpt . h o s t } " />
<p r o p e r t y name="unpackWARs " v a l u e =" f a l s e " />
<p r o p e r t y name=" autoDeploy " v a l u e =" f a l s e " />
<p r o p e r t y name=" x m l V a l i d a t i o n " v a l u e =" f a l s e " />
<p r o p e r t y name="xmlNamespaceAware " v a l u e =" f a l s e " />
</bean>
</p r o p e r t y >
</bean>
In questo modo si possono attivare i servizi RTMP Tunneled, RTMP Secure e MRTMP
(Multiplexing RTMP), un protocollo sviluppato dalla comunità di Red5, che si occupa
del clustering di servizi RTMP. Per modificare alcune impostazioni, come indirizzi IP e
porte su cui i diversi servizi sono in ascolto, occorre modificare il file di configurazione
red5.properties, che si trova ancora nella directory conf. I media che si intendono rendere disponibili per lo streaming devono essere inseriti nella directory streams all’interno
di una delle subdirectory di webapps dove si è installato il server.
Quando l’installazione è completata, si può accedere all’interfaccia web da un comune
browser (figura 2.5).
Figura 2.5: interfaccia web di Red5 Media Server
CAPITOLO 2. STREAMING SERVER
13
Dalla stessa è possibile accedere ad una lista di dimostrazioni installabili con pochi clic,
utili per conoscere le potenzialità del server di streaming e per verificare che tutto sia
configurato correttamente.
Figura 2.6: installazione di una demo tramite l’interfaccia web di Red5
Figura 2.7: visualizzazione di oflaDemo, una delle dimostrazioni incluse in Red5
Dalla pagina con la lista delle demo di presentazione di Red5 si accede all’interfaccia di
amministrazione del server, dove è possibile visualizzare gli utenti connessi alle diverse
applicazioni ed anche ai singoli stream (figura 2.8).
Red5 è in definitiva una soluzione valida e completa, che non manca di offrire anche
alcune soluzioni particolarmente avanzate. Nonostante ciò, è doveroso indicare la maggior debolezza di questo prodotto: la mancanza di un’azienda alle spalle. L’adozione di
Red5 è, infatti, in qualche modo frenata dalla mancanza di assistenza, di garanzie di funzionamento e dalla scarsa documentazione (quasi completamente presente sotto forma di
mailing list). Una dimostrazione evidente di queste problematiche, si è verificata a luglio
2009, quando Adobe ha rilasciato un aggiornamento di sicurezza del proprio player Flash,
rivedendo la procedura di handshaking iniziale tra client e server; in pratica, con quest’ultimo aggiornamento, non è più possibile ricevere stream RTMP da server Red5 [15]. La
14
Figura 2.8: interfaccia web di amministrazione di Red5
versione attualmente in sviluppo è già stata corretta per risolvere questo problema, ma
non è ancora stata rilasciata in versione stabile.
2.2.5
Installazione di Windows Media Services
Windows Media Services è la soluzione offerta da Microsoft per la trasmissione di contenuti multimediali attraverso la rete. Da Windows Server 2008, WMS non è più integrato
direttamente nel sistema, ma può essere scaricato gratuitamente [16].
Per effettuare l’installazione è sufficiente accedere all’utility Server manager e quindi aggiungere il ruolo Servizi flussi multimediali.
Figura 2.9: Server manager di Windows Server 2008; Windows Media Services come ruolo
CAPITOLO 2. STREAMING SERVER
15
Durante l’installazione viene chiesto se si desidera avviare anche il demone HTTP (porta
80); questo può creare alcuni problemi se è già presente un server web. Queste problematiche saranno discusse nel paragrafo 2.3.1.
Una volta che il servizio Windows Media è installato, è possibile effettuare le operazioni
di configurazione tramite il tool di amministrazione Servizi Windows Media, negli strumenti di amministrazione di Windows. Il tool è molto simile, anche per i nomi usati, a
quello per l’amministrazione del server web Internet Information Services.
Figura 2.10: amministrazione dei servizi Windows Media.
Windows Media Services offre streaming attraverso RTSP, ma anche attraverso MMS
(Microsoft Media Server, un protocollo per lo streaming attualmente ritenuto obsoleto) e
in ultima istanza HTTP, nel caso in cui le altre alternative non dovessero andare a buon
fine. I formati supportati dal server di streaming di Microsoft sono i formati Windows
Media (WMA, WMV), MPEG, ASF e MP3; non è quindi possibile trasmettere in streaming contenuti Flash video (FLV). Questo limite si rivela essere molto importante, in
quanto impone che per la visualizzazione dei media si debba ricorrere a player standalone,
eventualmente integrati nei browser tramite l’utilizzo di plugin. In alternativa, si possono
utilizzare player sviluppati con tecnologia Silverlight, che però risulta essere molto meno
diffusa rispetto al concorrente diretto Flash. Anche queste problematiche saranno discusse
più approfonditamente in seguito.
2.2.6
Confronto tra le soluzioni e benchmark
Dopo aver effettuato alcuni test per verificare le varie funzionalità delle soluzioni individuate, si è passati alla fase di stress test (benchmark). Per questa fase è stato utile usare
le statistiche delle visite del portale attuale e che saranno discusse più in dettaglio nel
16
paragrafo 2.3.3. Tali informazioni comunque hanno portato all’individuazione di un limite
inferiore indicativo, scelto prendendo ogni volta il caso peggiore possibile; questo valore è
48 e indica il numero massimo di utenti che richiedono contemporaneamente la visualizzazione di un media. Si vuole che il server di streaming sia in grado di gestire almeno un
numero di utenti pari al numero di utenti massimo che il sistema attuale è stato in grado
di sopportare.
Si è quindi cercato lo strumento adatto allo scopo e si è individuato un prodotto gratuito,
sviluppato con tecnologia Flex [17]. Lo strumento è in grado di avviare molteplici richieste di flussi RTMP contemporaneamente e lavora egregiamente fino a circa 20 richieste,
dopo le quali comincia a degradare nelle prestazioni, sino al crash completo. Perciò si è
avviato il tool in contemporanea su quattro macchine, arrivando a superare le 100 connessioni concorrenti senza alcun problema per il server di streaming Red5, trascurando il
ragionevole rallentamento della riproduzione. Lo stesso test non si è potuto eseguire sul
server di Adobe, a causa della limitazione a 10 stream concorrenti imposta per la versione
Development. E’ comunque fortemente auspicabile che anche questo server sia in grado
di gestire senza problemi lo stesso numero di client concorrenti, tenendo sempre presente
che questi valori superano largamente il limite inferiore individuato con i dati di visite del
portale attuale.
Per quanto riguarda Windows Media Services, Microsoft mette a disposizione gratuitamente degli strumenti appositi per i test di carico sul proprio server di streaming [18]. Tali
prove sono state svolte con modalità simili a quelle utilizzate per Red5, cioè eseguendo il
test da più macchine e verificando l’impatto delle molteplici richieste sul server. Anche in
questo caso si è riusciti a superare senza difficoltà il centinaio di connessioni concorrenti.
La conclusione che si può trarre dai test di carico è che l’unico limite reale da considerare
è l’ampiezza di banda in upload della connessione dove risiederà il server di streaming, ma
anche questa questione sarà discusa nel paragrafo 2.3.3.
Una volta terminati i test si è arrivati alla conclusione della comparativa tra i server
di streaming ed è quindi giunto il momento di scegliere quale tra quelli valutati si sarebbe
usato per proseguire il lavoro. Nonostante la comodità e la gratuità dell’offerta Microsoft,
essa è stata scartata a causa dell’impossiblità di trasmettere in streaming il formato Flash
video (paragrafo 2.3.1).
Inizialmente si era scelto Red5, che si era dimostrato particolarmente valido ed a costo zero.
In seguito all’aggiornamento del Flash player (vedi par. 2.2.4), avvenuto proprio durante
lo stage, si è stati tuttavia costretti a rivedere la scelta, a causa delle serie difficoltà e dei
ritardi che la questione ha comportato. Problemi non accettabili, una volta che il server
di streaming fosse effettivamente installato e in funzione; per questo motivo si è alla fine
scelta la soluzione di Adobe, perché è plausibile pensare che eventuali aggiornamenti critici
del player sarebbero accompagnati dai necessari aggiornamenti del server.
2.3
2.3.1
Completamento configurazione del server di streaming
Problematiche di accessibilità dei contenuti
L’attuale offerta di contenuti audio e video sul portale eDott soffre, come già discusso, di
alcune problematiche dovute all’uso della tecnica progressive download per la trasmissione.
CAPITOLO 2. STREAMING SERVER
17
D’altro canto tale tecnica richiede una configurazione minimale da parte del client: l’unico
reale requisito è l’installazione del plugin Flash sul browser utilizzato per accedere al
portale. La necessità di aggiornare l’offerta non può precludere l’accesso ai contenuti a
una parte degli utenti, per cui obiettivo primario del processo di aggiornamento è quello
di garantire l’accessibilità dei media alla percentuale di utenti più grande possibile e,
idealmente, tutti.
Per ottenere questo risultato si dovrebbe fare meno assunzioni possibile sulla configurazione software e hardware del computer dal quale l’utente cerca di accedere ai contenuti
in streaming, tuttavia è necessario individuare quale tipologia di applicazione dovrà usare
il client per decidere opportunamente la configurazione del server. Si prenda come esempio la trasmissione attraverso il prodotto Microsoft Windows Media Services. A questo
punto si potrebbe offrire al client un sito web con alcuni collegamenti a media trasmessi
in streaming. Se l’utente utilizza il sistema operativo Windows e Internet Explorer, con
buona probabilità facendo clic sul collegamento vedrà avviarsi automaticamente Windows
Media Player che sarà in grado di collegarsi correttamente al server e mostrerà subito i
contenuti. Ma se l’utente facesse uso di un altro browser o di un altro sistema operativo?
Mozilla Firefox su Windows, per esempio, non associa in maniera predefinita i flussi RTSP
a Windows Media Player, quindi mostrerebbe un errore. Si potrebbe allora pensare di includere direttamente il player all’interno della pagina web, ma in questo caso gli utenti
che utilizzano altri sistemi operativi sarebbero esclusi.
L’ultima soluzione è quella di utilizzare un player sviluppato con tecnologia Silverlight,
un prodotto pensato per le applicazioni web sviluppato da Microsoft e diretto concorrente della tecnologia Flash. Silverlight è disponibile per Windows e Mac OS X, mentre
per GNU/Linux esiste un’implementazione open source del player di nome Moonlight,
sviluppata da Novell in collaborazione con Microsoft. Lo svantaggio principale di questa tecnologia è che è ancora poco diffusa tra gli utenti e perciò, qualora si intendesse
utilizzarla, sarebbe necessario obbligare l’utenza del portale ad installare questo plugin.
Questo naturalmente può essere solo una semplice seccatura (che si vorrebbe comunque
evitare all’utente), ma in alcuni casi può essere un vero e proprio limite, in quanto spesso,
sulla macchina su cui si lavora, non si hanno diritti amministrativi per poter installare
applicazioni. Nel caso precedente in cui si proponeva l’utilizzo di un player standalone
per la fruizione dei contenuti, è plausibile pensare che ogni installazione standard di ogni
sistema operativo ne fornisca uno; nel caso della tecnologia Silverlight, invece, non si può
dar per scontato che l’utente ne sia provvisto o che sia in grado di installarlo.
Per quanto detto finora, si è quindi scelto di adottare un server in grado di trasmettere
contenuti Flash video, e quindi un server RTMP. Questa scelta è basata principalmente sul
fatto che questa tecnologia è disponibile su tutte le piattaforme ed è contemporaneamente molto diffusa, con una quota di mercato superiore al 97% secondo alcune statistiche;
quindi si contravviene alla regola di non fare assunzioni sulla configurazione software dell’utente, ma lo si fa sulla base di numeri che danno una discreta certezza di successo, senza
considerare che anche la versione attuale del portale eDott utilizza, per la riproduzione,
un player sviluppato con tecnologia Flash.
I limiti della configurazione software sono solo una parte del problema, ma è altrettanto importante valutare eventuali limitazioni dovute alla configurazione di rete della
18
postazione dal quale l’utente intende accedere ai media in streaming. Un server RTMP
lavora in maniera predefinita sulla porta 1935, ma un amministratore di rete particolarmente attento potrebbe voler permettere la comunicazione tra entità interne ed esterne
alla rete solo attraverso alcune porte4 , in modo da limitare l’utilizzo di servizi indesiderati. In questo caso, utilizzando la versione standard del protocollo, l’utente non sarebbe
in grado di visualizzare il media; a peggiorar la situazione c’è un altro fatto da tener
presente: in un caso come quello descritto, il problema sta nel firewall della rete dell’utente, che ricevendo pacchetti considerati non legali li scarta. In questo modo la richiesta
al server è effettuata in maniera corretta, ma la risposta non giunge mai e il risultato è
che l’utente si trova ad aspettare potenzialmente all’infinito un media che non arriverà
mai. Può sembrare una differenza minimale, ma per un utente che tenta di accedere ad
una risorsa è di gran lunga preferibile ricevere subito una risposta negativa piuttosto che
dover attendere all’infinito senza sapere se sarà presto o tardi in grado di fruire del media.
L’unica tecnica attuabile in un caso come questo è l’uso di un timeout sul client, ma il
tempo stabilito dovrebbe tener conto di fattori come l’ampiezza di banda e il traffico sulla
rete, quindi non si tratta di una scelta banale. Per evitare di incorrere in questi problemi,
una soluzione è cercare di utilizzare una configurazione che sia il più possibile accettata
dai firewall aziendali. Avviare il server di streaming sulla porta 80 può essere un valido
punto di partenza, ma non è sufficiente. Talune configurazioni di rete particolarmente
restrittive possono limitare il passaggio ai soli pacchetti di protocolli (di livello applicazione) decisi a priori. Generalmente tra i protocolli consentiti vi è HTTP, in quanto non
si vuole impedire agli utenti di navigare sul web; e d’altra parte è evidente che gli utenti
del portale siano in grado di navigare sul web. In questo caso il protocollo RTMP ci viene
incontro, in quanto esiste una versione Tunneled dello stesso che permette l’incapsulamento dei pacchetti RTMP in pacchetti HTTP, senza perdere i vantaggi dell’utilizzo delle
trasmissioni in streaming. Questa è la soluzione che si è infine scelta per la configurazione
del server: si noti, infatti, che gli URL delle risorse in streaming cominceranno sempre con
rtmpt://195.103.97.99:80/...
Le due soluzioni per lo streaming su RTMP viste in precedenza, Adobe Flash Media
Server e Red5 Media Server, offrono entrambe un proprio server web, utilizzato prevalentemente per funzionalità amministrative e dimostrative. Si ha però l’esigenza di installare
un altro server web per aver maggior controllo sullo stesso, per esempio perchè occorre
estenderne le funzionalità. Il portale, in particolare, fa largo uso di script ASP e della
piattaforma .Net di Microsoft e non è possibile ottenere il supporto a queste tecnologie
con i browser integrati nei server di streaming.
Si desidera, inoltre, utilizzare la stessa macchina sia per l’offerta dei contenuti web che
per i media in streaming. Un esempio per cui si può desiderare avere entrambi i servizi
nello stesso server fisico è quello in cui si vuole offrire agli utenti la possibilità di caricare
dei video registrati personalmente; in questo caso il video caricato può essere facilmente
processato e spostato nella directory del server di streaming, senza bisogno di predisporre
4
una porta (in ambito di reti di calcolatori) è un numero che identifica un processo in esecuzione sul
destinatario di un messaggio. È un’informazione utilizzata a livello di trasporto e non è nota a livello
di rete; per questa ragione un’apparecchiatura di rete, per esempio un firewall, che voglia individuare
questo valore, deve ricorrere a tecniche di Deep Packet Inspection che esaminano in maniera approfondita
il contenuto di un messaggio TCP/IP. Tecniche ancor più avanzate di DPI permettono anche di esaminare
informazioni di livello più alto, per esempio pacchetti a livello di applicazione.
CAPITOLO 2. STREAMING SERVER
19
comunicazioni e sincronizzazioni tra macchine differenti.
Per ottenere questo risultato, occorre disporre di due servizi attivi sulla stessa porta: il
server web che non può essere naturalmente spostato dalla porta 80, e il server di streaming, che utilizza il tunnelling. Ci sono diversi modi per affrontare il problema, ma la
soluzione più semplice è installare una seconda scheda di rete sul server. Considerando
il fatto che l’ambiente di prova è una macchina virtuale, aggiungere una scheda di rete
virtuale è un’operazione a costo zero e che richiede pochissimi passaggi. Ora, con le dovute
configurazioni, si hanno due connessioni e quindi due indirizzi IP differenti; resta quindi
solo da associare i due servizi ai diversi indirizzi IP. Il server web utilizzato dall’azienda
è Internet Information Services di Microsoft, ma la stessa configurazione si può ottenere
con qualsiasi server web.
Per associare l’indirizzo IP di ascolto su server web IIS si deve entrare nell’interfaccia di
amministrazione del server web e fare clic destro su Default Web Site (e ogni altro sito
configurato), e quindi scegliere Modifica binding; a questo punto sarà possibile scegliere
su quale indirizzo il server web dovrà restare in ascolto, fra quelli associati alla macchina
(figura 2.12).
Figura 2.11: modifica binding in Internet Information Services
La procedura può essere eseguita tramite riga di comando, con le seguenti istruzioni:
netsh http add iplisten ipaddress=x.x.x.x
net stop http
net start http
iisreset
La configurazione del server di streaming è ancora più semplice: è sufficiente modificare
poche righe nel file di configurazione.
20
Nel caso di Red5 Media Server, il file da modificare è red5.properties e le righe da
modificare sono:
rtmpt.host=<indirizzo IP>
rtmpt.port=80
Mentre, nel caso di Adobe Flash Media Server, il file di configurazione è fms.ini e si deve
modificare la riga:
ADAPTOR.HOSTPORT = <indirizzo IP>:1935,80
2.3.2
Scelta del client
Si è sin qui discusso della configurazione lato server, ma naturalmente è altrettanto importante capire che cosa si intende offrire all’utente finale per accedere ai contenuti in
streaming. Le componenti che devono essere presenti sul client sono tre: il browser (indifferentemente dal tipo e dalla versione), il plugin Flash player di Adobe e un’applicazione
Flash in grado di visualizzare i contenuti in streaming. La tecnologia Flash offre tutte
le funzionalità per comunicare e ricevere trasmissioni da un server RTMP, ma occorre
un’applicazione che richiami queste funzionalità e che offra un’interfaccia all’utente, sia
per visualizzare il media, se si tratta di un video, sia per controllare la riproduzione tramite pulsanti di PLAY, PAUSE, STOP, ecc. Questa piccola applicazione, che tecnicamente
prende il nome di filmato o, in inglese, movie, non è scelta dall’utente, ma dev’essere disponibile per lo scaricamento sul server web, come se si trattasse di un qualunque documento
da trasmettere tramite HTTP; per questa ragione, anche la scelta del filmato da utilizzare fa in qualche modo parte della configurazione del server. È necessario in particolare
disporre di un filmato in grado di operare correttamente con il server di streaming e che
offra funzionalità adeguate.
Sono stati individuati due prodotti adatti. Il primo è JW Player [19], un prodotto
gratuito (ma non open source) e di installazione immediata. In questo ambito, per installazione si intende l’inserimento del codice del filmato all’interno della pagina web; questa
procedura richiede sempre l’inserimento di alcune righe nel corpo della pagina, ma anche
l’inclusione, ed eventualmente l’esecuzione, di alcuni script javascript. JW Player è risultato molto comodo nella prima fase di prova, ma molto meno potente e configurabile per
funzionalità più avanzate.
Il secondo prodotto individuato è Flowplayer [20], un prodotto open source e gratuito, che
si è rivelato essere molto potente e flessibile, a discapito di una procedura di installazione leggermente più complicata rispetto a quella di JW Player. Le funzionalità di questo
software saranno discusse in maniera più approfondita nel capitolo 3.
Per testare le funzionalità del server di streaming Microsoft, si è anche deciso di individuare un client sviluppato in tecnologia Silverlight; nonostante questa tecnologia sia
decisamente meno diffusa rispetto a Flash, esistono già diversi player gratuiti. Ne è stato individuato uno particolarmente valido, anche dal punto di vista grafico: Silverlight 2
Video Player [21].
2.3.3
Formati e caratteristiche dei video
La scelta dei formati e delle caratteristiche dei video è critica quando si tratta di realizzare
una piattaforma per lo streaming di contenuti multimediali: pochi minuti di un filmato
CAPITOLO 2. STREAMING SERVER
21
registrato con una moderna telecamera ad alta qualità possono arrivare a pesare diversi
gigabyte. Per questa ragione, è strettamente necessario scegliere un formato e delle opzioni
di compressione adatte alla rete e all’utenza a cui vogliamo trasmettere i nostri contenuti
in streaming. In seguito si porrà l’attenzione ai formati video, piuttosto che a quelli audio,
in quanto i primi sono di maggior interesse per l’azienda e contemporaneamente soffrono
di maggiori problematiche a causa dell’elevata dimensione.
Nel caso di uno streaming server che lavora con Flash video, i formati disponibili sono
solo due: FLV e MP4.
FLash Video (FLV) è un formato contenitore, cioè indica come sono contenuti al suo interno i diversi tipi di dato (audio, video, eventuali sottotitoli). Per la codifica e la decodifica
della traccia video possono essere usati diversi tipi di codec; le versioni più datate del
Flash player supportavano solo il codec Sorenson, un’implementazione proprietaria e non
completa dello standard H.263.
H.263 definisce uno standard per la codifica e la decodifica di video, tramite una compressione lossy che si articola in tre punti principali:
• Predizione del frame corrente basandosi sulle informazioni del frame precedente
• Utilizzo di Motion Vector, un vettore che indica la traslazione compiuta dai punti di
un’immagine alla successiva
• Compressione delle singole immagini attraverso la Trasformata Coseno Discreta
(DCT).
Lo standard H.263 è stato promulgato nel 1996 dal Video Coding Experts Group (VCEG),
una sezione dell’ente International Telecommunication Union (ITU), che si occupa della
standardizzazione in ambito radio e telecomunicazioni. Il principale obiettivo di questo
standard è quello di comprimere i dati in maniera sufficiente e particolarmente adatta per
chiamate in videoconferenza su linea ISDN; conseguentemente, il tasso di compressione
può essere anche molto elevato, a discapito della qualità dell’immagine. La versione 8
del Flash player, rilasciata nel 2005, ha aggiunto il supporto alla codifica VP6, ancora
una volta un codec proprietario, sviluppato nel 2003 da On2 Technologies. VP6 utilizza
tecniche simili a quelle di H.263, aggiungendo anche la codifica a bitrate dinamico e altre
ottimizzazioni. Rispetto al codec Sorenson, VP6 garantisce video di migliore qualità anche
utilizzando lo stesso bitrate per la codifica; d’altro canto questo codec ha bisogno di una
potenza di calcolo maggiore per la codifica e la decodifica e ne è perciò sconsigliato l’uso
su computer più datati.
Dal 2007, con la versione 9 del Flash player, è stato aggiunto anche il supporto alla
codifica video H.264. Frutto della collaborazione tra VCEG e Moving Picture Experts
Group (MPEG), un gruppo di lavoro interno a ISO/IEC, H.264 è rilasciato nel 2003 come
successore del precedente H.263. Il nuovo standard è molto flessibile; definisce infatti
diversi profili applicativi, ognuno con le proprie esigenze: basti pensare che lo stesso
standard può essere utilizzato per la codifica di una trasmissione in videoconferenza, quindi
di qualità relativamente bassa, ma anche per la codifica dei contenuti ad alta definizione,
quelli che attualmente troviamo su Blu-ray e HD DVD.
Per quanto concerne l’audio, FLV supporta anche dalle versioni più datate, il formato
MPEG-1 Audio Layer 3, comunemente noto come MP3. La versione 9 del player Flash
22
ha introdotto anche il supporto al formato Advanced Audio Coding (AAC), un formato
di compressione in grado di garantire risultati migliori di MP3.
Negli ultimi anni Adobe sta spingendo gli sviluppatori ad abbandonare il formato FLV
per adottare un nuovo formato contenitore: F4V [22]. Tale formato, però, è supportato
solo dalla versione 9 del player, di conseguenza l’abbandono di FLV potrebbe significare
escludere gli utenti con software meno aggiornato.
MP4, formalmente MPEG-4 Part 14, è anch’esso un formato contenitore, definito da
Moving Picture Experts Group e ufficialmente uno standard a partire dal 2003 con la sigla
ISO/IEC 14496-14:2003. Supporta diversi codec video e audio, ma prevalentemente i più
utilizzati sono H.264 per la codifica video e AAC o MP3 per la codifica audio. Utilizzare
un formato contenitore piuttosto che un altro non incide in maniera considerevole se si
utilizzano gli stessi codec per la codifica audio e video, anche se generalmente con MP4 è
possibile ottenere risultati migliori in termini di occupazione su disco; bisogna però tenere
presente che non tutti gli utenti sono provvisti di Flash player aggiornato, e quindi l’offerta
di contenuti ad alta qualità può ancora una volta rappresentare un ostacolo per alcune
fasce di utenti.
La scelta finale del formato è quella di utilizzare prevalentemente FLV (codec video Sorenson o VP6, codec audio MP3) per i contenuti da offrire agli utenti e in casi adeguati
offrire anche una versione a più alta definizione in formato MP4.
La seconda parte del lavoro richiede di individuare delle opzioni di codifica adeguate per il formato scelto, in base alla banda disponibile, al traffico sulla rete, alle visite
ricevute, ecc. L’attuale versione del portale eDott è dotata di un sofisticato sistema di
monitoraggio delle visite che ha permesso di individuare dei valori utili per stabilire le
migliori opzioni di compressione. Tali opzioni possono essere di secondaria importanza,
per esempio nel caso del rapporto delle dimensioni di un video: offrire un video in 16:9
piuttosto che in 4:3 ha una certa rilevanza in termini di interfaccia, ma non è critico e può
essere adattato in base a specifiche esigenze estetiche. Al contrario, ci sono delle opzioni
che richiedono un accurato studio della rete e delle statistiche delle visite degli utenti; tra
queste, la più importante è probabilmente il bitrate di codifica.
Il termine bitrate in campo multimediale indica quanti bit sono usati per la codifica di
un’unità di tempo, cioè generalmente un secondo. Questo valore influenza molto la qualità
video; più bit utilizziamo per rappresentare l’informazione in un certo istante, più particolari possiamo rappresentare. Contemporaneamente aumentando il bitrate si aumenta
inevitabilmente la dimensione su disco; questo potrebbe essere visto come un problema
di poco rilievo viste le dimensioni che assumono le memorie di massa attuali. In effetti
la dimensione su disco non è un reale problema: la trasmissione di un media di dimensione elevata perché molto lungo ha la stessa complessità della trasmissione di un media
di piccola dimensione, nel caso in cui i due abbiano lo stesso bitrate di codifica e a meno
di congestioni della rete. Quindi ancora una volta il punto cruciale rimane la scelta del
bitrate ed il motivo è semplice: qualora il bitrate fosse troppo elevato rispetto alla banda
disponibile, l’utente finale riceverebbe il video ad una frequenza troppo bassa per poterlo
riprodurre in maniera fluida. Visualizzerebbe, in pratica, pochi fotogrammi, per poi essere
costretto ad una nuova fase di buffering e così per tutta la durata del video. Naturalmente
nessun utente è disposto a visualizzare un media in questa maniera, di conseguenza occorre
evitare che ciò si possa verificare. Il buffering può aiutare ad avere una riproduzione più
CAPITOLO 2. STREAMING SERVER
23
fluida, ma fino ad un certo limite: non si può pensare di fare il buffering dell’intero media,
altrimenti si perderebbero i vantaggi della trasmissione in streaming; in secondo luogo,
permettere il buffering vuol dire permettere il caching delle informazioni nella memoria
del computer del client, ma come detto si vorrebbe evitare di distribuire il media.
D’altro canto non si può nemmeno scegliere un valore troppo basso per il bitrate, altrimenti si avrebbe una qualità del media molto scadente e anche questo rischierebbe di risultare
alquanto insoddisfacente per l’utente.
Idealmente, cioè in assenza di rallentamenti e traffico sulla rete, sarebbe opportuno scegliere un valore congruo alla banda disponibile: avendo a disposizione una banda di 500Kbps,
un media codificato con questo valore per il bitrate permetterebbe, a meno di qualche
secondo di buffering iniziale, di avere una riproduzione perfettamente fluida; per ogni secondo trascorso durante la visualizzazione del media si riceverebbero pacchetti sufficienti
a riprodurne un altro secondo. Naturalmente questo vuole solo essere un esempio ed oltre
a descrivere una situazione irriproducibile nella realtà, non tiene conto di alcuni fattori
importanti che saranno discussi in maniera più approfondita in seguito.
Per scegliere dei valori adatti è utile ricorrere alle statistiche di visita del portale attuale. Per scegliere un limite superiore si può pensare alla condizione più favorevole possibile,
cioè il caso in cui ci sia un solo client a richiedere la trasmissione del media e la rete sia
completamente priva di congestioni e rallentamenti. In questo caso, idealmente, il client
dovrebbe essere in grado di ricevere il media ad una velocità che è la minima tra la banda in download del client e quella in upload del server. Poichè il server si trova su una
rete particolarmente prestante (HDSL simmetrica, 10Mbps), occorre scegliere la velocità
in download del client. Grazie alle statistiche sulle visite del portale siamo in grado di
verificare che la quasi totalità degli utenti si connette con connessioni ADSL di almeno
640Kbps in download. Per questa ragione si è scelto 600k come valore massimo per il
bitrate di codifica; non è escluso che alcuni media possano essere codificati con bitrate più
alti, per offrire agli utenti con connessioni migliori video in alta definizione, ma in generale
è bene non superare il valore individuato per non escludere una parte degli utenti.
In maniera abbastanza simile si è individuato anche un limite inferiore, cioè si è partiti
dal caso peggiore. Questo caso peggiore è calcolato però in maniera diversa e cioè non
partendo dalla connessione peggiore, anche perchè sarebbe molto limitante offrire dei contenuti video con codifica minore di 56kbps (e quindi di qualità molto bassa) per i pochi
utenti che utilizzano ancora la linea analogica per connettersi, penalizzando tutti gli altri.
Piuttosto si è preferito prendere come punto di riferimento il giorno e l’ora con il massimo
numero di accessi contemporanei; in questo modo si può suddividere l’intera banda disponibile per tutti gli utenti e verificare la quantità di cui ciascuno di questi può disporre. Si
noti che anche questo è un caso ideale, in quanto si dà per scontato che non si verifichino
rallentamenti e congestioni sulla rete. Il metodo per calcolare il valore è euristico, ma non
è facile individuare un metodo matematico per ottenere questo tipo di misure.
Il valore massimo di visite raggiunte in uno stesso giorno (in una pagina contenente un
media) è risultato essere 581 e il picco, nello stesso giorno, si è registrato nell’orario 18.0019.00, con 116 visitatori. Considerando la durata media del video (12 minuti), si è ricavato
che nel caso peggiore il server di streaming dovrebbe essere in grado di servire circa 24
client contemporaneamente ( 116 / (60 / 12) = 23,2 ). Questo valore sarebbe valido se
non ci fossero sovrapposizioni, cioè se nel caso in cui durante i 12 minuti di durata media
24
del video ci fossero esattamente 24 utenti a guardare il media, per poi lasciare il posto ad
altri 24 e via dicendo. In realtà occorre considerare almeno un minimo di sovrapposizione,
di conseguenza è opportuno raddoppiare il valore individuato e considerare 48 il numero
massimo di utenti concorrenti nella visualizzazioe del media. Con questo valore possiamo assumere di distribuire in maniera equa tutta la banda disponibile agli utenti che ne
facciano richiesta; trattandosi di una 10Mbps simmetrica, l’operazione da eseguire è (10 *
1024) / 48 = 213Kbps.
Il valore 200Kbps potrebbe sembrare un valido limite inferiore, ma si tenga presente che è
stato calcolato sul caso peggiore in assoluto; il valore medio di visite a pagine contenenti
media è molto inferiore. Ancora una volta si deve quindi scegliere un compromesso tra
un valore di bitrate basso, che penalizzerebbe gli utenti in quanto a qualità video per la
maggior parte del tempo, oppure un valore più alto che rischierebbe in qualche caso di
comportare dei forti rallentamenti.
In definitiva un valore per il bitrate che sia situato tra i 200Kbps e i 600Kbps potrebbe
essere un buon candidato, ma occorre tener conto ancora di altri elementi. In primo luogo
i valori individuati non prendono in considerazione l’eventualità di traffico e congestioni
sulla rete, ma non solo, non tengono nemmeno in considerazione molti altri fattori: la
possibilità che i pacchetti possano arrivare con tempi differenti, eventualmente anche in
disordine; ritardi dovuti al carico di lavoro del server; dimensione reale dei pacchetti, dovuta al fatto che i pacchetti RTMP viaggiano sulla rete inscatolati in pacchetti TCP e
IP5 , ecc.
È opportuno perciò considerare i valori individuati come ideali e avere l’accortezza di
abbassare sufficientemente il valore del bitrate per attenuare i problemi dovuti a ritardi,
overhead e simili. Risulta comunque impossibile, qualunque sia il valore scelto, che non
si verificheranno mai rallentamenti; ed in ogni caso non si può pensare di penalizzare
eccessivamente la qualità del video a causa di alcuni, sporadici, rallentamenti. Occorre
per l’appunto trovare un compromesso, perciò alla fine si è scelto un valore attorno ai
250-300Kbps per il bitrate di codifica dei video.
2.3.4
Automazione della procedura di conversione
Dopo aver individuato il formato per i contenuti da trasmettere in streaming, si è ritenuto
opportuno realizzare un sistema in grado di automatizzare la procedura di conversione al
formato scelto. Questa operazione si è resa necessaria per semplificare le operazioni di
caricamento dei video da parte dell’azienda, ma anche per porre le basi per un servizio
che potrà in futuro essere offerto agli utenti, e cioè il caricamento di video personali. Attualmente, ogni community ed ogni social network offrono questo servizio, ma in ambiente
medico, come già detto, non è spesso possibile rendere pubblici questo tipo di contenuti;
di conseguenza avere un portale dedicato solo all’ambiente medico, può favorire molto la
fruizione di questo servizio da parte degli utenti.
Si è quindi cercato uno strumento adatto allo scopo, ma senza alcuna preferenza da
parte dell’azienda. Si sono scelti unicamente strumenti a riga di comando, perché general5
questo fenomeno prende il nome di overhead: ogni messaggio di livello applicazione è spezzato e
inscatolato in uno o più pacchetti TCP e poi in pacchetti IP; di conseguenza la dimensione reale dei
pacchetti che viaggiano sulla rete è maggiore di quella visibile a livello applicazione
CAPITOLO 2. STREAMING SERVER
25
mente più flessibili e semplici da inserire in procedure automatiche. A livello di codifica
della procedura si sarebbe potuto usare un batch file, ma si è preferito ricorrere all’utilizzo della nuova tecnologia PowerShell di Microsoft, perché ritenuta più configurabile, ma
anche per interesse personale del tesista.
Windows PowerShell [23] è un prodotto gratuito di Microsoft che mira alla creazione di
potenti script in grado di eseguire qualunque funzionalità amministrativa, cosa che con
le precedenti shell command.com e cmd.exe non era possibile fare. PowerShell si ispira
fortemente alle più famose shell Unix, in particolare Bash, e perciò vuole offrire le stesse
funzionalità e, quando possibile, anche di più. Per ottenere il risultato, offre una serie di
comandi, noti come cmd-lets, per le più svariate funzionalità e che possono essere combinati tra loro attraverso l’uso delle pipeline. Esattamente come le shell Unix quindi,
è possibile concatenare diversi comandi tra loro e fornire l’output del primo come input
del secondo, ma con una differenza: non si tratta di stream di caratteri, ma di veri e propri oggetti. PowerShell quindi è una shell orientata agli oggetti, costruita sul framework
.NET di Microsoft, di cui eredita tutte le caratteristiche. Per venire incontro alle esigenze
degli amministratori di sistema provenienti dal mondo Unix, infine, questa shell offre diversi alias dei comandi più comuni, analoghi a quelli utilizzati in Bash; per visualizzare il
contenuto di una directory, per esempio, si usa Get-ChildItem, ma anche il più noto ls.
Per la conversione dei video si è poi cercato uno strumento in grado di lavorare con
il maggior numero possibile di formati, in quanto non è noto quali potranno essere quelli
utilizzati dagli utenti. Esistono due strumenti open source estremamente potenti e utilizzati anche in progetti anche molto noti: MEncoder e FFmpeg. Si è scelto di utilizzare il
secondo perché fortemente documentato e perché è oggi considerato il tool di riferimento
per la codifica e decodifica video.
FFmpeg [24] è un progetto nato nel 2000, che mira a creare un unico strumento invocabile
tramite riga di comando, in grado di registrare, convertire e trasmettere il maggior numero di formati audio e video. È rilasciato con licenza GNU/GPL e GNU/LGPL ed è alla
base di moltissimi progetti [25], tra i quali spiccano VLC media player, Ambulant player,
GStreamer e Xine6 .
Esistono molte applicazioni dotate di interfaccia grafica che permettono di codificare e decodificare media utilizzando le funzionalità offerte da FFmpeg. Per realizzare la procedura
di automazione ci si è affidati però alla versione base, invocabile tramite riga di comando.
L’istruzione da usare è
ffmpeg − i i n p u t . mpg −a c o d e c libmp3lame −ab 160 k −b 300 k
−s 640 x480 −f f l v output . f l v
Le opzioni utilizzate in questo caso sono:
• -i input.mpg, indica al player il file di input da utilizzare. Notare che non devono
essere specificate le caratteristiche dello stesso; FFmpeg sarà in grado di capirne
formato e caratteristiche in maniera automatica. I formati accettati in input sono
moltissimi; si rimanda alla documentazione per una lista esaustiva [26].
• -acodec libmp3lame, indica il codec audio da utilizzare per il media convertito. In
questo caso si usa la libreria open source LAME per la codifica in MP3.
6
GStreamer e Xine sono due framework per la gestione di contenuti multimediali utilizzati in tutte le
versioni di GNU/Linux
26
• -ab 160k, indica il bitrate utilizzato per la codifica della traccia audio
• -b 300k, indica il bitrate utilizzato per la codifica della traccia video
• -s 640x480, indica le dimensioni in pixel del media convertito
• -f flv, indica il formato da utilizzare per il media. Questo valore è ricavato in
automatico dall’estensione scelta per il file di output, ma può essere forzato.
• output.flv, è il nome scelto per il file di output
In questo caso sono indicati solo una piccola parte delle opzioni di conversione che FFmpeg
è in grado di accettare; per una trattazione più completa si rimanda alla documentazione
del tool [26].
A questo punto siamo riusciti a convertire il video nel formato voluto, ma non è sufficiente. Se proviamo a riprodurre il video con un normale player notiamo che non è
possibile eseguire il seeking, cioè non è possibile scegliere un punto qualsiasi della riproduzione. FFmpeg in effetti si limita alla conversione delle tracce audio e video, ma non
si occupa di aggiungere alcune informazioni utili all’interno del nostro FLV. Tali informazioni sono dette metadata e possono contenere diversi campi, come titolo, autore, ecc.
Quel che interessa a noi sono però i campi cosidetti cuepoint; un cuepoint è un segnaposto
nella timeline del video, e può essere di tre tipologie: navigazione, evento e ActionScript.
A noi interessa il cuepoint di tipo navigazione, in quanto è quello che permette di effettuare il seeking del video; quando ci si sposta nella timeline del video, si raggiunge in
realtà il cuepoint immediatamente precedente o successivo. Questo implica che per ogni
video dobbiamo inserire molti cuepoint, per rendere le funzionalità di seeking più flessibili. Oltre a trattarsi di un lavoro abbastanza oneroso, è complicato dal fatto che tali
cuepoint dovrebbero essere in qualche modo correlati al contenuto e alla durata del media.
Fortunatamente il nostro server di streaming si occupa personalmente della gestione dei
cuepoint, inserendoli in maniera automatica. Tuttavia prima di affidare il nostro video
al server di streaming, dobbiamo prima predisporlo all’inserimento dei cuepoint, cioè in
pratica dobbiamo creare nel file contenitore lo spazio adatto a contenere i metadata.
Per questa operazione possiamo usare lo strumento FLVTool2 [27]. Sviluppato in Ruby,
Flvtool2 nasce nel marzo 2005 ed è un prodotto open source (licenza BSD) per la manipolazione di file FLash Video. Le funzionalità principali offerte dal programma sono:
lettura e modifica dei metadata, inserimento del tag onMetaData, aggiunta di cue point,
stampa della struttura del file e troncamento del media. Delle diverse funzioni offerte,
quel che interessa nel caso in esame è solo aggiungere lo spazio necessario al contenimento
dei cuepoint. Per ottenere questo risultato possiamo pensare di aggiungere almeno un
cuepoint fittizio, mentre il server di streaming si occuperà di gestire gli altri. L’istruzione
utilizzata per rendere il nostro media in grado di supportare il seeking è:
flvtool2 -AUt header.meta output.flv
In questo caso i parametri sono:
• -A, aggiunge i metatag al file
• -U, aggiorna il file con l’evento onMetaData, utile per la riproduzione del file in
streaming. In pratica si dà la possiblità ai player di catturare l’evento onMetaData
CAPITOLO 2. STREAMING SERVER
27
che permette agli stessi di conoscere alcune informazioni (come durata, autore, titolo)
prima di cominciare la riproduzione del media.
• -t header.meta, indica il file di input che contiene i metatag da inserire nel media
• output.flv, è il file in cui inserire lo spazio per i metatag
Anche in questo caso si rimanda alla documentazione del progetto per una trattazione più
completa delle funzionalità offerte dallo strumento7 .
Il contenuto del file header.meta è molto limitato, ma è sufficiente per rendere qualunque
file FLV in grado di supportare le funzionalità di seeking:
<t a g s >
<metatag e v e n t ="onCuePoint " o v e r w r i t e =" t r u e ">
<name>Cue Point </name>
<timestamp >500</timestamp>
<type>n a v i g a t i o n </type>
</metatag>
</t a g s >
L’effetto reale dell’inserimento di questo metatag all’interno del file FLV, è quello di inserire
un cuepoint di tipo navigazione e di nome Cue Point a 500 millisecondi dall’inizio del
media (posto che qualunque media inserito nel portale duri più di mezzo secondo).
Avendo quindi questi strumenti a disposizione, ora non resta che realizzare uno script
in PowerShell, capace di automatizzare le operazioni di conversione.
Figura 2.12: flowchart della procedura di conversione automatica dei video
Il codice della procedura realizzata è:
# C a r t e l l a dove sono c a r i c a t i i v i d e o
$src_path = "C: \ temp\ t o C o n v e r t "
# C a r t e l l a dove vengono s p o s t a t i i f i l e c o n v e r t i t i
$dest_path = "C: \ Programmi \Red5\ webapps \ c o n v e r t \ s t r e a m s "
# P e r c o r s o d e l f i l e con g l i h e a d e r FLV
$header_path = "C: \ temp\ h e a d e r . meta "
$ v i d s = Get−C h i l d I t e m −r e c $src_path
$number_of_videos = $ v i d s | Measure−O b j e c t − l i n e
# V e r i f i c a s e sono p r e s e n t i v i d e o da c o n v e r t i r e
7
Al momento della stesura di questo documento, il sito ufficiale del progetto è in manutenzione, di
conseguenza non è ancora possibile accedere alla sezione con la documentazione. Per ottenere le opzioni
d’uso del programma si può comunque invocare il comando con l’opzione -H
28
i f ( $number_of_videos ) {
" Sono p r e s e n t i v i d e o da c o n v e r t i r e "
# Converte o g n i v i d e o
foreach ( $vid in $vids ) {
# C o s t r u i s c e i l nome u n i v o c o p e r o g n i v i d e o
$ s u f f i x = get −d a t e −uformat "%Y%m%d−%H%M%S "
$ f i l e _ n a m e = $dest_path + " \ v i d e o " + $ s u f f i x +". f l v "
# Converte i l v i d e o
ff mp e g − i $src_path \ $ v i d −a c o d e c libmp3lame −ab 160 k −s 640 x480 −b
300 k −y . / ou tp ut . f l v | out−n u l l
# Aggiunge l ’ h e a d e r n e c e s s a r i o a l v i d e o
f l v t o o l 2 −AUt $header_path . / o ut pu t . f l v | out−n u l l
# Sposta i l video c o n v e r t i t o n e l l a p o s i z i o n e f i n a l e
mv . / out pu t . f l v $ f i l e _ n a m e
# Elimina i l video di partenza
rm $src_path \ $ v i d
} # foreach
} else {
" Nessun v i d e o da c o n v e r t i r e "
} # else
Le operazioni svolte dallo script sono abbastanza semplici. Inizialmente vengono definite
alcune variabili con i percorsi dove sono contenuti i video da convertire e dove devono
essere spostati quelli convertiti. Poi si verifica la presenza di video da convertire; se non
ce ne sono la procedura termina. Se sono presenti dei video invece, un ciclo li elabora ad
uno ad uno, occupandosi in primo luogo di convertirli al formato FLV tramite FFmpeg e
in seguito di aggiungere i metatag necessari per il seeking utilizzando FLVtool2. A questo
punto il video è pronto per essere spostato nella directory del server di streaming. Occorre
però evitare che vi siano più file con lo stesso nome, per non rischiare la sovrascrittura.
La soluzione più semplice per risolvere questo problema è quella di generare un nome file
univoco, per esempio basato sulla data e l’ora del server.
Per poter eseguire script non firmati digitalmente con Windows PowerShell, è necessario abbassare il livello di protezione della shell, tramite il comando
Set-ExecutionPolicy RemoteSigned
Una volta eseguita l’istruzione, essa sarà valida sino a che un’altra istruzione simile non
cambi lo stato; in pratica tale istruzione dev’essere eseguita una volta sola e non serve
inserirla nello script.
Bisogna anche assicurarsi di rendere disponibili i comandi FFmpeg e FLVtool2 alla shell,
inserendoli nella variabile d’ambiente PATH.
Adesso ci sono tutti gli elementi per poter automatizzare la procedura di conversione
dei video; è sufficiente richiamare lo script realizzato tramite un’operazione pianificata di
Windows a intervalli stabiliti a priori. Si tenga presente che uno script PowerShell non
è direttamente eseguibile come una procedura batch, ma può essere lanciato tramite il
comando:
powershell.exe nomescript.ps1
CAPITOLO 2. STREAMING SERVER
29
30
Capitolo 3
Sincronizzazione di contenuti
multimediali
3.1
Introduzione
Esistono diversi tipi di relazione che due o più media possono avere tra loro. In un foglio
di calcolo, per esempio, una serie di dati e il grafico che li rappresenta, hanno tra loro
una relazione di contenuto: entrambi rappresentano la stessa informazione, ma in modi
diversi; se cambia parte dell’informazione, entrambi devono cambiare. In un ambiente
bidimensionale o tridimensionale invece, ci possono essere relazioni di tipo spaziale: un
oggetto e la sua ombra devono muoversi in maniera coerente. Infine si parla di relazioni
temporali, quando due media hanno la necessità di essere riprodotti con precisi vincoli di
tempo; si pensi ad esempio ad un video ed all’audio ad esso associato.
Il termine sincronizzazione può essere applicato a tutti gli esempi di relazione presentati,
ma è più spesso associato ai vincoli temporali ed anche in questa sede si userà il termine
sincronizzare per indicare la volontà di far rispettare le relazioni temporali tra due o più
media.
Il tema della sincronizzazione è molto importante; se torniamo sull’esempio di un media
composto da video e audio, possiamo identificare diversi momenti in cui occorre mantenere relazioni temporali tra i due canali. Al momento dell’acquisizione, l’audio è acquisito
tramite microfono, mentre il video tramite una telecamera; i due canali poi sono generalmente inseriti in formato non compresso in un file contenitore, che deve mantenere la
sincronizzazione. Il media poi è trasferito su computer, dove viene in genere compresso in
un altro formato contenitore; anche questo nuovo formato deve mantenere la sincronizzazione tra l’audio e il video. Per essere riprodotto, infine, il media dev’essere decodificato
dal formato compresso, e ancora una volta è necessario conoscere i vincoli temporali per
poterlo presentare all’utente in modo coerente; si pensi all’eventualità di riprodurre un
media in cui si sente la voce di una persona, mentre si sta guardando il video di quella
persona che però non sta parlando affatto. Per l’utente è un risultato molto insoddisfacente, che può anche pregiudicare l’intero significato del media: si pensi ad un film dove
le frasi di un personaggio sono riferite da un altro personaggio.
Mantenere i vincoli temporali, però, non è un problema banale. Nel paragrafo 2.3.3, si è
parlato del formato FLash Video (FLV), descrivendolo come un formato contenitore, in
31
grado di memorizzare sia l’audio che il video di un media. I due canali non possono evidentemente essere memorizzati in maniera contigua, per esempio prima tutte le informazioni
video e poi tutte quelle audio, perché nel caso di una trasmissione in streaming dovremmo
attendere di ricevere tutte le informazioni video per ricevere anche i primi pacchetti audio
e quindi essere in grado di riprodurre il media. In effetti FLV memorizza frammenti audio
e frammenti video (chiamati tag) in modo alternato [28]; ma in questo caso occorre tener
presente che i due canali sono codificati con bitrate differenti, perché un secondo di video
richiede inevitabilmente più informazione di un secondo audio. Bisogna quindi tener conto
di queste differenze, sia nel caso di memorizzazione su disco, sia nel caso di trasmissione
su rete.
Gli esempi fin qui proposti dovrebbero chiarire almeno in parte le difficoltà, ma anche
l’importanza che il tema della sincronizzazione riveste in ambito multimediale. La seconda
parte dello stage verte proprio su questi temi, in quanto l’obiettivo è quello di realizzare
un prodotto in grado di sincronizzare alcuni contenuti multimediali.
Il primo obiettivo è quello di creare un software relativamente semplice che permetta la
sincronizzazione tra un video e alcune slide. L’esigenza nasce dal fatto che l’azienda dispone di diverse registrazioni di convegni e insegnamenti dove un relatore espone i contenuti
seguendo come traccia delle diapositive. Quello che ci si aspetta dal prodotto finale è
un’interfaccia che visualizzi la registrazione dell’incontro da un lato e la diapositiva dall’altro; quest’ultima dev’essere aggiornata negli stessi istanti in cui il relatore passa alla
slide successiva. Similmente si vorrebbe permettere di scegliere una slide ed effettuare
automaticamente il seeking del video all’istante corretto.
3.1.1
Strumenti e tecnologie utilizzate
In prima analisi, si sono valutate le soluzioni attualmente in uso dall’azienda per raggiungere scopi simili a quello di questa seconda parte di stage. Queste soluzioni si dividono
principalmente in due categorie: una, più semplice, che si limita a registrare non solo il
video del relatore, ma anche la diapositiva visualizzata, e la seconda che utilizza invece
un prodotto in grado di creare un’applicazione Flash dove video e slide sono incorporate
in un unico filmato swf e la timeline del video è aggiornata automaticamente in base alla
slide visualizzata (figura 3.1). Con questo prodotto non è però possibile scorrere lungo il
video e non è nemmeno possibile includere la presentazione in una pagina web esistente,
perché il filmato occupa in maniera predefinita l’intera pagina.
Le due soluzioni presentate sono considerate poco flessibili, tuttavia offrono due vantaggi
considerevoli: in primo luogo non richiedono nessun’applicazione lato utente, ad esclusione
del già discusso player Flash installato come plug-in in un browser; il secondo vantaggio
è che non richiedono nemmeno particolari accorgimenti lato server, per esempio script di
gestione in ASP. Se possibile, sarebbe opportuno disporre un prodotto più flessibile, ma
che mantenga i pregi elencati.
Come seconda fase di analisi si è scelto di verificare l’esistenza di prodotti sviluppati
da terzi, sia gratuiti che a pagamento, per valutare se fosse opportuno affidarsi a questi o
realizzarne effettivamente uno ex-novo. Anche in questa seconda ipotesi, l’analisi di prodotti concorrenti avrebbe comunque favorito lo sviluppo, suggerendo approcci da seguire
per la realizzazione del software. La ricerca, però, non ha dato risultati molto interessanti:
32
Figura 3.1: applicazione Relator in esecuzione
sono stati individuati pochi prodotti e generalmente orientati alla creazione di applicazioni
desktop, piuttosto che web.
Si è quindi passati alla fase di scelta degli strumenti per sviluppare l’applicazione; tali
strumenti saranno ora descritti brevemente.
AJAX, acronimo di Asynchronous Javascript And XML, è un insieme di tecnologie
utilizzate lato client per lo sviluppo di applicazioni web sofisticate. Non si tratta quindi
di un singolo oggetto o libreria, ma di diverse componenti:
• XHTML e CSS per la presentazione e formattazione delle informazioni
• XML o altre tecnologie per la rappresentazione dei dati
• Javascript per l’esecuzione di operazioni lato client
• un sistema per la comunicazione asincrona con il server
Si noti che, a dispetto del nome, nè XML nè Javascript sono realmente necessari per la
creazione di applicazioni AJAX; è possibile infatti sostituire il primo con altre tecnologie per la rappresentazioni dei dati, per esempio HTML, testo semplice o JSON1 . Non è
nemmeno necessario far strettamente uso di Javascript, in quanto altre tecnologie come
1
JSON è una tecnologia per rappresentare i dati comunemente utilizzata nelle applicazioni AJAX. È
talvolta preferita a XML perché più incentrata nel semplice scambio dati e quindi, sebbene meno estendibile,
risulta spesso più leggera.
CAPITOLO 3. SINCRONIZZAZIONE DI CONTENUTI MULTIMEDIALI
33
JScript o VBScript, entrambe di Microsoft, sono in grado di effettuare chiamate asincrone; occorre tuttavia precisare che generalmente Javascript è preferito, perché offre meno
problemi di compatibilità tra i diversi browser utilizzati dagli utenti.
La vera novità introdotta da AJAX è un metodo per comunicare in maniera asincrona con
il server; esistono diverse soluzioni per ottenere questo scopo, ma la più nota e utilizzata è
l’uso dell’oggetto XMLHttpRequest (XHR). Introdotto per la prima volta nel 1999 in Microsoft Internet Explorer 5, XMLHttpRequest diventa celebre tra il 2004 e il 2005, quando
Google comincia ad utilizzarlo per le sue applicazioni GMail e Google Maps; sempre nel
2005 viene coniato l’acronimo AJAX per indicare questo tipo di nuove tecnologie che suscitano sempre maggior interesse per i web developer. Nell’aprile 2006 il W3C rilascia la
prima working draft sull’oggetto XMLHttpRequest, nel tentativo di creare uno standard
comune per tutti i browser [29]. Ad oggi ancora non si è usciti dallo stato di working draft,
anche se si prevede che ciò accadrà nei prossimi mesi; in ogni caso XMLHttpRequest è
supportato da tutti i browser più diffusi, anche se talvolta in modo differente rispetto alla
bozza del W3C.
La reale novità introdotta dall’oggetto XHR è la possibilità di ricevere delle informazioni
anche dopo che una pagina è stata completamente caricata, in maniera asincrona appunto. Prima della diffusione di AJAX, l’unica soluzione per realizzare applicazioni web in
grado di interagire con l’utente, era attraverso chiamate sincrone: l’utente inserisce alcuni
dati in un modulo e li invia; a questo punto il server li riceve, li elabora e prepara una
pagina di risposta per l’utente. Questo sistema, che è stato affiancato e non sostituito da
AJAX, ha alcuni svantaggi notevoli. In primo luogo può disorientare l’utente abituato alle
applicazioni desktop: si supponga di utilizzare un word processor che ad ogni salvataggio
nasconda la finestra di lavoro per qualche secondo. Occorre evidenziare che in questa
sede si sta discutendo di applicazioni web e non di siti vetrina o portali; se è vero che
l’approccio sincrono può disorientare l’utente di applicazioni web, è altrettanto vero che
utilizzare AJAX in contesti dove non è richiesta molta interazione con l’utente, può rendere più difficile la navigazione e meno accessibile la pagina (si tenga presente che browser
testuali e screen reader generalmente non eseguono contenuti javascript). Il secondo svantaggio dell’approccio tradizionale è lo spreco di risorse: se si deve aggiornare solo parte dei
contenuti di una pagina, non si dovrebbe esser costretti a scaricare nuovamente tutta la
pagina HTML, i fogli stile e gli eventuali script. Con AJAX queste informazioni possono
essere scaricate solo la prima volta, mentre il contenuto variabile può essere aggiornato
con chiamate asincrone.
Nel software che si intende sviluppare, AJAX rivestirà un ruolo molto importante, perché
sarà utilizzato per il download di un documento XML con le informazioni sui media e sulla
sincronizzazione. Non sarà tuttavia utilizzato in maniera asincrona, perché l’unica richiesta del documento XML sarà effettuata al caricamento della pagina. Si sarebbe quindi
potuto evitare di usare un documento XML per rappresentare i dati ed evitare anche la
chiamata AJAX, ma si è preferito seguire questa strada per separare in maniera netta
la logica di programma e lo stile di presentazione dai dati da rappresentare. In pratica
si è voluto rispettare il design pattern Model - View - Controller (MVC), per realizzare
un’applicazione più flessibile e mantenibile. La corrispondenza tra le entità del pattern e
le componenti del software realizzato è visibile in figura 3.2.
34
Figura 3.2: corrispondenza tra le entità del pattern MVC e le componenti software
Il secondo strumento di cui si farà largo utilizzo è jQuery [30]. Presentato per la prima
volta nel 2006, jQuery è una libreria JavaScript ideata da John Resig, un dipendente di
Mozilla Corporation. Le principali caratteristiche di questa libreria sono:
• Attraversamento e modifica del DOM2 di una pagina in maniera semplificata. È
possibile, tra l’altro, accedere ai nodi con l’utilizzo di selettori CSS
• Gestione migliorata e semplificata degli eventi JavaScript
• Inclusione di alcuni effetti ed animazioni
• Supporto ad AJAX
jQuery è un prodotto open source, gratuitamente scaricabile dal sito ufficiale in due formati: la versione di sviluppo, non compressa, che permette di leggere e modificare il codice
della libreria (117K) e la versione minified 3 che pesa soltanto 56K. Il principale vantaggio
nell’utilizzo della libreria, è che essa permette di concentrarsi sulla logica dell’applicazione
che si intende realizzare, senza doversi preoccupare eccessivamente delle problematiche di
compatibilità tra i browser; in pratica, jQuery offre un livello di astrazione che ci assicura che il codice produrrà gli stessi risultati, indipendentemente dal browser utilizzato.
2
Document Object Model (DOM) è un insieme di API per l’accesso agli elementi di un documento
XML. Dal 1998 DOM è una raccomandazione W3C.
3
Il termine minified indica una versione compressa del codice di un software. La compressione avviene
togliendo tutti gli spazi bianchi, rinominando variabili e funzioni in modo che contengano meno caratteri ed
eliminando i commenti; alcuni strumenti particolarmente avanzati permettono di individuare e rimuovere
codice inutile o sostituire alcuni costrutti con altri equivalenti ma che utilizzano meno caratteri. Utilizzare
uno strumento per la compressione del codice sorgente ha senso solo per i linguaggi interpretati, perché
in quelli compilati è lo stesso compilatore ad occuparsene. La versione compressa (o minified) del codice
è perfettamente equivalente alla versione originale, ma risulta incomprensibile per l’uomo; il suo scopo
principale è quello di diminuire la dimensione dei dati da trasmettere all’utente ed è oggi largamente
utilizzata per le applicazioni web. Anche nello sviluppo del software obiettivo dello stage si è utilizzato
uno strumento di compressione per realizzarne una versione compressa; il prodotto scelto è Yahoo! User
Interface (YUI) Compressor [31]
CAPITOLO 3. SINCRONIZZAZIONE DI CONTENUTI MULTIMEDIALI
35
Per esempio si potrebbe utilizzare direttamente l’oggetto XMLHttpRequest per effettuare chiamate asincrone, ma il codice dovrebbe crearlo in maniera diversa a seconda del
browser; fino alla versione 6 di Internet Explorer infatti, l’oggetto si poteva ottenere solo
tramite un controlo ActiveX. In questo caso jQuery è di aiuto, perché offre, tra le altre
cose, un supporto cross-browser all’utilizzo di AJAX.
Il terzo prodotto di cui si ha necessità è il player Flash. Per l’applicazione si è scelto
fin da subito di utilizzare Flowplayer, perché si tratta di un prodotto open source, già noto
all’azienda ed estremamente flessibile.
Flowplayer è un software che nasce nel 2005, come progetto open source ospitato su Sourceforge. Nel giro di breve tempo, il player è in grado di offrire molte funzionalità, anche
avanzate, e per questo riscuote gran successo; la versione 2 del software, sviluppata tra il
2006 e il 2008, conta anche migliaia di download al giorno. Nell’ottobre 2008 è rilasciata
la versione 3, completamente ridisegnata per supportare jQuery. La nuova versione è ricca di funzionalità, che possono ulteriormente essere estese attraverso l’utilizzo di plugin.
Il design fortemente flessibile, permette di sviluppare applicazioni javascript in grado di
interagire con il player, ed è proprio grazie a questo che è stato possibile realizzare i prodotti descritti nei paragrafi seguenti. Flowplayer è aggiornato in maniera regolare e può
contare su una comunità molto attiva, che si occupa della creazione e del mantenimento
dei plugin e della stesura della documentazione. È presente in versione open source, con
licenza GNU/GPLv3, ma anche in versione commerciale, utile per sviluppare applicazioni
proprietarie che facciano uso di questo player. Le due versioni offrono esattamente le stesse
funzionalità, ma la versione commerciale permette di sostituire il logo di Flowplayer con
uno a scelta.
Per le prime fasi di sviluppo, si è fatto inoltre uso di un altro software: Galleria [32].
Si tratta di uno script open source e scritto in jQuery, che permette di inserire una galleria
di immagini in una pagina web. È un’applicazione abbastanza semplice, ma che offre
funzionalità interessanti ed anche qualche effetto visivo accattivante. L’applicazione è
stata modificata in più settori, in modo da renderla più adatta a gestire uno slideshow 4 e
da permettere la sincronizzazione con il video del relatore.
3.1.2
SMIL: Synchronized Multimedia Integration Language
Nel paragrafo precedente si è evidenziata la volontà di rispettare il pattern MVC nello
sviluppo dell’applicazione. In particolare si intendono mantenere separate dal resto le informazioni sui contenuti (video e diapositive) da visualizzare; questa scelta permetterebbe
tra l’altro di creare molte pagine con diverse presentazioni aggiornando solo la componente Model e riutilizzando senza modifiche le altre due. Per poter raggiungere questo
scopo però occorre scegliere un formato per il file con le informazioni sui media e, per
mantenere l’applicazione il più interoperabile possibile, sarebbe opportuno utilizzare un
formato aperto e leggibile. Il formato XML si rivela particolarmente adatto in situazioni
come questa, ma occorre anche scegliere una grammatica per poter validare il documento,
per esempio attraverso un DTD o un XML Schema.
4
Il termine slideshow indica una presentazione effettuata attraverso l’uso di una serie di immagini,
dette anche diapositive (o slide in inglese). Esistono dei software appositi per la creazione di questo tipo
di presentazioni, come Microsoft PowerPoint o OpenOffice.org Impress
36
A tal scopo esiste uno standard W3C che si occupa proprio della descrizione di documenti
multimediali in linguaggio XML: Synchronized Multimedia Integration Language (SMIL).
Dalla pagina del World Wide Web Consortium dedicata a SMIL [33]:
SMIL permette la creazione di presentazioni audiovisive interattive. SMIL
è tipicamente usato per presentazioni multimediali che integrano audio e video
in streaming con immagini, testo o qualunque altro tipo di media. SMIL è
un linguaggio facile da imparare, simile a HTML ed è possibile sviluppare
presentazioni SMIL con un semplice editor di testo.
SMIL è rilasciato come raccomandazione W3C nel giugno 1998. La prima versione dello
standard offre le prime funzionalità per il posizionamento e la temporizzazione dei media,
ma è abbastanza limitata; alcune implementazioni offrono diverse funzionalità aggiuntive
proprietarie.
Nel 2001 le specifiche della seconda versione di SMIL diventano raccomandazione W3C;
la nuova versione aggiunge nuove funzionalità, come supporto a eventi utente, transizioni
e animazioni. Due anni più tardi viene aggiunto il profilo per gli MMS, con funzionalità
ridotte per garantire un miglior supporto alle limitate risorse hardware dei dispositivi
mobili. Nel 2001, con la versione 2.1 dello standard, vengono incluse altre migliorie sempre
dedicate a questi dispositivi.
La versione più recente di SMIL è la 3.0, rilasciata nel dicembre 2008; essa introduce, fra
l’altro, il concetto di stato (attraverso l’uso di variabili) e una gestione più flessibile del
testo.
Lo standard prevede alcuni profili, cioè sottoinsiemi del linguaggio nel suo complesso;
in pratica un profilo limita i tag o gli attributi utilizzabili, oppure il modo in cui questi
interagiscono tra loro (per esempio un profilo può prevedere un grado massimo di annidamento tra alcuni elementi). L’esistenza dei profili semplifica la realizzazione dei player,
in quanto un’implementazione può limitarsi ad aderire ad un profilo piuttosto che dover
supportare l’intero linguaggio; in questo modo si possono avere delle classi di player equivalenti. Si pensi ad esempio ai telefoni cellulari: le limitazioni hardware impediscono di
poter aderire in maniera completa allo standard, ma si vorrebbe comunque disporre di
uno standard, in modo che due modelli distinti di telefono siano in grado di visualizzare
correttamente e in maniera identica la stessa presentazione.
I profili definiti nell’ultima versione di SMIL sono:
• SMIL 3.0 Language Profile, è la versione completa del linguaggio
• SMIL 3.0 UnifiedMobile Profile, è la versione pensata per i dispositivi mobili, con
risorse limitate
• SMIL 3.0 Daisy Profile, ideato per i documenti DAISY, cioè libri dedicati a persone
con disabilità visive
• SMIL 3.0 Tiny Profile, è il profilo minimale, con le basilari funzionalità di disposizione e temporizzazione dei media
Esistono inoltre altri profili per l’utilizzo di SMIL in maniera embedded in altri linguaggi.
È il caso, per esempio, dei profili smilText e XHTML+SMIL. Le principali funzionalità
CAPITOLO 3. SINCRONIZZAZIONE DI CONTENUTI MULTIMEDIALI
37
che la versione più recente di SMIL (profilo Language) definisce sono:
• Definizione del layout del documento
• Inserimento di media di diversa natura
• Specifica delle relazioni temporali tra i media
• Inserimento di collegamenti ipermediali
• Aggiunta di effetti di transizione ai media
• Aggiunta di animazioni agli oggetti del documento
• Supporto agli eventi, anche scatenati dall’utente
Si noti che SMIL è solo il linguaggio che descrive la presentazione; non si tratta quindi di
uno strumento di authoring 5 .
Per riprodurre una presentazione SMIL abbiamo bisogno di un player, per esempio Real
Player [34] o Ambulant Player [35]. Attualmente non è possibile riprodurre direttamente
la presentazione SMIL tramite browser senza l’utilizzo di plugin, nonostante si tratti di un
linguaggio XML e di una raccomandazione W3C; occorre evidenziare però che Mozilla sta
gradualmente introducendo SMIL nel proprio browser, mentre Microsoft Internet Explorer
supporta in maniera non completa il profilo XHTML+SMIL (o meglio supporta il formato
proprietario HTML+TIME [36], che però è per gran parte equivalente allo standard).
Nonostante queste limitazioni, SMIL è oggi molto utilizzato: la tecnologia MMS supportata dai cellulari utilizza un profilo SMIL apposito, così come la televisione digitale
brasiliana per fare solo due esempi. Spesso questo linguaggio è utilizzato anche in maniera
più limitata, per esempio per gestire una playlist di un media player; una soluzione simile
si è adottata anche nella prima versione del software sviluppato durante lo stage.
La sintassi del linguaggio è simile a quella di HTML, nel senso che sono previste due
sezioni principali: head dove si definiscono il layout e le eventuali animazioni e body dove
si specificano i media e i vincoli temporali da rispettare. Nella sezione head possono
essere specificate le regioni, cioè le aree dello schermo adibite a contenere i media da
visualizzare. Una regione si definisce con il tag region; posizione e dimensione delle
regioni sono specificate attraverso gli attributi width, height, top, left e z-index; i
valori top e left sono relativi alla finestra che contiene la regione. Si noti la corrispondenza
con le proprietà omonime dei fogli stile CSS.
Nella sezione body invece si devono inserire i media da riprodurre e le informazioni sulla
temporizzazione. Un media è in particolare definito dal suo tipo (audio, video, immagine,
ecc), definito nel nome del tag6 , dal suo percorso, definito nell’attributo src, e dalle
informazioni di temporizzazione, definite dagli attributi begin, end e dur. Esistono anche
5
Uno strumento di authoring è un’applicazione che, attraverso interfaccia grafica, permette di posizionare i media e indicare cosa accade nella presentazione istante per istante. Esistono comunque strumenti
di authoring in grado di creare presentazioni SMIL
6
Il nome del tag in realtà è solamente indicativo; in pratica è, per esempio, possibile indicare che si
intende inserire un’immagine nella presentazione e indicare nel percorso un video. Il tipo reale del media
è individuato dal player durante la riproduzione
38
alcuni tag per la gestione dei vincoli temporali: seq crea una playlist in sequenza, par
permette la riproduzione parallela di due o più media (su regioni distinte), excl permette
la riproduzione alternata di uno solo dei suoi figli, a seconda di alcuni eventi. Seq, par
e excl supportano tutti gli attributi di temporizzazione definiti per i media; attraverso
l’uso di questi attributi si possono usare i costrutti per la temporizzazione in maniera
poco idonea, ma comunque considerata corretta per lo standard; è per esempio possibile
realizzare un par tra due media che sono però annidati in un seq. Questo accade perché
questi costrutti sono soltanto indicativi, esattamente come i tipi dei media; sta a chi crea
la presentazione usarli in maniera opportuna.
Si sono finora descritti gli elementi di SMIL necessari per comprendere il lavoro descritto
nelle successive sezioni; in realtà questo standard prevede molti altri tag e molti altri
attributi, ma per una trattazione completa si rimanda alla specifica W3C [37].
In conclusione, SMIL si rivela essere la scelta ideale per memorizzare le informazioni
sui media e sulla temporizzazione degli stessi.
L’adozione di uno standard porta con sè alcuni importanti vantaggi:
• Non occorre progettare un formato apposito per la memorizzazione delle informazioni, il che non solo riduce i tempi di sviluppo, ma garantisce di utilizzare un formato
corretto, flessibile ed estendibile
• Aumento dell’interoperabilità con eventuali altri software; per esempio si può utilizzare uno strumento di authoring per creare il documento SMIL della presentazione
Nella seconda versione dell’applicativo, l’importanza dell’adozione di uno standard sarà
ancor più critica, ma questo tema sarà discusso in dettaglio nel paragrafo 3.2.2.
3.2
Sviluppo di un’applicazione web per la sincronizzazione
di contenuti multimediali
3.2.1
Sviluppo di un’applicazione per la sincronizzazione tra video e
slide
Il primo prodotto da sviluppare, come già anticipato, è un’applicazione per la sincronizzazione di un video e di alcune slide, che il relatore ha mostrato durante l’evento (che può
essere, per fare un esempio, la presentazione di un nuovo farmaco). Il video dev’essere
disponibile sul server di streaming, in modo da sfruttarne le funzionalità, permettendo,
tra l’altro, di effettuare le operazioni di seeking in maniera più rapida e di non effettuare
il caching del media sul computer dell’utente. Lo slideshow dev’essere invece una semplice
sequenza di immagini, ottenute dal file originale della presentazione. Il formato delle immagini può essere ovviamente qualunque formato direttamente leggibile dal browser senza
l’utilizzo di plugin, quindi in particolare:
• il formato GIF (Graphics Interchange Format), che dovrebbe essere utilizzato quando sono presenti molte immagini artificiali, per esempio il testo, e possibilmente
sfumature in numero limitato.
• il formato JPEG (Joint Photographic Experts Group), che dovrebbe essere utilizzato
nel caso la presentazione utilizzi molte immagini naturali, per esempio fotografie. Si
CAPITOLO 3. SINCRONIZZAZIONE DI CONTENUTI MULTIMEDIALI
39
tenga presenta che il rendering del testo con questo formato è generalmente più
scadente di quello del formato GIF.
• il formato PNG (Portable Network Graphics), che dovrebbe essere preferito a GIF
nella maggior parte dei casi, in quanto consente di ottenere risultati discreti ad
un grado di compressione generalmente più elevato. Nel caso si intenda utilizzare
immagini con trasparenza si deve tener presente che potrebbe mancare il supporto
su browser meno recenti.
Fortunatamente i due maggiori prodotti per la creazione di presentazioni con diapositive,
e cioè Microsoft PowerPoint e OpenOffice.org Impress, permettono entrambi di esportare
la presentazione in maniera automatica e in uno qualsiasi dei formati sopra esposti.
Il percorso delle immagini può essere indicato nel documento SMIL di configurazione in
modo assoluto. Questo significa che le immagini possono risiedere in un qualunque spazio
web; per semplicità saranno però inserite negli esempi seguenti nello stesso server che si
occupa di offrire le pagine web. Per realizzare l’interfaccia si è preso come riferimento
l’applicazione attualmente in uso dall’azienda, cioè Relator (figura 3.1). Si vorrebbe ottenere un prodotto simile, ma più flessibile, che permetta cioè di modificare radicalmente
l’aspetto visivo della pagina e offra alcune funzionalità aggiuntive. Per ottenere il primo
punto, si è scelto di dividere tutta la componente View, tra la pagina HTML e i fogli stile
CSS. In particolare la prima si occupa di posizionare gli elementi (player, titolo, pulsanti)
e di associare loro una classe CSS, mentre il secondo si occupa dello stile grafico degli
elementi. Anche in questo caso si sta rispettando il pattern MVC e precisamente si è
descritta la componente View.
Per la prima versione del lavoro si è scelto di utilizzare uno script realizzato in jQuery
per la gestione dello slideshow, Galleria (vedi par. 3.1.1). Tale scelta è stata fatta per
poter rendere più semplice e veloce la fase di sviluppo e per studiare un esempio d’uso
relativamente sofisticato della libreria jQuery. Sono state necessarie diverse modifiche
al codice di Galleria per raggiungere lo scopo; in primo luogo si è dovuto fare a meno
di alcune funzionalità, per esempio il plugin che gestisce l’oggetto history del browser.
Questo plugin permette di fare clic sul pulsante Indietro del browser per visualizzare
l’immagine precedente piuttosto che navigare alla pagina precedentemente visualizzata;
tale operazione però avrebbe reso più difficile la gestione del seeking del video, perché
si sarebbe dovuto intercettare l’evento del browser oltre che quello dello script per lo
slideshow. Si è anche eliminata la funzionalità che mostrava le anteprime delle immagini
della galleria, perché considerata poco flessibile e inadatta alla gestione di uno slideshow. In
maniera analoga sono state invece aggiunte delle funzionalità, in particolare lo scorrimento
tramite i pulsanti Precedente e Successiva (prima si poteva navigare solo attraverso le
anteprime o facendo clic sull’immagine stessa per passare alla successiva). È stato aggiunto
anche il supporto al seeking del video, gestito sempre tramite i pulsanti di navigazione della
galleria.
Al termine delle modifiche, lo script offre le seguenti funzionalità:
• Un costruttore7 che riceve come parametro un array di URL corrispondenti alle
immagini da visualizzare
7
JavaScript non è un linguaggio propriamente orientato agli oggetti, ma è possibile comunque creare
della variabili a cui associare metodi e attributi, facendo sì che queste si comportino in maniera simile
40
• Il metodo activate, che dato l’URL di un’immagine, visualizza questa come slide
corrente
• I metodi next e prev che navigano rispettivamente all’immagine successiva e precedente dello slideshow
• I metodi nextAndSeek e prevAndSeek che navigano nello slideshow e richiamano
opportunamente le funzionalità di seeking del player
L’oggetto Galleria mantiene al suo interno lo stato dello slideshow, quindi informazioni
come l’indice e l’url della slide correntemente visualizzata, utili per la realizzazione dei
metodi next, prev, nextAndSeek, prevAndSeek.
Si è detto che al costruttore dell’oggetto Galleria è passato l’array con i percorsi delle
immagini. Analogamente a questo, esiste un secondo array della stessa dimensione che
contiene invece i cuepoint a cui le slide devono essere sincronizzate. In pratica ad ogni
immagine corrisponde un elemento del secondo array che contiene un istante temporale
espresso in millisecondi; tali informazioni sono necessarie per ottenere la sincronizzazione
e devono essere gestite dal player.
Per quanto riguarda Flowplayer invece, non è stato necessario modificare in alcun modo lo script di gestione del player e questo grazie alla grande flessibilità del prodotto.
Flowplayer offre infatti molti metodi per l’accesso alle informazioni sullo stato della riproduzione e per la modifica delle stesse. Per esempio, attraverso il metodo getTime() è
possibile ottenere il tempo della riproduzione in millisecondi; si rimanda alla documentazione per una lista completa delle funzionalità [38].
Quando si crea l’oggetto Flowplayer, inoltre, è possibile passare al costruttore molte
opzioni. È possibile fra l’altro:
• impostare uno o più media da visualizzare
• cambiare in ogni aspetto lo stile grafico del player
• aggiungere opportuni plugin (in particolare ne occorre uno per poter riprodurre flussi
RTMP)
• specificare alcune operazioni da effettuare quando si verificano taluni eventi
È stato necessario utilizzare ciascuna di queste funzionalità nelle diverse fasi dello sviluppo
e in particolare l’ultima ha permesso di ottenere la sincronizzazione tra video e slide. Gli
eventi che è necessario gestire sono onStart, onSeek e onCuepoint.
L’evento onStart è richiamato quando il player ha terminato la fase di handshaking
e buffering iniziale, di conseguenza la riproduzione sta effettivamente per cominciare. Nel
frattempo l’utente sta già visualizzando la pagina ed anche lo slideshow, cioè ha a disposizione i pulsanti per navigare tra le slide e potrebbe volerli utilizzare anche prima di aver
cominciato la riproduzione del video, ma così facendo romperebbe la sincronizzazione. Di
conseguenza occorre bloccare la funzionalità fino a che il video non è pronto per essere
riprodotto oppure spostare la riproduzione al punto della slide correntemente visualizzata;
agli oggetti di un linguaggio OOP. Quest’approccio è stato seguito nella realizzazione di tutti gli script
utilizzati, quindi da jQuery, Flowplayer e Galleria. Ecco perché si può parlare di costruttore, campi e
metodi.
CAPITOLO 3. SINCRONIZZAZIONE DI CONTENUTI MULTIMEDIALI
41
Evento
onStart
onSeek
onCuepoint
Tabella 3.1: funzionalità associate agli eventi del player
Quando è lanciato
Funzione associata
Inizio della riproduzione, dopo il Viene effettuato il seeking del vibuffering
deo al cuepoint associato alla slide
attualmente visualizzata
L’utente ha selezionato un punto È visualizzata la slide che corrinella timeline del video
sponde al cuepoint più vicino, tra
quelli con tempo minore
Raggiungimento di un cuepoint
È richiamato il metodo next() dello
slideshow
si è scelta questa seconda soluzione.
L’evento onSeek è richiamato quando l’utente ha selezionato un punto nella timeline del
video; occorre individuare la slide che dovrebbe essere visualizzata in quell’istante. Per
farlo è sufficiente individuare le slide associate ai cuepoint minori del tempo di riproduzione del video e scegliere quello più vicino all’istante di riproduzione selezionato. In pratica,
data la lista ordinata dei cuepoint, basta scorrerla dalla fine fino a raggiungere il primo
valore minore del tempo attuale del video.
L’evento onCuepoint è richiamato dal player quando la riproduzione incontra un cuepoint8 nel video. Poiché la riproduzione può andare solo in avanti, quando si raggiunge un
cuepoint vuol dire che si deve visualizzare la slide successiva a quella corrente. L’utente
può effettuare il seeking del video e tornare indietro, ma in tal caso il player genera prima
un evento onSeek visualizzando la slide corretta e poi, al primo cuepoint incontrato, quella
subito successiva, mantenendo in questo modo la sincronizzazione.
La prima versione dell’applicativo è stata sviluppata in tempi brevi e con funzionalità limitate, ma è stata una buona base di partenza per le successive evoluzioni. Un’immagine
dell’applicazione in esecuzione è visibile in figura 3.3.
Il software ha subito poi diversi aggiornamenti. Il primo passo ha visto la completa
riscrittura dello script di gestione dello slideshow. Si è cioè eliminato Galleria per sostituirlo con un prodotto sviluppato ad-hoc, in modo da avere maggior controllo sull’esecuzione
dell’applicazione nel suo complesso. L’operazione si è resa possibile grazie allo studio in
dettaglio di Galleria, che ha permesso da un lato di apprendere in maniera approfondita
jQuery e dall’altro di individuare sia i punti forti del programma (da replicare), sia quelli
deboli (da evitare). Va precisato che gli aspetti negativi dello script non sono dovuti a
cattiva programmazione, ma al fatto che gli obiettivi di Galleria non coincidono completamente con quelli del prodotto che si sta sviluppando.
Il nuovo script per la gestione della presentazione è stato chiamato semplicemente Slideshow, e offre gli stessi metodi offerti in precedenza da Galleria, seppur con implementazioni
diverse e più efficienti.
Il limite più grande di questa versione del prodotto è il fatto che si è scelto di inserire
i percorsi dei media e i tempi di sincronizzazione direttamente nel documento HTML.
Tale soluzione è stata adottata per semplificare le fasi iniziali del lavoro, permettendo di
8
Il cuepoint può essere interno al media (vedi paragrafo 2.3.4) oppure esterno, specificato nella costruzione del player. Per semplicità si è scelta questa seconda soluzione, considerata più flessibile, poiché
per modificare i cuepoint interni al media occorre utilizzare strumenti esterni come FLVtool2.
42
Figura 3.3: prima versione dell’applicazione per la sincronizzazione di video e slide
concentrarsi su altre funzionalità, ma è un limite che dev’essere necessariamente superato
per poter rispettare il pattern MVC. L’introduzione di questa funzionalità complica solo in
parte l’applicazione; in effetti la logica di programma resta esattamente la stessa, occorre
solo individuare i dati per l’inizializzazione delle componenti in un file esterno.
Di quest’operazione si occupa un nuovo script, Init, che è richiamato per primo e si occupa
della creazione degli altri componenti. Per prima cosa Init scarica il documento dal server;
poichè si tratta di un documento SMIL, per quanto detto nel paragrafo 3.1.2, l’operazione
può essere effettuata tramite AJAX. In seguito lo script utilizza le API DOM per accedere
alle informazioni sui media e sui punti di sincronizzazione (cuepoint). Con queste informazioni, possono essere inizializzati player e slideshow per funzionare esattamente come
nella versione precedente.
Occorre evidenziare che l’applicazione si aspetta un preciso formato per il file con le informazioni sui media, ovvero si aspetta di trovare esattamente un video in parallelo con una
sequenza di immagini. Questo implica che qualsiasi formato non riconosciuto genererà un
errore e impedirà l’avvio della presentazione, pur se si tratta di un documento SMIL ben
formato, valido e corretto.
Il formato accettato dalla versione finale dell’applicazione è il seguente:
<?xml v e r s i o n = " 1 . 0 " e n c o d i n g =" i s o −8859−1"?>
<!DOCTYPE s m i l PUBLIC "−//W3C//DTD SMIL 2 . 0 / /EN" " h t t p : / /www. w3 . o r g /2001/ SMIL20/WD/
SMIL20 . dtd">
<s m i l xmlns=" h t t p : / /www. w3 . o r g /2001/ SMIL20/ Language">
<head>
<meta name=" t i t l e " c o n t e n t =" T i t l e "/>
<meta name=" a u t h o r " c o n t e n t ="QB S o f t "/>
<meta name=" a b s t r a c t " c o n t e n t =" J u s t an example "/>
</head>
CAPITOLO 3. SINCRONIZZAZIONE DI CONTENUTI MULTIMEDIALI
43
<body>
<par>
<v i d e o s r c ="rtmpt : / / 1 9 5 . 1 0 3 . 9 7 . 9 9 : 8 0 / t e s t i n g / sample . f l v "/>
<seq>
<img s r c =" s l i d e / 0 0 . j p g " t i t l e =" f i r s t s l i d e " b e g i n ="0 s "/>
<img s r c =" s l i d e / 0 1 . j p g " t i t l e =" s e c o n d s l i d e " b e g i n ="15 s "/>
<img s r c =" s l i d e / 0 2 . j p g " t i t l e =" t h i r d s l i d e " b e g i n ="37 s "/>
</seq>
</par>
</body>
</s m i l >
In realtà c’è un minimo di flessibilità nel parsing del documento: per esempio se sono
presenti tag inaspettati sono automaticamente ignorati e non generano errori; oppure se i
tag che devono essere presenti non sono nel giusto ordine (per esempio è presente prima
la sequenza di immagini e poi il video), la lettura avviene correttamente. Il formato che ci
si aspetta quindi è indicativo ed è un formato minimo; eventuali elementi di troppo sono
semplicemente scartati.
Con la lettura delle informazioni sui media dal documento SMIL, il prodotto si può
considerare funzionalmente completo. Si è perciò proceduto ad una fase di testing per l’individuazione dei bug e ad un miglioramento estetico. Per quest’ultimo punto si è creato un
tema attraverso l’uso di fogli stile e le opzioni di personalizzazione grafica di Flowplayer.
L’interfaccia dell’applicazione è stata rivista per sfruttare al meglio gli spazi disponibili, in
particolare grazie all’adozione di un layout fluido, che permette di ridimensionare dinamicamente lo spazio dedicato allo slideshow. L’applicazione nella sua veste finale è visibile
in figura 3.4.
Figura 3.4: versione finale dell’applicazione per la sincronizzazione di video e slide
44
Per completare la descrizione dell’applicazione, saranno nel seguito esposti l’albero
delle directory e il diagramma delle componenti software (figura 3.5).
La directory dell’applicazione che dev’essere caricata sul server web, ha la seguente struttura:
- index.html (pagina principale della presentazione. deve includere tutti gli script)
- nome.xml (documento SMIL con le informazioni sui media e sulla temporizzazione. Il nome può essere
specificato in index.html, mentre l’estensione deve essere .xml)
- include (directory)
– scripts (directory)
∗ flowplayer.js (script per la gestione di Flowplayer)
∗ init.js (script per l’inizializzazione delle componenti della presentazione)
∗ jquery.js (libreria jQuery)
∗ slideshow.js (script per la gestione dello slideshow)
– styles (directory)
∗ main.css (fogli stile usati nella presentazione)
∗ . . . (altri elementi grafici della pagina possono essere inseriti qui)
– swf (directory)
∗ flowplayer.swf (applicazione Flowplayer)
∗ flowplayer.controls.swf (plugin di Flowplayer per la gestione dei controlli PLAY, PAUSE, STOP,
ecc)
∗ flowplayer.rtmp.swf (plugin di Flowplayer per la gestione dei flussi RTMP)
Figura 3.5: diagramma delle componenti software dell’applicazione
In conclusione si è riusciti nell’intento di creare l’applicazione desiderata, rispettando i
vincoli imposti. Lo script, infatti, è in grado di eseguire correttamente (ed è stato testato)
su Internet Explorer 6+, Mozilla Firefox 2+, Apple Safari 3+, Opera 9+ e Google Chrome
2+, non richiede l’utilizzo di script server side e non richiede nemmeno l’installazione di
plugin aggiuntivi da parte dell’utente.
CAPITOLO 3. SINCRONIZZAZIONE DI CONTENUTI MULTIMEDIALI
45
3.2.2
Sviluppo di un player SMIL per il web
Nel campo molto specifico della sincronizzazione tra video e slide, l’applicazione descritta nel paragrafo precedente è abbastanza soddisfacente; sfortunatamente però, nel caso
si desideri modificare anche solo in piccola parte l’andamento della presentazione, per
esempio aggiungendo un secondo set di immagini da visualizzare in maniera sincronizzata,
l’applicazione si rivela inadatta e richiede uno sforzo notevole e una modifica consistente
della logica di programma. Seguire quest’approccio, oltre che comportare grosse difficoltà,
sarebbe concettualmente un errore, perché si estenderebbe solo in piccola parte l’input
accettato, e quindi si creerebbero le condizioni per il ripetersi del problema.
Se si vuole estendere in maniera consistente e corretta le funzionalità dell’applicazione, in
modo da far sì che questa possa accettare e riprodurre correttamente molti più modelli
di input, occorre iniziare da zero un nuovo progetto. Nelle ultime due settimane di stage,
perciò, ci si è posti l’obiettivo di realizzare un vero e proprio player SMIL, in grado di
riprodurre una discreta quantità di presentazioni e che sia facilmente estendibile. I vincoli
imposti sono gli stessi del primo applicativo creato, e cioè garantire il funzionamento sulla
maggior parte dei browser e non obbligare l’utente a installare plugin di alcun tipo, escluso
il Flash player.
Si precisa che attualmente un’applicazione di questo tipo non esiste; per riprodurre contenuti SMIL in un browser occorre utilizzare qualche plugin apposito (per esempio Ambulant), oppure includere il documento nella pagina HTML secondo il profilo XHTML+SMIL.
Il progetto non mira però a creare un player completo, in grado di interpretare tutte le
presentazioni SMIL, ma solo un profilo ridotto (descritto in seguito).
Si è detto che l’approccio al problema dev’essere radicalmente diverso da quello usato
per lo sviluppo della prima applicazione ed i motivi sono molteplici:
• I media non occupano necessariamente due regioni e, soprattutto, le regioni non
dovrebbero essere stabilite a priori in fatto di posizione e dimensioni. Si deve permettere all’utente di definire le proprie regioni in maniera arbitraria e si deve essere
in grado di associare ogni media alla giusta regione.
• Non dovrebbero esser previsti modi per annidare i tag di temporizzazione in numero
limitato; ovvero dovrebbe essere possibile comporre i vari seq e par a discrezione
dell’utente.
• Non è sicuro che sia presente un media continuo nella presentazione, nè che sia
presente dall’inizio e per tutta la durata della stessa, di conseguenza il tempo non
dovrebbe essere gestito con le funzionalità di Flowplayer com’è stato fatto in precedenza.
Queste sostanziali differenze aiutano anche a capire quale dev’essere il modo di procedere.
La prima funzionalità da supportare è la creazione di regioni. Una regione in SMIL si specifica con il tag region contenuto nel la sezione head. Nel paragrafo 3.1.2 si è mostrata
la corrispondenza che c’è tra gli attributi di region e le proprietà omonime dei fogli stile
CSS; questa corrispondenza suggerisce di far corrispondere ad ogni regione definita nel
documento SMIL un contenitore (per esempio un div) XHTML, posizionato in maniera
46
assoluta. A questo punto basta usare gli stessi valori usati per gli attributi delle regioni nelle proprietà CSS del blocco XHTML, aggiungendo il suffisso px se opportuno (che
in SMIL può essere omesso). Gli attributi che vengono copiati sono left, top, width,
height e z-index; per semplicità si è scelto di non implementare il supporto a right e
bottom, perché top e left sono generalmente più usati ed è facile, con i dovuti calcoli,
passare da un sistema di posizionamento all’altro; l’eventuale supporto a questi attributi
può comunque essere facilmente introdotto estendendo l’applicazione.
Un altro punto importante è poter identificare univocamente la regione, per potervi associare i media. Per fare questo si è scelto di copiare il valore dell’attributo regionName
del file SMIL nell’attributo id del blocco div XHTML. Poiché gli attributi fin qui elencati
sono fondamentali per creare correttamente il layout della pagina, occorre che essi siano
presenti nel documento SMIL; se non lo sono è visualizzato un errore.
Il secondo punto dell’elenco delle funzionalità da supportare, richiede che non via siano limiti nel modo di annidare i tag di temporizzazione nella sezione body del documento
SMIL. Può sembrare un punto eccessivamente complicato da garantire, ma in realtà non
è così. Per spiegare come si risolve il problema occorre una piccola premessa.
Non si deve effettuare il parsing del documento durante la presentazione; bisogna sapere sin dall’inizio quando un media deve essere riprodotto. Ciò è dovuto al fatto che un
parsing durante la presentazione sarebbe molto inefficiente, perchè ripercorrerebbe necessariamente molti elementi più e più volte, quando in realtà è possibile stabilire sin
dall’inizio l’ordine di esecuzione di tutti i media della presentazione, percorrendo l’albero
una sola volta. Scegliendo il secondo metodo si riduce considerevolmente la complessità
del problema e si può effettuare un parsing molto più efficiente e veloce; l’unico aspetto
negativo è che richiede di memorizzare più informazioni, ma comunque non in numero
eccessivo.
Per costruire l’ordine di esecuzione dei media nella presentazione è sufficiente conoscere
solo, per ogni media esaminato:
• Il valore dell’attributo begin del media che si sta esaminando
• La durata del media, che può essere indicata nell’attributo dur oppure essere intrinseca, se si tratta di un media continuo; in questo caso possono sorgere dei problemi
che saranno discussi in seguito
• L’istante (assoluto) in cui è terminato il media precedente se ci troviamo all’interno
di un seq; tale valore è dev’essere aggiunto al valore di inizio del media in esame.
• L’istante (assoluto) di inizio dell’elemento padre se siamo all’interno di par o se
siamo i primi figli di body o seq; tale valore è dev’essere aggiunto al valore di inizio
del media in esame.
Tutte queste informazioni sono facilmente ottenibili se ad ogni nodo in esame si provvede
ad aggiornare tali informazioni usando quelle dei nodi precedenti; per esempio il tempo
di fine di un media, non è altro che il tempo di inizio più la sua durata. Supponiamo
di trovarci all’interno di un seq: se ora sommiamo il valore di inizio relativo del media
successivo al valore di fine di quello attuale, otteniamo un valore assoluto di inizio.
Non è difficile quindi capire che utilizzando una funzione ricorsiva per esaminare il documento SMIL, avendo cura di aggiornare correttamente i parametri ad ogni nodo, si può
CAPITOLO 3. SINCRONIZZAZIONE DI CONTENUTI MULTIMEDIALI
47
facilmente costruire uno schema in cui per ogni media si possono conoscere il suo tempo
di inizio e di fine assoluti. Quest’approccio è stato adottato nella creazione del player ed
ha portato alla stesura della funzione parseMediaRec all’interno del file smil_player.js.
Il terzo e ultimo punto dell’elenco delle modifiche da effettuare indica che non possiamo utilizzare le funzionalità di Flowplayer per la gestione del tempo nel browser. Occorre
quindi trovare un altro modo, il più possibile preciso, per gestire lo scorrimento del tempo. Per fare questo si può implementare un semplice cronometro (in inglese stopwatch) in
JavaScript. L’implementazione più banale consiste nell’affidare il conteggio del tempo ad
una funzione che contiene solo un ciclo infinito in cui ad ogni iterazione ferma l’esecuzione
per un certo intervallo di tempo; in Java si potrebbe ottenere un risultato simile tramite
il metodo sleep() della classe Thread. In JavaScript non esistono thread, però si può
comunque ottenere un comportamento simile con la funzione setTimeout(). Il risultato
di quest’implmentazione del cronometro però non è accettabile, perchè introduce un errore
cumulativo molto grande; nessuna funzione di sospensione relativa, nemmeno in linguaggi orientati al real time come ADA, garantisce di fermare l’esecuzione esattamente per
l’intervallo di tempo richiesto. Generalmente questo genere di funzioni garantiscono una
sospensione per un tempo pari almeno a quello richiesto; ovvero se si sceglie di fermare
l’esecuzione per un secondo, accadrà quasi sempre che la reale sospensione sia di poco
maggiore ad un secondo e mai comunque minore. Come detto, questa soluzione introduce
un notevole errore cumulativo, cioè dovuto alle esecuzioni precedenti; utilizzare intervalli
di tempo più piccoli non risolve il problema ma lo sposta solo più avanti nel tempo.
È necessario quindi utilizzare dei riferimenti assoluti. Si può per esempio memorizzare il
tempo di inizio della riproduzione e controllare a intervalli regolari (la cui durata dev’essere
stabilita in base alla precisione che si vuole ottenere) quanto tempo è trascorso dall’inizio
fino a questo istante. Con questa soluzione non si è al riparo totale dagli errori, però non
vi è ritardo cumulativo, perciò a lungo termine si ottengono risultati decisamente migliori.
Per la realizzazione di questo script ci si è ispirati ad un lavoro pubblicato online [39].
Avendo a disposizione un cronometro, è sufficiente controllare in maniera regolare se vi
sono media da avviare o da fermare per poter riprodurre la presentazione. Si noti che il
cronometro dev’essere in grado di gestire la messa in pausa della presentazione.
Si sono fino a qui descritti i punti più delicati, che sono però solo una piccola parte dell’applicazione nel suo complesso. Segue ora una descrizione più dettagliata delle
componenti software utilizzate, interne ed esterne.
48
Figura 3.6: diagramma delle componenti software dell’applicazione
La pagina HTML è la pagina principale della presentazione; deve includere tutti gli
script necessari e avviare il player SMIL. Un esempio di pagina minimale e funzionante è
il seguente.
<html>
<head>
< t i t l e >Loading . . . < / t i t l e >
<l i n k h r e f =" i n c l u d e / s t y l e s / s m i l _ p l a y e r . c s s " r e l =" s t y l e s h e e t " t y p e =" t e x t / c s s " media
=" s c r e e n "/>
< s c r i p t t y p e =" t e x t / j a v a s c r i p t " s r c =" i n c l u d e / s c r i p t s / j q u e r y . j s "></ s c r i p t >
< s c r i p t t y p e =" t e x t / j a v a s c r i p t " s r c =" i n c l u d e / s c r i p t s / f l o w p l a y e r . j s "></ s c r i p t >
< s c r i p t t y p e =" t e x t / j a v a s c r i p t " s r c =" i n c l u d e / s c r i p t s / jqModal . j s "></ s c r i p t >
< s c r i p t t y p e =" t e x t / j a v a s c r i p t " s r c =" i n c l u d e / s c r i p t s / s m i l _ p l a y e r . j s "></ s c r i p t >
< s c r i p t t y p e =" t e x t / j a v a s c r i p t " s r c =" i n c l u d e / s c r i p t s / s t o p w a t c h . j s "></ s c r i p t >
< s c r i p t t y p e =" t e x t / j a v a s c r i p t " s r c =" i n c l u d e / s c r i p t s / media . c l a s s . j s "></ s c r i p t >
< s c r i p t t y p e =" t e x t / j a v a s c r i p t " s r c =" i n c l u d e / s c r i p t s / r e g i o n . c l a s s . j s "></ s c r i p t >
< s c r i p t t y p e =" t e x t / j a v a s c r i p t ">
<!−−
$ ( document ) . r e a d y ( f u n c t i o n ( ) {
// I n i z i a l i z z a l a p a g i n a l e g g e n d o i d a t i d a l f i l e SMIL p a s s a t o
s m i l _ p l a y e r ( " v i d e o . xml " , "# c o n t a i n e r " ) ;
}) ;
//−−>
</ s c r i p t >
</head>
<body>
<!−− C o n t e n i t o r e d e l l a p r e s e n t a z i o n e −−>
<d i v i d =" c o n t a i n e r "></div>
</body>
</html>
Si noti che non occorre specificare il titolo della pagina, perché sarà automaticamente
usato quello individuato nel documento SMIL. Occorre invece creare un contenitore per
la presentazione, provvisto dell’attributo id. Il selettore CSS di tale contenitore (cioè il
simbolo ’#’ più l’id) dev’essere passato insieme con il nome del documento SMIL alla
CAPITOLO 3. SINCRONIZZAZIONE DI CONTENUTI MULTIMEDIALI
49
funzione di inizializzazione del player. Si è scelta questa soluzione per permettere di
includere il player SMIL in pagine esistenti; è sufficiente infatti aggiungere l’elemento
contenitore nel posto scelto della pagina per inserire la presentazione SMIL in quel preciso
punto; non si è perciò obbligati ad usare la presentazione a schermo intero su una pagina
apposita e separata.
I fogli stile permettono di personalizzare le regioni e qualche altro aspetto della presentazione, per esempio la visualizzazione del cronometro o gli stili da applicare alle finestre
di dialogo. In quest’applicazione i fogli stile rivestono un ruolo molto marginale, ma sono
stati comunque tenuti in considerazione per permettere la modifica dell’aspetto grafico di
alcune componenti. Si noti che è comunque possibile modificare liberamente lo stile dei
componenti esterni al player SMIL.
flowplayer.js e jquery.js sono rispettivamente gli script per la gestione di Flowplayer e le API di jQuery. Non sono stati modificati, per cui possono essere facilmente
sostituiti da versioni più aggiornate in caso di necessità.
jqModal.js [40] è un plugin open source per jQuery che permette di creare con pochi
comandi delle finestre modali 9 . Non si tratta di popup classici, che possono facilmente
essere bloccati dal browser, ma di elementi della pagina HTML che vengono visualizzati
solo quando necessario. Le finestre modali sono usate per notificare all’utente un errore
grave o una fase di caricamento e per impedire all’utente di interagire con i media (per
esempio mettendoli in pausa) durante il caricamento di altri media.
Figura 3.7: jqModal in esecuzione
Stopwatch è uno script che offre le basilari funzionalità di un cronometro. I metodi
che offre lo script sono:
• sw_start(), avvia il conteggio
• sw_stop(), mette in pausa il conteggio, senza azzerare il valore
9
una finestra di un’applicazione è detta modale se quando essa è visibile impedisce l’interazione
dell’utente con le altre finestre di programma. Generalmente sono modali le finestre che attendono un
input da parte dell’utente o le finestre che segnalano errori gravi.
50
• sw_reset(), azzera il conteggio
• sw_getTime(), ritorna il tempo attuale, in millisecondi
• sw_isRunning(), ritorna TRUE se il cronometro è in esecuzione, FALSE altrimenti
Quando non è più necessario aggiornare il cronometro, perché non ci sono più media che
devono essere terminati, il conteggio è automaticamente bloccato.
La classe Media è un oggetto JavaScript che memorizza alcune informazioni su un
singolo media e offre il metodo per disegnarlo nella pagina HTML. In particolare, Media
contiene:
• L’attributo type che indica il tipo di media (img, video, audio).
• L’attributo content che contiene l’URL del media.
• L’attributo additional che contiene informazioni aggiuntive, come un’eventuale
descrizione.
• Gli attributi begin ed end che indicano il tempo assoluto di inizio e di fine del
media. Il tempo di fine può essere 0, e in tal caso si considera la durata intrinseca
del media; ovvero un media continuo finisce al termine della sua riproduzione, mentre
un’immagine termina subito
• Il metodo draw() che disegna il media nella pagina, ovvero nel caso di un’immagine
la inserisce nella regione con il tag HTML img, mentre nel caso di video o audio il
metodo inizializza opportunamente Flowplayer.
La classe Region è un oggetto JavaScript che memorizza alcune informazioni relative
al posizionamento nella pagina e fornisce alcuni metodi per l’aggiornamento della regione.
In particolare, Region contiene:
• L’attributo name che indica il nome della regione.
• Il campo media[] che è la collezione di Media che devono essere riprodotti in una
certa regione, ordinati per tempo di inizio crescente.
• Gli attributi top, left, width e height e z-index che contengono le informazioni
sul posizionamento della regione nella pagina.
• Il metodo addMedia che permette di aggiungere il Media alla collezione dei media
da visualizzare nella regione
• Il metodo init che disegna la regione nella pagina, ovvero aggiunge il nodo div
corrispondente alla regione come figlio dell’elemento contenitore della presentazione
• Il metodo update che controlla se occorre riprodurre un Media della collezione (basta
guardare il primo, perché sono in ordine crescente per tempo d’inizio). Il metodo
verifica anche se il media attualmente in riproduzione dev’essere fermato perché ha
raggiunto il suo tempo di fine. Per poter valutare se la presentazione è terminata,
il metodo update() ritorna TRUE se sono ancora presenti dei video da visualizzare
nella regione, altrimenti ritorna FALSE.
CAPITOLO 3. SINCRONIZZAZIONE DI CONTENUTI MULTIMEDIALI
51
• Il metodo updateTiming che è stato aggiunto per la risoluzione di un bug di cui si
discuterà in seguito
Il file smil_player.js contiene le funzioni per l’inizializzazione e la riproduzione della
presentazione. Sono presenti diverse funzioni di utilità, ma quelle più importanti sono:
• Il costruttore smil_player(_doc, _container) che riceve come parametri il nome
del documento SMIL e l’elemento contenitore della presentazione. La funzione si
occupa di scaricare tramite AJAX il documento XML e poi richiama le funzioni per
inizializzare ed avviare la presentazione.
• La funzione parseSMIL effettua il parsing del documento XML, dividendo il lavoro tra le funzioni parseHead, che si occupa dell’inizializzazione delle regioni, e
parseMediaRec, che si occupa di inizializzare i media e di aggiungerli alle regioni di
appartenenza.
• La funzione clock() che è la funzione richiamata a intervalli regolari e che controlla
l’intera riproduzione, ovvero richiama il metodo update() di ogni Region.
Per comprendere meglio come si comporta il player SMIL, si descriverà ora il flusso
dell’esecuzione a parole e graficamente con l’utilizzo di un diagramma UML delle attività
(figura 3.8).
Le prime operazioni eseguite dall’applicazione sono la visualizzazione della finestra modale
di caricamento e il download del documento SMIL con una chiamata AJAX. Se il documento non esiste è visualizzata una finestra di errore e l’applicazione termina; se invece
il documento esiste si può procedere al parsing. Se il documento non è valido il parsing
fallisce; viene perciò mostrato un errore e l’applicazione termina. Se non ci sono errori, la
funzione di parsing si occuperà di memorizzare le informazioni sulle regioni e sui media
e al termine avvierà il cronometro e la presentazione. Quest’operazione può essere effettuata richiamando la funzione clock(). A questo punto si può nascondere la finestra di
caricamento.
La prima operazione effettuata dalla funzione clock() è impostare un timer per fare in
modo che sia richiamata nuovamente dopo un certo intervallo di tempo. Quest’operazione viene effettuata solo se la presentazione non è ancora terminata; una presentazione si
considera terminata se non ci sono più media da attivare in seguito e se i media attivi in
quell’istante hanno un campo end uguale a 0, cioè si attende la loro terminazione naturale. Si noti che ci sono ancora dei media attivi, quindi per l’utente la presentazione non
è finita; il player però non ha più operazioni da effettuare, perciò la considera terminata.
Per verificare se sono presenti ancora media da gestire si può usare il valore di ritorno del
metodo update() della classe Region.
A questo punto la funzione clock() può richiamare il metodo update() su tutte le regioni;
questo metodo valuterà caso per caso se ci saranno media da attivare, media da fermare,
oppure nessuna operazione da effettuare.
52
Figura 3.8: diagramma delle attività del player SMIL
CAPITOLO 3. SINCRONIZZAZIONE DI CONTENUTI MULTIMEDIALI
53
La directory che dev’essere caricata sul server web ha la seguente struttura:
- pagina HTML
- documento XML (l’estensione deve essere .xml)
- include (directory)
– scripts (directory)
∗ flowplayer.js
∗ jqmodal.js
∗ jquery.js
∗ media.class.js
∗ region.class.js
∗ smil_player.js
∗ stopwatch.js
– styles (directory)
∗ smil_player.css
∗ . . . (altri elementi grafici della pagina possono essere inseriti qui)
– swf (directory)
∗ flowplayer.swf
∗ flowplayer.rtmp.swf
È possibile modificare la struttura delle directory, ma occorre aggiornare anche la
pagina HTML di conseguenza.
Per l’installazione del player è sufficiente copiare le directory e i file elencati, definire una
presentazione SMIL in un documento XML e indicare il nome del documento nella pagina
HTML.
È stata preparata anche una versione minified del player SMIL, che risulta più semplice
da installare e di dimensione minore. La struttura delle directory rimane la stessa, ma tutti
i file contenuti nella cartella scripts sono sostituiti dall’unico file smil_player.min.js.
La pagina HTML va aggiornata per includere solo questo file. Il peso della versione Minified è di 83K, mentre quello della versione non compressa del player è di 170K; in pratica
la versione compressa permette di dimezzare i tempi di download dello script.
In conclusione, si vogliono elencare limiti e pregi del prodotto sviluppato.
La caratteristica più importante da valutare è il numero e il tipo di documenti che il player è
in grado di interpretare correttamente. Con qualche leggera discrepanza dallo standard, si
può dire che l’applicazione aderisce quasi interamente al profilo Tiny di SMIL 3.0, in quanto
sono supportati tutti i tag del profilo, ad esclusione di animation, ref, text e textstream
e la maggior parte degli attributi. Si noti che questi tipi di media possono essere aggiunti
modificando solo la classe Media e andando a ridefinire in particolare il metodo draw().
Grazie alla flessibilità dell’applicazione è possibile estenderne le funzionalità in maniera
semplice.
Per definire in maniera più precisa la classe di documenti che il player è in grado di interpretare correttamente, si è scelto di utilizzare una grammatica regolare; i simboli in maiuscolo sono non terminali, quelli in minuscolo sono invece terminali. I valori tra parentesi
quadre indicano attributi opzionali mentre con il singolo ’.’ si indica la concatenazione.
54
SMIL_ROOT −> <s m i l >.HEAD.BODY. </ s m i l >
HEAD −> <head >.META_GROUP.LAYOUT. </ head>
META_GROUP −> <meta name = " . . " c o n t e n t = " . . " / >.META_GROUP
LAYOUT −> <l a y o u t >.REGION_GROUP. </ l a y o u t >
REGION_GROUP −> <r e g i o n regionName = " . . " l e f t = " . . " top = " . . " width = " . . " h e i g h t = " . . " [
z−i n d e x = " . . " ] / >.REGION_GROUP
BODY −> <body >.MISC_CONTENT_GROUP. </body>
MISC_CONTENT_GROUP −> MISC_CONTENT.MISC_CONTENT_GROUP
MISC_CONTENT −> <s e q [ r e g i o n = " . . " ] [ b e g i n = " . . " ] [ end = " . . " ] [ dur = " . . " ] > .
MISC_CONTENT_GROUP. </ seq> |
−> <par [ b e g i n = " . . " ] [ end = " . . " ] [ dur = " . . " ] [ s y n c B e h a v i o r ="{ l o c k e d |
i n d e p e n d e n t } ] " > . MISC_CONTENT_GROUP. </ par> |
−> <v i d e o s r c = " . . " [ r e g i o n = " . . " ] [ b e g i n = " . . " ] [ end = " . . " ] [ dur = " . . " ] /> |
−> <a u d i o s r c = " . . " [ r e g i o n = " . . " ] [ b e g i n = " . . " ] [ end = " . . " ] [ dur = " . . " ] /> |
−> <img s r c = " . . " [ r e g i o n = " . . " ] [ b e g i n = " . . " ] [ end = " . . " ] [ dur = " . . " ] [ t i t l e
= " . . " ] />
Oltre alle funzionalità di sincronizzazione di base di SMIL, si è anche scelto di implementare la hard synchronization. Normalmente, quando si inseriscono due media in un par,
SMIL garantisce che i due partano assieme, non che procedano di pari passo. Supponiamo
di voler realizzare una presentazione in cui ci siano un video e alcune slide sincronizzate,
proprio come nel primo applicativo sviluppato. Se si mettono video e sequenza di immagini all’interno di un par senza ulteriori indicazioni, quando si andrà a riprodurre la
presentazione si potrà mettere in pausa il video, perdendo i vincoli temporali tra i due
media. In questo caso la sincronizzazione tra i media è soft; è possibile però ottenere
una sincronizzazione di tipo hard attraverso l’uso dell’attributo syncBehavior. In questo
modo si possono effettivamente avere i due media che procedono insieme, aspettandosi
l’un l’altro. Per ottenere questo risultato nell’applicazione, si è aggiunto un flag che è
impostato durante la fase di parsing, a seconda della presenza e del valore dell’attributo
syncBehavior. Nell’esempio precedente, se il flag è attivo, quando si mette in pausa il
video si mette in pausa l’intera presentazione, cronometro compreso. In questo modo non
si perde la sincronizzazione.
Nonostante il player interpreti correttamente un gran numero di documenti SMIL, non
è detto che sia in grado di riprodurli. I player desktop, come Ambulant o Real Player, cominciano ad avere difficoltà quando si tratta di riprodurre più media contemporaneamente,
in particolare se sono presenti effetti o animazioni. In un browser le risorse disponibili sono ancor più limitate, poichè questo software è fortemente orientato alla visualizzazione
di documenti e non certo a presentazioni multimediali. Queste limitazioni sono evidenti
quando si cominciano ad inserire più media continui nello stesso istante nella presentazione; spesso ne viene perso qualcuno. Occorre tenerne conto, quando si creano i documenti
SMIL, altrimenti si rischia di ottenere una presentazione troppo pesante da eseguire sul
browser.
Si deve inoltre evidenziare il fatto che si sta utilizzando la rete per la trasmissione dei
media continui. Questo comporta naturalmente dei ritardi dovuti alla trasmissione, ma
soprattutto implica che al momento del parsing del documento SMIL non si conoscono
alcune informazioni importanti sui media; in particolare non si conosce la durata di quelli
continui. Se non è specificato un valore esplicito di durata del media nel documento,
non è possibile costruire in maniera corretta la linea temporale della presentazione. È
tuttavia possibile limitare almeno in parte il problema, quando la durata del media serve
CAPITOLO 3. SINCRONIZZAZIONE DI CONTENUTI MULTIMEDIALI
55
per calcolare il tempo di inizio di un secondo media nella stessa regione. Per esempio, si
supponga di avere il frammento
<seq>
<v i d e o s r c = " . . " r e g i o n ="A" />
<img s r c = " . . " r e g i o n ="A" />
</seq>
nel documento SMIL. Se non è possibile conoscere la durata del video, per esempio perché
questo non è nel file system locale, quando la riproduzione raggiungerà questo frammento, il video sarà inserito nella regione A e poi sostituito immediatamente dall’immagine.
Occorre notare però, che sebbene le informazioni sul video non siano note nella fase di
parsing, lo sono invece quando la riproduzione raggiunge il punto in cui sono definiti. In
quel momento il client effettua la richiesta del media al server di streaming, e quest’ultimo comincia a trasmettere. Le prime informazioni che sono trasmesse sono i metadata,
che contengono tra l’altro, proprio l’informazione sulla durata del video. A questo punto,
ancora prima di iniziare la riproduzione del video, ne conosciamo la durata e possiamo
quindi aggiornare il tempo di inizio dell’immagine in base a questa. Con questa soluzione
possiamo risolvere il problema nel caso i media appartengano alla stessa regione, ma non
se appartengono a regioni diverse. Quando si passa dal documento SMIL alla linea temporale della presentazione, si perde ogni relazione temporale tra i media e si rimane con soli
riferimenti assoluti. Di conseguenza non è possibile sapere se un media è relazionato con
un altro dopo la fase di parsing. Si potrebbe comunque risolvere il problema in maniera
completa effettuando il download dei soli metadata dei video della presentazione durante
la fase di parsing; in questo caso, al costo di una fase di preparazione più lunga si può
conoscere fin dall’inizio la durata dei media.
Nonostante le limitazioni sin qui descritte, si può comunque ritenere il prodotto valido, innanzitutto perché copre un ambito di grande interesse, ma che ancora non mostra
evidenti sviluppi ed in secondo luogo perché, nonostante il breve tempo a disposizione,
si è riusciti a soddisfare comunque gli obiettivi che si erano posti. Anche i vincoli sono
rispettati; l’applicazione funziona correttamente ed è stata testata su Internet Explorer
6+, Mozilla Firefox 2+, Apple Safari 3+, Opera 9+ e Google Chrome 2+, inoltre non
sono richiesti ulteriori plugin per il suo funzionamento.
56
Capitolo 4
Conclusioni
Si può ritenere che lo stage si sia concluso con un discretto successo. La progettazione
della piattaforma di streaming è stata realizzata studiando in maniera approfondita tutte
le singole problematiche incontrate, senza tralasciare alcun dettaglio. Nonostante ciò si è
comunque riusciti a raggiungere tutti gli scopi prefissati ed anche ad aggiungere qualche
attività inizialmente non prevista nel piano.
Partendo da conoscenze in materia di streaming decisamente limitate, si è passati allo
studio dei principali protocolli e dei formati dei file più adatti e diffusi nel settore, per
arrivare poi a scegliere, installare e configurare alcune tra le principali soluzioni oggi in
commercio in ambito di server di streaming. A questo punto si sono potuti effettuare i
necessari test per verificare le prestazioni delle varie soluzioni e arrivare in conclusione alla
scelta finale sul server di streaming da usare. L’esigenza di aggiornare l’offerta di contenuti
multimediali di un portale aziendale ha imposto inoltre un attenzione particolare ad alcune
tematiche di accessibilità dei contenuti che non sempre sono prese in considerazione quando
si realizzano pagine web.
Per completare il quadro si è poi passati ad una fase più applicativa, che ha avuto come
obiettivo quello di realizzare due applicazioni che facessero uso del server di streaming
predisposto precedentemente. Si è quindi passati all’analisi, alla progettazione ed infine
allo sviluppo dell’applicazione per la sincronizzazione tra video e slide. Una prima versione
minimale è stata in più occasioni riadattata per aggiungere nuove funzionalità e per darle
un aspetto grafico gradevole; al termine si è giunti ad un prodotto un po’ limitato nelle
funzionalità, ma molto efficiente e di semplice installazione in pagine web esistenti.
A quel punto si è individuata subito la strada per un secondo prodotto ancor più flessibile
ed innovativo, cioè il player web per il linguaggio SMIL. Questo secondo applicativo è di
interesse non solo per l’azienda, che con esso può ulteriormente ampliare la propria offerta
di contenuti multimediali, ma anche per altri individui, in quanto non esistono attualmente
soluzioni simili per riprodurre contenuti SMIL su browser senza l’utilizzo di plugin o di
profili appositi.
Per il tesista lo stage è stato un momento di grande accrescimento personale grazie
all’ampia varietà di problematiche affrontate, che hanno richiesto un accurato studio per
essere risolte; da questo punto di vista si può ritenere lo stage svolto presso l’azienda
QBgroup un’ottima esperienza lavorativa e di vita.
57
58
Ringraziamenti
La prima persona che voglio ringraziare è la mia relatrice, la dott.ssa Ombretta Gaggi. Le
sono molto debitore per la disponibilità dimostrata, ma soprattutto per l’enorme pazienza
che ha saputo offrirmi anche nei momenti difficili. La ringrazio per essere stata sempre
attenta e precisa e per avermi dato spesso motivazioni per migliorare.
In secondo luogo voglio ringraziare l’azienda QBgroup per avermi dato la possibilità di
svolgere quest’esperienza importante. Un grazie di cuore va a Marco Regazzo, amico prima che collega, così come agli altri ragazzi di QUBIsoft: Roberto, Davide, Paolo, Stefano,
Efran, Giovanni e Alessandro “Rudy” che hanno reso splendida la permanenza in azienda.
Un doveroso ringraziamento va naturalmente a Giorgia, senza la quale non sarei la
persona che sono ora.
Desidero ringraziare anche la mia famiglia, mio fratello, Francesca e Gaia per il sostegno e la fiducia che hanno saputo darmi in tutti questi anni.
Ed infine non posso non ringraziare tutti gli amici, vecchi e nuovi, vicini e lontani, che
mi hanno sempre dato tantissimo e che spero di essere riuscito a contraccambiare.
Non vi cito singolarmente perché spenderei più soldi per stampar la tesi.
59
60
Bibliografia
[1] QBGROUP spa
http://www.qbgroup.it
[2] eDott
http://www.edott.it
[3] RFC 2326, Real Time Streaming Protocol (RTSP), 1998
http://tools.ietf.org/html/rfc2326
[4] Sourceforge
http://sourceforge.net
[5] Slashdot, Adobe Uses DMCA On Protocol It Promised To Open, Maggio 2009
http://yro.slashdot.org/article.pl?sid=09/05/22/1254246
[6] Adobe, Real-Time Messaging Protocol (RTMP) specification
http://www.adobe.com/devnet/rtmp
[7] VMware Inc., VMware Server
http://www.vmware.com/products/server
[8] Adobe, Flash Media Streaming Server 3.5
http://www.adobe.com/products/flashmediastreaming
[9] Adobe, Flash player version penetration, Settembre 2009
http://www.adobe.com/products/player_census/flashplayer/version_
penetration.html
[10] Stats Owl, Flash Player Version Support, Novembre 2009
http://www.statowl.com/flash.php
[11] Adobe Flex
http://www.adobe.com/it/products/flex
[12] Adobe Photoshop Express
https://www.photoshop.com
[13] OSFlash, Red5 : Open Source Flash Server
http://osflash.org/red5
[14] OSFlash, Red5 Showcase
http://osflash.org/red5/showcase
61
[15] OSFlash Mailing List, RTMP Handshake changes in Flash 10.0.32.18, Agosto 2009
http://osflash.org/pipermail/red5_osflash.org/2009-August/035378.html
[16] Microsoft, Windows Media Services
http://www.microsoft.com/windows/windowsmedia/forpros/serve/
prodinfo2008.aspx
[17] Paul Gregoire, RTMP load tester
http://gregoire.org/2008/09/12/rtmp-load-tester
[18] Microsoft, Windows Media Services Tools and Add-ins
http://www.microsoft.com/windows/windowsmedia/forpros/serve/tools.aspx
[19] JW Player
http://www.longtailvideo.com/players/jw-flv-player
[20] Flowplayer
http://flowplayer.org
[21] Silverlight 2 Video Player
http://www.widgetslab.com/2008/06/26/silverlight-2-open-source-video-player
[22] Tinic Uro, Adobe Developer, New File Extensions and MIME Types for Flash video
http://www.kaourantin.net/2007/10/new-file-extensions-and-mime-types.
html
[23] Microsoft, Scripting with Windows PowerShell
http://technet.microsoft.com/en-us/scriptcenter/dd742419.aspx
[24] FFmpeg
http://ffmpeg.org
[25] Projects based on FFmpeg
http://ffmpeg.org/projects.html
[26] FFmpeg Documentation
http://ffmpeg.org/ffmpeg-doc.html
[27] FLVTool2
http://inlet-media.de/flvtool2
[28] Adobe, FLV file format specification
http://www.adobe.com/devnet/flv
[29] World Wide Web Consortium, XMLHttpRequest
http://www.w3.org/TR/2009/WD-XMLHttpRequest-20091119/
[30] jQuery
http://jquery.com
[31] YUI Compressor
http://developer.yahoo.com/yui/compressor/
62
[32] Galleria
http://devkick.com/lab/galleria/
[33] World Wide Web Consortium, Synchronized Multimedia
http://www.w3.org/AudioVideo
[34] Real Player
http://real.com
[35] Ambulant Player
http://www.ambulantplayer.org
[36] Microsoft Developer Network (MSDN), Introduction to HTML+TIME
http://msdn.microsoft.com/en-us/library/ms533099(VS.85).aspx
[37] World Wide Web Consortium, Synchronized Multimedia Integration Language (SMIL
3.0)
http://www.w3.org/TR/2008/REC-SMIL3-20081201/cover.html
[38] Flowplayer Javascript API
http://flowplayer.org/documentation/api/index.html
[39] StopWatch Script in JavaScript
http://www.java-scripts.net/javascripts/Stop-Watch-Script.phtml
[40] jqModal, Minimalistic Modaling with jQuery
http://dev.iceburg.net/jquery/jqModal/
BIBLIOGRAFIA
63