rapportdigital-tv

106
Sommaire Liste des figures............................................3 Liste des tableaux...........................................5 Liste des abréviations.......................................6 Introduction Générale........................................7 CHAPITRE 1 : Contexte du projet.............................10 I. Présentation de l’organisme d’accueil...................10 A. Présentation.........................................10 B. Mission..............................................11 C. Objectifs:...........................................11 II........................................Présentation du projet 11 III. Méthodologie de travail...............................13 A. La méthode XP :......................................13 B. Mise en œuvre de la méthode XP :.....................15 CHAPITRE 2 : Etat de l’art..................................19 I. La télévision sur internet..............................19 A. IP TV :..............................................19 B. Internet TV :........................................20 C. Web TV :.............................................20 II............................................ Le streaming vidéo 21 A. Fonctionnement :.....................................21 B. Les différents types de streaming....................22 C. Les protocoles de streaming :........................24 D. Inventaires des solutions de diffusion vidéo.........26 III. Le cloud computing....................................28 A. Les services du cloud :..............................28 1

Upload: ahmed-oumezzine

Post on 10-Jan-2017

3.127 views

Category:

Documents


0 download

TRANSCRIPT

SommaireListe des figures........................................................................................................................ 3

Liste des tableaux......................................................................................................................5

Liste des abréviations................................................................................................................6

Introduction Générale...............................................................................................................7

CHAPITRE 1 : Contexte du projet............................................................................................10

I. Présentation de l’organisme d’accueil.........................................................................10

A. Présentation..........................................................................................................10

B. Mission..................................................................................................................11

C. Objectifs:...............................................................................................................11

II. Présentation du projet.................................................................................................11

III. Méthodologie de travail...........................................................................................13

A. La méthode XP :....................................................................................................13

B. Mise en œuvre de la méthode XP :.......................................................................15

CHAPITRE 2 : Etat de l’art........................................................................................................19

I. La télévision sur internet..............................................................................................19

A. IP TV :....................................................................................................................19

B. Internet TV :..........................................................................................................20

C. Web TV :................................................................................................................20

II. Le streaming vidéo.......................................................................................................21

A. Fonctionnement :..................................................................................................21

B. Les différents types de streaming.........................................................................22

C. Les protocoles de streaming :...............................................................................24

D. Inventaires des solutions de diffusion vidéo.........................................................26

III. Le cloud computing..................................................................................................28

A. Les services du cloud :...........................................................................................28

B. Cloud computing et clusters :...............................................................................29

C. Avantages et inconvénients du cloud computing:................................................30

D. Types de Cloud Computing :.................................................................................31

E. La diffusion des vidéos à partir du cloud :................................................................32

IV. Windows Azure.........................................................................................................33

1

V. Windows Azure Media Services...................................................................................35

CHAPITRE 3 : Analyse et spécification des besoins..................................................................42

I. Etude de l’existant........................................................................................................42

II. Spécification des besoins.............................................................................................42

A. Les besoins fonctionnels :.....................................................................................42

III. Diagramme de cas d’utilisation................................................................................43

A. Cas d’utilisation global :........................................................................................43

B. Description textuelle des cas d’utilisation.............................................................44

IV. Technologies utilisées :.............................................................................................46

CHAPITRE 4 : Conception de l’application...............................................................................51

I. Diagramme d’activité :.................................................................................................51

II. Diagrammes de séquences :.........................................................................................52

A. Administrateur :....................................................................................................52

B. Utilisateurs :..........................................................................................................53

III. Diagramme de classes :............................................................................................54

IV. Modèle de données :................................................................................................55

CHAPITRE 5 : Réalisation.........................................................................................................60

I. Environnement de développement :............................................................................60

A. Environnement matériel :.....................................................................................60

B. Environnement logiciel :.......................................................................................60

C. Environnement de programmation :....................................................................60

II. Architecture du système :............................................................................................63

III. Test :.........................................................................................................................63

IV. Les IHM de l’application :.........................................................................................64

A. Front office:...........................................................................................................64

B. Back office :...........................................................................................................66

Conclusion générale................................................................................................................70

Annexe A : Développement des applications Windows Azure Media Services.......................72

Annexe B : Présentation W3C.................................................................................................76

Bibliographie...........................................................................................................................77

2

Liste des figures

Figure 1 : Les piliers stratégiques de CIC................................................................................10Figure 2 : Cycle de vie d'un projet XP......................................................................................13Figure 3 : Pseudo Streaming....................................................................................................21Figure 4 : La lecture en continu...............................................................................................22Figure 5 : Les service du cloud................................................................................................28Figure 6 : Composition du cloud.............................................................................................29Figure 7 : Les types du cloud...................................................................................................30Figure 8 : Les scénarios d’utilisation du cloud........................................................................32Figure 9 : Architecture Windows Azure Media Services........................................................34Figure 10 : Création de compte de stockage...........................................................................36Figure 11 : Création service média..........................................................................................36Figure 12 : Réservation des capacités.....................................................................................37Figure 13 : Téléchargement des vidéos...................................................................................37Figure 14 : Les opérations à effectuer sur une vidéo..............................................................38Figure 15 : Encodage...............................................................................................................38Figure 16 : Tableau de bord du service média........................................................................39Figure 17 : Cas d'utilisation global..........................................................................................43Figure 18 : Diagramme d'activité............................................................................................50Figure 19 : Diagramme de séquences (Authentification).........................................................51Figure 20 : Diagramme de séquences (Création programme)..................................................52Figure 21 : Diagramme de séquences (Visualiser programme)................................................52Figure 22 : Diagramme de classes...........................................................................................53Figure 23 : Modèle de données................................................................................................54Figure 24 : data_base.xml........................................................................................................55Figure 25 : playlist.xml...........................................................................................................55Figure 26 : montage.xml..........................................................................................................56Figure 27 : programme.xml.....................................................................................................57Figure 28 : Architecture WAMP Server..................................................................................60Figure 29 : Architecture du système.......................................................................................62Figure 30 : Composition de la page publique.........................................................................63Figure 31 : En-tête...................................................................................................................63Figure 32 : Lecteur HTML5....................................................................................................63Figure 33 : Playlist..................................................................................................................64Figure 34 : Bonnes nouvelles..................................................................................................64Figure 35 : Vidéothèque..........................................................................................................64Figure 36 : Composition de la page d'administration...............................................................65Figure 37 : Bibliothèque..........................................................................................................65Figure 38 : Partie montage......................................................................................................66

3

Figure 39 : Insertion news.......................................................................................................66Figure 40 : Formulaire ajout texte animé.................................................................................66Figure 41 : Les couches de développement sur Windows Azure............................................73

4

Liste des tableaux

Tableau 1 : Estimation des tâches...........................................................................................14Tableau 2 : Comparaison TV sur internet................................................................................19Tableau 3 : Les protocoles standards.......................................................................................23Tableau 4 : Les protocoles propriétaires.................................................................................24Tableau 5 : Avantages/Inconvénients des services du cloud...................................................27Tableau 6 : Description de cas d'utilisation "Athentification".................................................38Tableau 7 : Description de cas d'utilisation "Créer programme".............................................39Tableau 8 : Description de cas d'utilisation "Insérer animation".............................................39Tableau 9 : Description de cas d'utilisation "Découper video"................................................39Tableau 10 : Les en-têtes de requête http standard...............................................................65Tableau 11 : Les fonctions http standards...............................................................................66Tableau 12 : Les principales entités du service média............................................................66

5

Liste des abréviations

6

LSE: Local Software Economy

IT: Information Technology

TV: Television

XP: eXtreme Programming

XML: eXtensible Markup Language

HTML: HyperText Markup Language

HTML5: HyperText Markup Language V5

VoD: Video on Demand

P2P: Peer to Peer

HTTP: HyperText Transfer Protocol

RTMP: Rea-lTime Messaging Protocol

RTSP: Real-Time Streaming Protocol

RTP: Real-Time Protocol

RTCP: Real-Time Control Protocol

MMS: Microsoft Media Service

MMSH: Microsoft Media Srvice over HTTP

RTMFP: Real-Time Media Flow Protocol 

RDT: Real Data Transport

FMSS: Flash Media Streaming Server

FMES: Flash Media Encoding Server

IaaS: Infrastructure as a Service

PaaS: Platform as a Service

SaaS: Software as a Service

CPU: Central Processing Unit

EC2: Elastic Compute Cloud

CSS: Cascading Style Sheets

AJAX: Asynchronous Javascript and XML

PHP: HyperText Processor

OSM Player: Open Standards Media Player

SQL: Simple Query Language

WYSIWYG: What You See Is What You Get

W3C: World Wide Web Consortium

IHM: Interface Homme-Machine

SDK: Software Development Kit

DRM: Digital Rights Management

Introduction Générale

La vidéo a connu au fil des temps des révolutions successives allant de sa capture et sa

transmission sous forme analogique jusqu’à sa numérisation et sa compression, ce qui a créé

des nouvelles possibilités y compris le stockage de la vidéo sur des CD et des DVD, la

diffusion de la vidéo sur le câble numérique et la télévision numérique.

L’évolution d’internet au milieu des années 90 a provoqué une nouvelle définition des

communications médias classiques donnant ainsi naissance à des nouveaux services tels que

les vidéoconférences et les télévisions sur Internet. Ces services ne cessaient d’évoluer grâce

aux changements tant sur le plan technologique qu’au chapitre des comportements des

consommateurs qui s’orientaient de plus en plus vers tout ce qui est plus facile à utiliser et qui

répond mieux à leurs besoins en terme d’accessibilité, de rapidité et surtout de qualité du

contenu.

D’un point de vue industriel, Le contenu vidéo est devenu un complément de communication

pour les entreprises. Le partage des vidéos avec l’audience peut se révéler être une excellente

idée pour augmenter la visibilité de leur business et cela ne constitue plus l’apanage

d’entreprises fortement capitalisées, capables de mettre en place des structures technologiques

spécialisées, même des petits diffuseurs peuvent tout à fait fonctionner et aspirer à la

rentabilité, sans posséder un réseau d’antennes, de câblodistribution ou satellitaire.

La tendance était donc la mise en place d’espaces dédiés aux programmes vidéo, de véritables

sites qui viennent en parallèle des sites traditionnels et qui permettent une diffusion optimisée

et personnalisée.

C’est dans ce cadre que s’inscrit ce projet de fin d’étude qui a pour objectif la contribution à

la mise en place d’une plateforme Web TV qui permet la diffusion des contenus vidéos sous

forme de programmes journaliers créés en ligne à travers une interface de montage simple et

conviviale. La diffusion des vidéos se fait à partir du cloud pour une meilleure qualité.

Ce présent rapport comprend cinq chapitres. Dans le premier chapitre, nous présenterons

l’organisme d’accueil et le sujet ainsi que la méthodologie adoptée pour sa mise en place.

Nous consacrerons le deuxième chapitre à l’analyse et la spécification des besoins dans lequel

nous détaillerons les besoins fonctionnels et non fonctionnels en faisant recours aux

diagrammes de cas d'utilisation. Dans le troisième chapitre, nous présenterons les concepts et

7

les technologies rencontrés lors de la réalisation du projet tels que le streaming vidéo et le

cloud computing. L’architecture de notre solution et la conception générale feront l’objet du

quatrième chapitre dans lequel nous présenterons les diagrammes de conceptions nécessaires.

Et, dans un dernier chapitre, nous détaillerons le travail réalisé ainsi que la présentation des

résultats des tests. Enfin, nous clôturerons ce rapport par une conclusion et quelques

perspectives de notre travail.

8

CHAPITRE1 : Contexte du projet

CHAPITRE 1 : Contexte du projet

Ce premier chapitre sera consacré pour l’introduction de projet et sa mise dans son contexte.

Nous présentons tout d’abord l’entreprise d’accueil. Ensuite, nous décrivons brièvement le

sujet de notre projet de fin d’étude. Nous allons, enfin, dévoiler la méthodologie que nous

allons suivre le long de projet.

I. Présentation de l’organisme d’accueil

A. Présentation 

Le centre d'innovation et de collaboration est un centre d'innovation technologique créé en

2012 pour répondre aux nouveaux changements stratégiques et aux besoins du secteur des

TIC en Tunisie. CIC est un centre d'excellence qui permet de connecter les développeurs, les

partenaires et les citoyens autour d'un ensemble de programmes novateurs offrants un accès

aux ressources, aux experts, pour dynamiser l'innovation locale et le développement des

compétences.

CIC inspire ses programmes des concepts LSE (Local Software Economy) internationales

avec une nouvelle vision d'ouverture et de partenariats pour favoriser le développement des

compétences, le capital intellectuel, le partenariat de l'industrie et de l'innovation. L’initiative

CIC appelle à un véritable engagement de partenariat public-privé pour répondre aux besoins

immédiats des collectivités locales, les organisations et les partenaires afin de favoriser

l'économie locale du logiciel avec plus des programmes et des stages dans les région sous-

développées ou gouvernorats du pays.

CIC offre un package innovant de services et de programmes pour la communauté locale IT

(étudiants, développeurs, les startups, les professionnels, etc ...) avec un objectif de :

Combler l'écart perçu entre l'université et l'industrie.

Le renforcement des capacités pour les étudiants pour créer des emplois.

Favoriser le système d'éducation en offrant des programmes standards (Certifications,

IT Academy, etc ...).

Inciter les industriels et les institutions financières à jouer efficacement leur rôle.

Investir dans l'innovation grâce à l'incubation de start-up.

Renforcer l'esprit d'entreprise et l'esprit de créativité parmi la population des jeunes.

10

Soutenir les VCs avec des startups à fort potentiel.

B. Mission 

La mission de l'innovation collaborative centre est de conduire avec excellence une

exécution d'un cadre novateur d'activités et de services (développement Citoyenneté et IT)

pour le bénéfice des étudiants, des start-up et les professionnels de l'informatique. Le cadre de

CIC contribuera à favoriser l'entrepreneuriat, le développement des compétences et

l'innovation dans la technologie. Le CIC fournira des services au gouvernement, aux

entreprises et aux citoyens à travers trois piliers stratégiques:

Figure 1 : Les piliers stratégiques de CIC

C. Objectifs:

CIC vise à promouvoir l'informatique comme vecteur de croissance économique et sociale par

les points suivants :

Le développement de l'économie locale du logiciel.

Soutenir l'initiative de développement régional afin de permettre l'accessibilité globale

de l'information pour tous les citoyens tunisiens.

Jouer un rôle majeur dans la réforme du système éducatif local.

Être un conseiller de confiance sur le tableau de bord de ses partenaires

(développement de la citoyenneté et de l'informatique) la performance et l'exécution.

Création d'un environnement plus approprié pour le savoir-faire pour ses partenaires.

II. Présentation du projet 

11

Support de Startupstirer parti des nouvelles

competences technologiques et

entrepreneuriales pour améliorer l'efficacité des startups et la prestation

de services

innover dans un environement ouvert

Fournir une plate-forme innovante pour le développement

d'entreprises technologiques locales pertinentes au niveau

mondial

democratiser l'education avec les

TICAméliorer l'accès aux

technologies de l'éducation et intégrer

les citoyens avec la «connaissance IT”

Ce projet intitulé « Conception et développement d’une plateforme web TV » consiste à

mettre en place une plateforme pour le montage et la diffusion vidéo en ligne en se basant

sur les services de cloud computing. Elle présente les fonctionnalités principales suivantes :

Création d’un programme journalier de diffusion en se basant sur le contenu

multimédia stocké sur le cloud et son enrichissement par des textes et des images

animés à travers un studio de montage simple à exploiter.

La personnalisation d’un lecteur vidéo basé sur HTML5 et son adaptation aux besoins

de diffusion.

En effet, notre application est basée entièrement sur les standards du web permettant ainsi une

meilleure interopérabilité et compatibilité avec les différents navigateurs et systèmes. Elle

utilise plusieurs documents XML pour la manipulation et le montage des fichiers multimédias

ce qui permet d’assurer la lisibilité des données et des traitements et donc pas d’obligation

d’avoir des connaissances pour comprendre le fonctionnement de l’application et c’est un

avantage par rapport aux sites communautaires (Youtube, Dailymotion…) puisque la mise en

ligne des vidéos et leur montage pour la création des programmes de diffusion à partir d’une

interface simple à exploiter et en se basant sur des fichiers XML s’avère moins commode et

ne nécessite pas la prestation d’un webmaster. L’utilisation de XML permet aussi

l’intégrabilité et la réutilisation des traitements essentiels par toute application pourvue d’un

parser c’est-à-dire qu’on peut facilement réimplanter les fonctionnalités de montage et de

création de bibliothèques sur d’autres applications et avec d’autres langages de

programmation.

L’objectif de notre plateforme est la création des programmes de diffusion journaliers diffusés

sur un lecteur vidéo HTML5 en utilisant un moteur de montage intelligent qui se base sur

plusieurs scripts. Ce moteur de montage permet ainsi de trancher un morceau de la vidéo ou

lui ajouter des évènements qui peuvent être des textes ou des images. Il est également possible

de préciser comment ces évènements vont interagir en déterminant les dates de début et de fin

et les types d’animations. Tout se fait sur le lecteur HTML 5 et sans toucher aux fichiers

vidéo, et c’est l’intérêt de notre application puisque pas besoin de créer de nouvelles vidéos

ou modifier celles qui existent et pas besoin d’un nouveau encodage. Le programme ainsi créé

et validé par l’administrateur et démarré par l’utilisateur déclenche le travail du moteur de

montage qui accède à l’ensemble des vidéos de la playlist et leurs contenus et n’affiche sur le

lecteur vidéo que les résultats des traitements.

12

Afin d’améliorer la qualité de diffusion et surpasser les problèmes de bande passante, nous

avons utilisé la technologie du cloud computing pour le stockage et la diffusion de nos vidéos.

De plus, notre application présente d’autres fonctionnalités comme la consultation des vidéos

classées par thèmes à partir d’une vidéothèque en ligne et l’affichage des NEWS directement

sur le lecteur ce qui présente un avantage indéniable par rapport aux sites communautaires

puisque nos vidéos sont positionnées dans notre environnement à proximité de nos

informations et sans invitation directe à regarder d’autre vidéos en provenance d’autres

utilisateurs.

III. Méthodologie de travail

Lorsque nous sommes arrivés au CIC, nous avions à créer une plateforme Web TV permettant

le montage et la diffusion des vidéos à travers un lecteur personnalisé. Cette plateforme de

Web TV était à l’état de « draft » pendant la durée de notre projet. Nous avons donc concentré

nos efforts plutôt dans le cœur de la mission qui nous avait été confiée, c’est-à-dire

l’implémentation de la plateforme et ses différentes fonctionnalités. Il était ainsi nécessaire de

fixer une méthodologie de travail afin d’aboutir à une solution de qualité. Dans cette partie,

nous présentons la méthodologie Agile XP (eXtreme Programming) qui a été adoptée dans

notre projet.

A. La méthode XP :

Une méthode agile est une approche itérative et incrémentale qui est menée dans un esprit

collaboratif avec juste ce qu’il faut de formalisme. Elle génère un produit de haute qualité tout

en tenant compte de l’évolution des besoins client. Parmi les méthodes et techniques dites

agiles, on distingue XP qui présente une discipline de développement orientée sur l'aspect

réalisation d'une application, sans pour autant négliger l'aspect gestion de projet.

L'Extreme Programming repose sur des cycles rapides de développement (des itérations de

quelques semaines) dont les étapes sont les suivantes :

une phase d'exploration détermine les scénarios client qui seront fournis pendant cette

itération

l'équipe transforme les scénarios en tâches à réaliser et en tests fonctionnels

chaque développeur s'attribue des tâches et les réalise

13

lorsque tous les tests fonctionnels passent, le produit est livré

Le cycle se répète tant que le client peut fournir des scénarios à livrer. Généralement le cycle

de la première livraison se caractérise par sa durée et le volume important de fonctionnalités

embarquées. Après la première mise en production, les itérations peuvent devenir plus courtes

(une semaine par exemple).

Figure 2 : Cycle de vie d'un projet XP

L'eXtreme Programming repose sur quatre valeurs fondamentales :

La communication : C'est le moyen fondamental pour éviter les problèmes. Les

pratiques que préconise l'XP imposent une communication intense et si un manque

apparaît malgré tout, un coach se charge de l'identifier et de remettre ces personnes en

contact.

La simplicité : Cette valeur de simplicité repose sur le pari qu’il coute moins cher de

développer un système simple aujourd’hui quitte à devoir engager de nouveaux frais

plus tard pour rajouter des fonctionnalités supplémentaires plutôt que de concevoir dès

le départ un système très compliqué dont on risque de n’avoir plus besoin dans un

avenir proche.

Le feed-back : Le retour d'information est primordial pour le programmeur et le client.

Les tests unitaires indiquent si le code fonctionne. Les tests fonctionnels donnent

l'avancement du projet. Les livraisons fréquentes permettent de tester les

fonctionnalités rapidement.

Le courage : Certains changements demandent beaucoup de courage. Il faut parfois

changer l'architecture d'un projet, jeter du code pour en produire un meilleur ou

essayer une nouvelle technique. Le courage permet de sortir d'une situation inadaptée.

C'est difficile, mais la simplicité, le feedback et la communication rendent ces tâches

accessibles.

14

B. Mise en œuvre de la méthode XP :

Le choix est porté sur la méthode Agile XP qui est bien adaptée lors du travail en équipe

réduite, où la communication entre tous les membres peut se faire de manière directe.

L’eXtreme Programming propose de nombreux principes qu’il convient de suivre pour

optimiser son développement. Cependant, et cela fait partie des avantages de cette méthode,

XP n’est pas rigide. On peut adapter son utilisation afin qu’il réponde aux besoins spécifique

de l’environnement dans lequel il est sollicité. En particulier pour notre projet, où le nombre

de développeurs est réduit et plusieurs rôles sont absents, certains points de la méthode ne

seront pas utilisés.

La phase initiale d’exploration   :

Cette phase s’est déroulée entre le 15 février et le 30 Mars et elle avait pour objectifs de

définir le contenu fonctionnel de l’application c’est-à-dire la liste des user stories, d’effectuer

les recherches autour de notre projet, d’assister à des conférences en rapport avec les

technologies utilisées et de se familiariser avec les outils et les environnements de

développement.

Ainsi, nous avons pu identifier les premières fonctionnalités de notre application à partir des

user stories suivants qui présentent les besoin du client de façon informelle:

En tant qu’administrateur, je dois m’authentifier pour accéder à la plateforme

En tant qu’administrateur authentifié, je retrouve un espace correspondant à mes

attentes en termes de création d’un programme de diffusion journalier avec une

interface simple à exploiter

En tant qu’utilisateur, je peux regarder le nouveau programme ou accéder aux anciens

programmes

Nous avons ensuite étudié les différentes architectures possibles par des prototypes pour avoir

une vue globale sur ce que nous allons faire.

La phase de planification  

Durant cette phase, nous avons présenté les user stories de façon formelle et nous avons

donné un ordre de priorité et une première estimation du temps de réalisation pour chaque

15

fonctionnalité. Il était nécessaire de définir d’autres taches à réaliser pour aboutir à certaines

fonctionnalités.

L’estimation est affecté selon une suite de Fibonacci (1, 2, 3, 5, 8, 13…) car c’est plus aisé de

dire qu’une user story est deux fois plus grosse qu’une autre en passant de 1 à 2. Ainsi, nous

nous accordons sur une user storie d’importance moyenne « En tant qu’administrateur, je dois

m’authentifier pour accéder à la plateforme » que nous imaginons parfaitement le contenu,

nous entendons pour lui attribuer 2 points et ainsi de suite pour toutes les autres.

Fonctionnalité Priorité Estimation

Authentification 1 2

Personnalisation du lecteur 2 8

Création du programme 3 13

Consultation de l’historique 4 5Tableau 1 : Estimation des tâches

Itérations jusqu’à la première release

Après la validation de la planification par notre encadreur, nous avons commencé le

développement. Nous avons planifié deux itérations :

L’objectif de la première itération est la création de l’architecture globale de la

plateforme et l’intégration du lecteur vidéo personnalisé. Cette itération a duré deux

semaines.

La deuxième itération est consacrée au développement de l’interface de montage et

pendant trois semaines, nous avons essayé de mettre en œuvre les principales

fonctionnalités correspondantes à cette interface.

Durant ces itérations, des réunions quotidiennes avec notre encadreur nous ont permis de faire

le point sur l’avancement et la présentation des objectifs ainsi que la résolution des difficultés

éventuelles. Le codage est réparti entre nous deux de la façon suivante : Le pilote code et le

copilote prépare les tests unitaires avec une intégration en continu.

Cette phase s’est déroulée entre le premier Avril et le 6 Mai et à la fin nous avons terminé la

première livraison.

Les autres itérations

16

L’intervention de monsieur Walid NEFFATI, un journaliste/manager à thd.tn (Tunisie Haut

Débit) un site spécialisé dans l'actualité TIC nationale, nous a permis d’identifier d’autres

besoins utilisateurs. Nous avons donc commencé à planifier d’autres itérations pour mettre en

œuvre les nouvelles fonctionnalités et améliorer notre application.

Les nouvelles itérations sont plus courtes et nous sommes concentrés sur l’amélioration du

code et les tests fonctionnels. Elles se sont déroulées comme suit :

Une itération de deux semaines pour l’ajout des news et des publicités en directe sur

le site publique et sur le lecteur au cours de la diffusion.

Une itération d’une semaine pour l’organisation automatique des médias selon leurs

thèmes

Une itération de deux semaines pour l’hébergement de notre plateforme et des

différents médias sur le cloud.

Après avoir présenté le projet et préciser la méthodologie à suivre, nous consacrons le

prochain chapitre pour la définition de nouveaux concepts et technologies qui vont nous aider

à mieux développer l’application.

17

CHAPITRE2 : Etat de l’art

CHAPITRE 2 : Etat de l’art

Dans ce chapitre, nous commençons par étudier les différents types de télévisions sur internet

et faire une comparaison entre elles, ensuite, nous allons présenter la technologie de streaming

qui est utilisée dans celles-ci et nous allons introduire la notion du Cloud computing en

général ainsi que ses services de médias qui représente la solution utilisée dans notre projet.

I. La télévision sur internet

Plusieurs termes sont employés pour désigner la télévision sur Internet. On parle souvent de :

Web TV, TV sur IP, Internet streaming, vidéo streaming, streaming media (également

employé comme terme générique) etc.

Malgré leur différence, ces termes désignent une même réalité: la diffusion des programmes

TV et des vidéos sur un réseau de données numérique au moyen du protocole Internet (IP).

A. IP TV :

IPTV est l'abréviation d’Internet Protocol Television. C’est une forme de télévision diffusée

sur un réseau utilisant le protocole IP qui regroupe plusieurs types de services et méthodes de

communication.

L'IPTV utilise la même infrastructure que l'accès Internet, mais avec une bande passante

réservée et est souvent fournie avec l'offre d'abonnement Internet haut débit mais peut aussi

être déployé dans les collectivités privées, en effet, cela permet à un hôtelier, hôpital, ou une

résidence de vacances de pouvoir proposer un bouquet de chaînes en IPTV ainsi qu'un panel

de service facturable et à la demande. L'établissement proposant ce réseau est considéré

comme opérateur télécom.

On distingue 3 types de services offerts :

 La télévision en direct qui utilise une solution IP multicast, ce qui permet d'envoyer

les informations une seule fois pour plusieurs personnes

 la vidéo à la demande (en anglais Video on Demand ou VoD) qui utilise une

solution IP unicast (une seule destination pour ces flux)

19

 les séances de rattrapage (en anglais catch-up TV) qui utilisent aussi la solution IP

unicast

B. Internet TV :

Distribution numérique du contenue de la télévision sur internet.

Permet aux utilisateurs de choisir les programmes tv qu’ils veulent regarder.

La plupart des fournisseurs du service internet tv offrent des différents formats et contrôle de

qualité le web TV peut être visualisé sur des appareils différents.

Avant 2006, la majorité de catch-up tv ont utilisé la technologie P2P(les utilisateurs

téléchargent une application et les données seront partagées entre eux). Maintenant les

fournisseurs utilisent le téléchargement en continue.

Ils ont utilisé P2P parce que l’infrastructure existante ne peut pas supporter la bande passante

nécessaire pour une distribution d’un streaming centralisé.

C. Web TV :

Les web TVs sont des sites web dont les contenus sont à dominante vidéo qui sont

cataloguées et diffusées en streaming.

Les fournisseurs de web TV ne garantissent pas une qualité d’image similaire ou meilleure

que la télévision traditionnelle puisqu’il est un modèle best effort dans lequel il est difficile

pour le fournisseur d’influencer sur la qualité de service.

Bande passante plus élevé meilleure qualité.

En général le web TV vise l’utilisation sur les ordinateurs.

En terme de contenu, il y a une confusion sur quel service en ligne doit être appelé Web TV :

VOD Vs. Chaines linéaires

Gratuit Vs. Payant

Basé sur un lecteur intégré Vs. un client desktop

Clips vidéo courts Vs. Clips vidéo longs

20

IP TV Internet TV Web TV

Infrastructure Réseau utilisant le

protocole IP

Internet internet

Réception La boxe qui sert à

décoder et décrypter les

contenus TV et VOD

pour les diffuser sur

l’écran TV

Navigateur

Application desktop

Smart phone

Tv supporte internet

Site web

(navigateur)

QoS Garantie Non garantie Non garantieTableau 2 : Comparaison TV sur internet

Ces différents types de télévisions sur Internet ont un point commun qui est l’utilisation de la

technologie de streaming pour diffuser leurs programmes. Dans la partie suivante, nous allons

présenter cette technologie.

II. Le streaming vidéo 

Le streaming est une technique qui permet de transférer des données audio et vidéo grâce à un

flux permanent. Il permet d'exploiter l'information reçue au fur et à mesure de sa transmission

du serveur au client sans attendre d’en avoir reçu la totalité. Bien qu’existant depuis plusieurs

années, son véritable essor suit l’air du temps, puisqu’il a profité du développement du parc

des ordinateurs portables, de la démocratisation de l’accès à Internet et surtout de celle de la

diffusion du haut débit dans les foyers.

Nous allons étudier son fonctionnement, les technologies associées et nous allons présenter

les inventaires des solutions de streaming les plus connus.

A. Fonctionnement :

Techniquement, le streaming fonctionne selon le protocole client-serveur. Le contenu est ainsi

mis à disposition sur un serveur. L’internaute (client) qui veut visionner une vidéo clique sur

une icône ou un lien dans une page web : il envoie alors une requête depuis son propre

ordinateur vers un serveur sur lequel est stocké le fichier sélectionné.

21

Le serveur (ou plate-forme de diffusion) expédie en retour le fichier en paquets, via Internet.

Le lecteur de contenu streaming va récupérer une partie du contenu qu’il met dans une

mémoire tampon (dite "buffer"). Lorsque le lecteur estime qu’il a suffisamment de données

dans sa mémoire tampon pour lui permettre de lire le contenu audio ou vidéo sans accroche, la

lecture démarre. Le contenu est décodé par le lecteur, tandis que les nouveaux paquets sont

stockés dans le tampon. Selon la vitesse à laquelle se remplit le tampon, le serveur détermine

la qualité de la connexion, et envoi plus ou moins de données. Quand l’envoi est terminé, la

vidéo s’arrête. Il est important de préciser que le fichier n’est pas stocké sur l’ordinateur de

l’internaute après son visionnage. Les données sont détruites au fur et à mesure.

B. Les différents types de streaming

Deux sortes de lecture existent, l'une est dite « en progressif », l'autre « en continu ».

La lecture en progressif (pseudo-streaming)   :  

La lecture en progressif, quant à elle, est la solution la plus couramment utilisée par les plates-

formes de partage de vidéos, car elle ne nécessite pas de serveur spécialisé, un serveur HTTP

« standard » étant suffisant. Le fichier vidéo est simplement proposé à la lecture, de la même

manière que tout autre type de fichier, et c'est le navigateur qui se charge d'effectuer la

lecture de la vidéo. L'inconvénient de cette solution est l'impossibilité de s'adapter à la qualité

de connexion de l'utilisateur. Pour le diffuseur, il devient ainsi souvent nécessaire de proposer

plusieurs fichiers avec des résolutions différentes pour permettre à l'internaute de choisir en

fonction des capacités de sa connexion. Il convient de noter que si le fichier est de taille

importante, elle induit une certaine attente avant la diffusion des premières images. La mise

en ligne de longs métrages sur les plates-formes de partage de vidéos n’est donc pas

impossible, mais est ainsi généralement effectuée par parties.

Figure 3 : Pseudo Streaming

22

La lecture en continu   :

Dans le cas de la lecture en continu, il n'y a qu'un seul fichier diffusé contenant plusieurs fois

les mêmes informations à différents niveaux de qualité, et c'est le serveur de lecture en

continu spécialisé qui se charge de diffuser l'information adaptée.

En fonction du débit de la connexion de l'internaute, le serveur sélectionne le niveau de

qualité maximal pour une diffusion en temps réel. Le serveur est également capable de

s'adapter automatiquement aux variations de la bande passante : si la connexion se détériore et

que le taux de transfert baisse, le contenu est livré avec une moindre qualité afin d'éviter les

interruptions de diffusion. Si en revanche la connexion devient plus fluide, la qualité

s'améliore. Le contenu démarre dès que l'utilisateur demande à y accéder sans délais.

L'inconvénient de cette solution est de devoir utiliser un serveur spécialisé (Xiph Icecast, Real

Helix Streaming Server, Windows Media Services, Adobe Flash Media Server, Quicktime

Streaming Server, etc.) et que l'internaute doit avoir une bande passante adaptée au contenu

envoyé. Le contenu étant diffusé au même rythme que la lecture de l'internaute.

Figure 4 : La lecture en continu

Le broadcast   :

Probablement, la forme la plus populaire de la diffusion des vidéos ou l’exemple le plus

connu est la diffusion télé. Le broadcaste se montre très efficace pour les contenus publics vue

qu’il peut souvent diffuser à tous les récepteurs en même temps.

Un aspect très important des communications en broadcast est que le système doit être conçu

pour fournir à chaque récepteur le signal requis en tenant compte de la différence des

caractéristiques des canaux de diffusion et par conséquent le système est souvent jugé pour

le cas le plus pessimiste (worst-case).

23

L’unicast   :

C’est une forme de communication point-à-point entre deux ordinateurs dans un réseau, par

exemple visiophonie. La propriété la plus importante pour ce type de communications est

l’existence ou non d’une voie de retour entre le récepteur et l'émetteur.

Si elle existe, le récepteur peut fournir un feedback à l'expéditeur qui peut l’utiliser ensuite

pour adapter son traitement aux besoins du récepteur. Par contre, sans cette voie de retour,

l'expéditeur a une connaissance limitée du canal.

Le multicast   :

C’est une autre forme de communication avec des propriétés qui se trouvent entre l’unicast et

le broadcast. Il s’agit d’une communication point à multipoints. Un exemple de ce type de

diffusion est le multicast IP sur Internet.

Pour faire communiquer plusieurs récepteurs, le multicast est plus efficace que de multiples

connexions unicast (une connexion dédiée unicast pour chaque client), et la multidiffusion

globale fournit bon nombre des mêmes avantages et des inconvénients que la radiodiffusion.

C. Les protocoles de streaming :

Pour résoudre le problème du retard dû à la bufferisation lors du streaming et adapter le

réseau Internet pour la transmission des flux multimédias, on utilise les protocoles du

streaming.

Protocoles standards

24

Protocole Description

http (Hyper Text Transfert

Protocol)

n'est pas à vrais dire un protocole de streaming. Comme il

traverse généralement les routeurs, il est utilisé pour

encapsuler de nombreux protocoles comme MMS ou

RTMP. C'est un protocole sans état.

RTSP (Real Time Streaming

Protocol)

est proche de HTTP et dispose de fonctions de contrôle

des flux : lecture, pause, avance rapide, retour rapide.

Unicast ou multicast, c'est un protocole à état.

RTP (Real-time Transport

Protocol)

est un protocole de transport en

temps réel.

Ces deux protocoles

sont indépendants

des couches réseau

et transport. En

pratique, ils sont

principalement

utilisés avec UDP,

en unicast et

multicast.

RTCP (RTP Control Protocol) se charge du contrôle de RTP

Tableau 3 : Les protocoles standards

Protocoles Propriétaires

Protocole Description

MMS (Microsoft Media

Service)

est un flux unicast sur les ports

1755 de TCP ou UDP

toujours utilisés

dans Windows

Media Services

2008

MMSH (Microsoft Media

Service over HTTP)

une version encapsulée de MMS

RTMP (Real-Time Messaging

Protocol)

est un protocole client-serveur unicast, sur le port 1935 de

la couche TCP. Il existe en version encapsulée dans

HTTP, ou cryptée, ou encore les deux à la fois. Il est

principalement utilisé avec FlashPlayer.

RTMFP (Real-Time Media

Flow Protocol)

est un protocole récent, apparu dans les applications

FlashPlayer10 et Air 1.5. Il fonctionne sur UDP, en

unicast. Le système pair-à-pair entre clients a été ajouté

pour diminuer la bande-passante du serveur. Ce protocole

supporte la mobilité, c'est-à-dire le changement à la volée

25

d'adresse IP.

RDT  (Real Data Transport) est un protocole développé par Real Networks. Il

fonctionne sur la couche UDP et les ports 34445 à 34459.

Il en est actuellement à la version 3.

Tableau 4 : Les protocoles propriétaires

Comme on peut le remarquer, la majorité des protocoles de streaming sont propriétaires. Dans

le paragraphe suivant nous allons essayer de présenter les inventaires des solutions de

streaming qui implémentent ces protocoles ainsi que les différentes solutions et infrastructures

qu’ils utilisent.

D. Inventaires des solutions de diffusion vidéo

L'éventail d'applications proposées pour capturer et diffuser des vidéos est aujourd'hui assez

vaste. Nous avons évalué des solutions phares du marché, en distinguant d'une part les

solutions de diffusion vidéo et de VOD proposées et d'autre part la solution de capture vidéo

associée, tout en écartant les logiciels tiers qui les intègrent.

Adobe - Flash Media Suite

La gamme Flash Media propose une suite de logiciels destinés à la diffusion. Elle se compose

à minima de deux logiciels simples d'utilisation :

Flash Media Streaming Server (FMSS):

Flash Media Streaming Server est un serveur de diffusion disponible sous Windows et Linux.

Il propose des fonctionnalités particulières telles que le cryptage, la gestion des droits de

lecture et de copie, une gestion automatique des débits. Il diffuse les formats F4V (Flash

Vidéo avec codec H264), FLV (Flash Video), MPEG-4, et 3GPP sur des protocoles

développés par Adobe, par exemple FLV sur RTMP, mais aussi des protocoles plus communs

tels que HTTP. Le Streaming Server implique l'installation d'un client Flash dans le

navigateur.

Flash Media Encoding Server (FMES):

26

Flash Media Encoding Server est une application disponible sous Windows destinée au ré-

encodage et au montage d'un ensemble de vidéos existantes vers les formats streamés par le

serveur de diffusion de la suite Flash Media. Il importe un grand nombre de conteneurs tels

que le FLV, le F4V, l'AVI, le WMV, l'ASF, le MPEG et le MOV. Il existe une

implémentation open-source de Flash Media Streaming Server : Red5.

QuickTime Streaming Server (QTSS) et Darwin Streaming Server (DSS)

Darwin Streaming Server est la version open-source du logiciel Quicktime Streaming Server

diffusé par Apple. QTSS est livré uniquement dans MacOS X serveur, tandis que DSS est

multi-plateforme (Linux, MacOS, Solaris, Windows). Ils diffusent les conteneurs suivants,

seulement s'ils sont optimisés (hinting) : QuickTime Movie (MOV), MPEG-4, et le 3GPP.

Les fonctionnalités sont nombreuses : diffusion, VOD unicast et multicast, IPv4 et IPv6.

RealProducer – Helix server

La société RealNetworks, pionnière dans la diffusion et la vidéo à la demande, propose des

solutions multiplateformes (Linux, Solaris, Windows) payantes ou gratuites, dont certaines

sont partiellement open source. Elles s'articulent autour des logiciels Helix DNA Producer

(Open source) et Real Producer pour la capture vidéo, puis Helix DNA Server (Open source)

et Helix Server pour la diffusion et la vidéo à la demande.

Windows Media Services

A l'instar de ses concurrents, la suite est composée de deux produits, Windows Media

Encoder, qui capture les sources audio et vidéo et Windows Media Services. Il s'installe en

tant que rôle sur les systèmes d'exploitation Windows Server. Seules les versions Entreprise

Server bénéficient de l'intégralité des fonctionnalités du produit, comme le multicast. Les

protocoles possibles sont RTSP, HTTP et IPv6 et les seules contraintes sont les formats

disponibles très réduits et majoritairement limités à ceux de Microsoft, tels que wmv, wma,

mp3 et le conteneur asf.

VLC

VideoLAN est un logiciel open-source multiplateformes de lecture, d'encodage, d'acquisition,

de diffusion en direct et à la demande. Il lit la plupart des formats, à l'exception notable de

Real Media, partiellement lu. Il implémente les protocoles standards de diffusion ainsi que le

27

multicast et IPv6. En plus de l'interface graphique, il est paramétrable via la ligne de

commande, une interface web ou telnet. VLC est « le couteau suisse » du multimédia.

III. Le cloud computing 

Le Cloud computing se traduit littéralement par "informatique dans les nuages", faisant

référence aux technologies d'internet qui est souvent représenté schématiquement par un

nuage. C'est un concept abstrait qui regroupe plusieurs technologies servant à délivrer des

services. Son but est de pousser les entreprises à externaliser les ressources numériques

qu'elles stockent. Ces ressources offrant des capacités de stockage et de calcul, des logiciels

de gestion de messagerie, et d'autres services sont mises à disposition par des sociétés tierces

et accessibles, grâce à un système d'identification, via un PC et une connexion à Internet.

A. Les services du cloud :

Selon le NIST (National Institute of Standards and Technology), il existe trois catégories de

services qui peuvent être offerts en cloud computing qui sont IaaS, PaaS et SaaS

IaaS (Infrastructure as a service): Il s’agit de la mise à disposition, à la

demande, de ressources d’infrastructures dont la plus grande partie est localisée

à distance dans des Datacenters. L’IaaS permet l’accès aux serveurs et à leurs

configurations pour les administrateurs de l’entreprise et donne au client la

possibilité de louer des clusters, de la mémoire ou du stockage de données.

PaaS (Platform as a service) : Dans ce type de service, situé juste au-dessus

du précédent, le système d'exploitation et les outils d'infrastructure sont sous la

responsabilité du fournisseur. Le consommateur a le contrôle sur les

applications et peut ajouter ses propres outils. En plus de pouvoir délivrer des

logiciels en mode SaaS, le PaaS dispose d'environnements spécialisés au

développement comprenant les langages, les outils et les modules nécessaires.

SaaS (Software as a service): Concept consistant à proposer un abonnement à

un logiciel plutôt que l'achat d'une licence. On oublie donc le modèle

client/serveur et aucune application n'est installée sur l'ordinateur, elles sont

directement utilisables via le navigateur Web. L’utilisation reste transparente

pour les utilisateurs, qui ne se soucient ni de la plateforme, ni du matériel, qui

sont mutualisés avec d’autres entreprises.

28

Avantages Inconvénient

SaaS Pas d’installation

Plus besoin de licence

Migration

Nombre logiciel limité

Sécurité

Dépendance des prestataires

Paas Pas d’infrastructures nécessaires

Pas d’installation

Environnement hétérogène

Limitation des langages

Pas de personnalisation dans

la configuration des machines

virtuelles

IaaS Administration

Personnalisation

Flexibilité d’utilisation

Sécurité

Besoin d’un administrateur

système

Tableau 5 : Avantages/Inconvénients des services du cloud

Figure 5 : Les service du cloud

B. Cloud computing et clusters :

Le principe du cloud computing est de construire un nuage de clusters, c'est à dire

d'interconnecter un ensemble de machines sur un réseau défini. Les utilisateurs peuvent

ensuite déployer des machines virtuelles dans ce nuage, ce qui leur permet d'utiliser un certain

nombre de ressources (espace disque, mémoire vive, ou encore du CPU).

29

Figure 6 : Composition du cloud

C. Avantages et inconvénients du cloud computing:

1. Avantage : Un démarrage rapide   : Le cloud computing permet de tester le business plan

rapidement, à couts réduits et avec facilité.

L’agilité pour l’entreprise   : Résolution des problèmes de gestion informatique

simplement sans avoir à être engager à long terme.

Un développement plus rapide des produits   : Permettant de réduire le temps de

recherche pour les développeurs sur le paramétrage des applications.

Absence de dépense de capital   : Plus besoin des locaux pour élargir les infrastructures

informatiques.

2. Inconvénients : La bande passante peut faire exploser votre budget   : La bande passante qui serait

nécessaire pour mettre cela dans le Cloud est gigantesque, et les coûts seraient

tellement importants qu'il est plus avantageux d'acheter le stockage nous-mêmes plutôt

que de payer quelqu'un d'autre pour s'en charger.

Les performances des applications peuvent être amoindries   : Un Cloud public

n'améliorera définitivement pas les performances des applications.

La fiabilité du Cloud   : Un grand risque lorsqu'on met une application qui donne des

avantages compétitifs ou qui contient des informations clients dans le Cloud.

Taille de l’entreprise   : Si votre entreprise est grande alors vos ressources sont grandes,

ce qui inclut une grande consommation du Cloud. Vous trouverez peut-être plus

30

d'intérêt à mettre au point votre propre Cloud plutôt que d'en utiliser un externalisé.

Les gains sont bien plus importants quand on passe d'une petite consommation de

ressources à une consommation plus importante.

D. Types de Cloud Computing :

Le concept de Cloud Computing est encore en évolution. On peut toutefois dénombrer trois

types de Cloud Computing :

Le Cloud privé (interne) : réseau informatique propriétaire ou un centre de données qui

fournit des services hébergés pour un nombre limité d’utilisateurs.

Le Cloud public (externe) : prestataire de services qui propose des services de stockage

et d’applications Web pour le grand public. Ces services peuvent être gratuits ou payants.

Exemples de clouds publics: Amazon Elastic Compute Cloud (EC2), Sun Cloud, IBM’s

Blue Cloud, Google AppEngine And Windows Azure Services Platform.

Le Cloud hybride (interne et externe) : un environnement composé de multiples

prestataires internes et externes. Ainsi les entreprises qui utilisent ce service peuvent faire

basculer, par un simple glisser-déposer, des applications hébergées dans un nuage privé

interne vers un nuage public sécurisé.

Figure 7 : Les types du cloud

31

E. La diffusion des vidéos à partir du cloud :

Pour comprendre l’utilité du cloud dans la diffusion des vidéos et audio, on doit mentionner

les 4 grands types de scénarios d’utilisation du cloud:

Actif puis Inactif   : Quand on a un service qui doit être actif pendant une durée

précise et inactif pour le reste du temps, l’investissement dans des infrastructures

physiques personnelles dans ce cas ne fait plus sens et le cloud intervient par la

location des ressources nécessaires pour la diffusion d’un évènement par

exemple mais après son achèvement, on va juste mettre en veille ces ressource

pour pouvoir les utiliser plus tard ;

Croissance rapide   : Si ce service peut avoir une croissance rapide importante et

dans le cas de l’infrastructure classique, il doit falloir racheter du matériel et être

capable de prévoir cette croissance pour pouvoir la gérer. Avec le cloud, si cette

croissance en terme de traitement de vidéos, on peut commencer doucement avec

un système capable d’encoder quelques vidéos par jour et augmenter sa capacité

de traitement progressivement au fur et à mesure que la charge augmente.

D’autre part, la croissance peut concerner le nombre d’utilisateur et dans ce cas

on peut facilement aligner le serveur de streaming.

Le débordement non prévisible   : Lorsqu’un grand nombre d’internautes se

connectent en même temps, on est devant un pic de consommation important et il

s’agit d’un phénomène qui n’était pas prévu. Avec le cloud, on peut facilement

gérer cette situation en rajoutant les ressources nécessaires pour retourner

rapidement à l’état de stabilité.

Les débordements prévisibles   : C’est plutôt d’un point de vue économique que

l’investissement dans une infrastructure qui va gérer uniquement les pics de

charges n’est pas une bonne idée. Avec le cloud, on peut louer les ressources

nécessaires pour essayer de lisser la courbe et ne payer qu’à l’usage ce qui

présente une solution beaucoup plus rentable.

32

Figure 8 : Les scénarios d’utilisation du cloud

Ainsi, plusieurs propriétaires ont proposé des services de médias et des solutions de diffusion

des vidéos à partir du cloud. Dans la partie qui suit nous détaillerons l’architecture et les

fonctionnalités de la plateforme Windows Azure qui est la solution choisie dans notre projet.

IV. Windows Azure

Windows Azure est le nom de la plateforme applicative en nuage de Microsoft. Il s'agit d'une

offre d'hébergement (applications et données) et de services (workflow, stockage et

synchronisation des données, bus de messages, contacts…). Un ensemble d'API permet

d'utiliser et d'accéder à cette plateforme et aux services associés.

La plateforme Windows Azure correspond aux offres d'informatique en cloud publics de

type PaaS et IaaS de Microsoft. Elle est composée de plusieurs éléments dont voici les plus

importants:

Compute   :

C’est la partie de la plateforme qui est en charge de l'exécution du code. Pour cela, le

développeur doit créer un ou plusieurs rôles, qui vont, selon les besoins, se comporter comme

un serveur IIS (Web Role), ou comme un service Windows (Worker Role).

Les sites web : C’est une reprise de l’infrastructure existante pour

l’hébergement des sites, mais élargie à d’autres solutions. On peut y déployer

(via FTP, WebDeploy, Git ou Team Foundation Services) des applications

Web en différents langages.

Les services de cloud computing : permettent de déployer et gérer rapidement

des applications et des services

33

Les machines virtuelles : elles présentent une offre Infrastructure as a Service

(IaaS) de Microsoft pour leur cloud public. Les clients peuvent créer des

machines virtuelles, dont ils ont le contrôle total, pour exécuter les Data

Centers Microsoft.

Les services mobiles: Ce service rationalise le processus de développement en

permettant d’exploiter le Cloud pour des scénarios courants d’applications

mobiles tels que le stockage structuré, l’authentification des utilisateurs et les

notifications push.

Data Services   :

Les data services offrent la possibilité de stocker, modifier et communiquer les données dans

Windows Azure.

Blobs: Les objets Blob constituent la manière la plus simple de stocker

d'importants volumes de données binaires ou de texte non structuré tels que des

fichiers vidéo ou audio et des images.

Tables: Les tables sont des conteneurs simples d’Azure qui, à l’instar d’un

tableau, permettent de stocker des informations structurées mais non

relationnelles.

SQL Database: c’est une base de données relationnelle complète en tant que

service qui offre un niveau d'interopérabilité élevé en permettant aux clients de

créer des applications à l'aide des principales infrastructures de développement.

Networking

Windows Azure Virtual Network: cette capacité permet aux développeurs de

gérer les réseaux privés virtuels (VPN). Ils pourront donc contrôler la topologie du

réseau, la configuration des adresses IP, les tables de routage, les politiques de

sécurité ou encore utiliser IPSEC.

App Services

Windows Azure Active Directory : annuaire pour la gestion des identités qui

peut être optionnellement lié à Windows Active Directory par réplication des

comptes utilisateurs. Il s'agit d'un service commun avec Office 365.

Access Control Services (ACS) : Cela permet typiquement à une application de

recevoir des authentifications venant de services comme Facebook, Google,

Windows Live, Yahoo ou tout autre service OpenID ou encore WS-Federation tel

qu'Active Directory (via Active Directory Federation Services ADFS V2).

34

Windows Azure Caching : cache distribué en mémoire vive, utilisable pour

stocker des objets sérialisables. Le cache distribué existe en tant que service prêt à

l'emploi, mais également depuis juin 2012 en tant que service que l'on peut

directement héberger dans les machines virtuelles (instances) des web roles et

worker roles.

Content Delivery Network (CDN) : permet aux clients de délivrer du contenu

plus proche de leurs utilisateurs finaux.

Storage Queues : qui sont une forme de MOM (Middleware Oriented Messages)

Service Bus: connectivité vers des Web Services qui ont une connexion sortante

vers Internet (et non entrante).

Media Services : Ces services permettent de Créer des workflows pour la création, la gestion et la distribution des données multimédias.

V. Windows Azure Media Services

Service de média de Windows Azure offre une plateforme multimédia de cloud extensible qui

permet aux développeurs de créer des solutions pour la réception, le traitement, la gestion et la

transmission des contenus multimédias. Service de média est basé sur l’infrastructure de

Windows Azure (pour fournir le traitement multimédia et le stockage des éléments

multimédias) et IIS Media Services (pour assurer la transmission du contenu)

Architecture

L’architecture de Service de média inclut plusieurs composants clés dans la perspective du

développement d’applications. Le diagramme suivant illustre les couches de Service de

média.

Figure 9 : Architecture Windows Azure Media Services

35

Flux de travail d’une application Media Services

Il existe quatre types basiques d’opérations pour l’utilisation des éléments multimédia. Celles-

ci constituent le flux de travail d’application. Service de média fournit une prise en charge

complète pour chaque opération dans ce flux de travail.

Réception: Les opérations de réception transfèrent les éléments multimédias

au système. Cela inclut le chargement du contenu multimédia et le chiffrement

des éléments multimédias pour protéger leur contenu.

Traitement: Les opérations de traitement impliquent l’encodage, la

conversion et la génération des éléments multimédias.

Gestion: Les opérations de gestion impliquent l’utilisation des éléments

multimédias déjà inclus dans Service de média. Cela inclut le listing et le

balisage, la suppression et la modification des éléments multimédias, la gestion

des clés DRM et la vérification des rapports d’utilisation des comptes.

Transmission: Les opérations de transmission permettent de diffuser le

contenu multimédia à partir de Service de média. Cela comprend la diffusion

en continu de contenu en direct ou à la demande auprès des clients et la

récupération ou le téléchargement des fichiers multimédias spécifiques à partir

du Cloud.

Les étapes de création d’un service média sur Windows Azure

Création d’un service de stockage : Le service de stockage sera utilisé pour stocker

les fichiers qui vont être utilisés par le service media. Windows Azure nous donne

la possibilité de choisir le groupe d’emplacement, il est recommandé de choisir

celui le plus proche de la majorité des utilisateurs.

36

Figure 10 : Création de compte de stockage

Création service média : Lors de la création de ce service, il faut choisir le compte

de stockage à lier et la région où nous voulons l’installer, de préférence il faut

choisir la même région du service de stockage pour minimiser le trafic et le temps

de transfert entre les deux services.

Figure 11 : Création service média

37

Quelques captures :

Après la création du service média, en entrant à la page «mettre à l’échelle », on peut réserver des capacités (Streaming en-demande et Encodage).

Figure 12 : Réservation des capacités

Le téléchargement des vidéos à utiliser par le service média peut s’effectuer de deux manières, à partir du système local (ordinateur personnel) ou à partir d’un autre compte de stockage.

Figure 13 : Téléchargement des vidéos

38

La figure suivante montre les opérations qu’on peut effectuer sur une vidéo.

Figure 14 : Les opérations à effectuer sur une vidéo

Afin d’adapter une vidéo à un type de streaming spécifique, nous pouvons l’encoder en choisissant un des plusieurs préréglages disponibles.

Figure 15 : Encodage

39

Le service média de Windows azure offre des graphes pour les statistiques de l’utilisation du service ainsi que l’historique d’occupation de la bande passante.

Figure 16 : Tableau de bord du service média

Ce chapitre nous a permis de mieux comprendre plusieurs notions et concepts dont on aura

besoin pour la réalisation de notre projet. Dans ce qui suit nous irons plus loin, par une

description détaillée de l’application par l’analyse et la spécification des besoins.

40

CHAPITRE3 : Analyse et spécification des besoins

CHAPITRE 3 : Analyse et spécification des besoins

Dans tout système, les fonctionnalités doivent être mises en relation avec un ensemble de

besoins utilisateurs. Ces besoins définissent les services que les utilisateurs s’attendent à voir

fournis par le système. Nous allons commencer dans ce chapitre par la définition des besoins

fonctionnels et non fonctionnels. Puis, à partir de cette spécification, nous allons identifier les

acteurs ainsi que les cas d’utilisations de notre application.

I. Etude de l’existant

Partant du cas de projet Malisseonline, un portail d'informations tunisien spécialisé dans

l'actualité High Tech aussi bien nationale qu’internationale lancé par le journaliste de la radio

Mosaïque FM Mohamed Ali Souissi en partenariat avec THD (Tunisie Haut débit), et après

une réunion avec Welid Neffeti, Journaliste/Manager à THD, nous avons su tirer profit de leur

expérience pour analyser l’existant en terme de la création des plateformes de diffusion vidéo

en Tunisie.

Le processus de la création commence toujours par le choix de la solution la plus simple et

qui offre le maximum d’avantages tout en minimisant le coût. Ainsi, on se penche vers les

sites communautaires comme Youtube pour créer ses propres programmes de diffusion. Cette

solution apporte plusieurs avantages pour les entreprises qui décident de communiquer

dessus. Les entreprises peuvent y adapter leur stratégie de communication et profitent de son

audience évaluée à plus 150 millions de visiteurs par mois. Cependant, ce type de solutions

présente des inconvénients en termes de personnalisation du lecteur pour gérer leurs propres

annonces et break news, ainsi que des problèmes d’intégration du lecteur dans leurs propres

environnements pour éviter les suggestions en provenance de l’extérieur.

II. Spécification des besoins

A. Les besoins fonctionnels :

La capture des besoins fonctionnels est une étape importante du projet. Cette étape produit le

dossier des spécifications fonctionnelles et c’est au cours de cette étape qu’on procède à la

42

formalisation des fonctionnalités attendues de notre système ainsi que toutes les règles de

gestion qui les régissent.

Dans cette partie, nous identifions les besoins fonctionnels qui expriment les actions que le

système doit effectuer.

Notre système réalise les tâches suivantes :

Montage des vidéos :

L’administrateur doit avoir la possibilité de monter une liste de vidéos afin de créer un

programme de diffusion spécifique. Ce besoin englobe un ensemble de tâches lui permettant

de choisir une liste de vidéos à partir de la bibliothèque et modifier chaque vidéo à part en

coupant des morceaux et en ajoutant des textes ou des images animées à différents instants.

Consultation de l’historique :

Afin de pouvoir consulter les programmes déjà créés, notre application permet

l’enregistrement dans l’espace de stockage du serveur web des fichiers xml qui contiennent

les listes de diffusion. L’utilisateur peut ainsi voir l’historique à partir de l’interface publique.

III. Diagramme de cas d’utilisation

A. Cas d’utilisation global :

Les cas d’utilisation permettent de décrire sous forme d’actions et de réactions le système du

point de vue utilisateur. Ils donnent l’image d’une fonctionnalité du système déclenchée par

une simulation d’acteur externe. Ils permettent de spécifier clairement et exhaustivement les

besoins relatives à chaque type d’utilisateur.

Pour cela, on a utilisé les diagrammes des « cas d’utilisation » pour illustrer les

fonctionnalités  du système.

43

Figure 17 : Cas d'utilisation global

B. Description textuelle des cas d’utilisation

Cas d’utilisation « Authentification »

Titre Authentification

But S’authentifier pour accéder à la partie d’administration de

l’application

Séquences principales L’administrateur demande à s’authentifier,

Le système affiche la page d’authentification,

L’administrateur saisit son nom d’utilisateur et son mot de passe et

valide,

Le système valide les informations d’authentification par rapport à

celles qu’il a mémorisées,

Le système ramène l’administrateur à la page d’administration.

Séquences

alternatives

Lorsque l’administrateur fournit un nom d’utilisateur ou un mot de

passe inconnu, le système affiche un message d’erreur et propose à

l’utilisateur de s’authentifier une autre fois.

Tableau 6 : Description de cas d'utilisation "Athentification"

44

Cas d’utilisation « Créer programme»

Titre Créer programme

But Faire le montage d’une liste de vidéos afin de créer un programme

Pré condition Une authentification réussie en tant qu’administrateur

Séquences principales L’administrateur sélectionne une liste de vidéos ou audios à partir de

la bibliothèque,

Le système affiche la liste choisie,

L’administrateur peut ainsi choisir d’éditer chaque vidéo de la liste à

part en ajoutant du texte animé ce qui provoque le déclenchement de

l’UC « Insérer animation » ou en tranchant un morceau de la vidéo

ce qui fait appel à l’UC «Découper vidéo »,

L’administrateur confirme son programme,

Le système génère les fichiers nécessaires et déclenche l’UC

« Regarder le programme ».

Séquences

alternatives

A tout moment, l’administrateur peut annuler les modifications

apportées à la liste des vidéos.

Tableau 7 : Description de cas d'utilisation "Créer programme"

Cas d’utilisation «Insérer animation »

Titre Insérer animation

But Ajouter un texte animé à des instants précis de la vidéo

Pré condition Vidéo déjà ajoutée à la playlist

Séquences principales L’administrateur demande l’ajout des textes animés à une vidéo,

Le système affiche un formulaire pour l’ajout des textes ,

L’administrateur saisit le texte à animer, précise les instants de début

et de fin, choisit une animation spécifique et valide ses

modifications,

Le système cache le formulaire et enregistre les modifications.

Tableau 8 : Description de cas d'utilisation "Insérer animation"

Cas d’utilisation «Découper Vidéo»

Titre Découper vidéo

45

But Trancher un morceau de la vidéo

Pré condition Vidéo déjà ajoutée à la playlist

Séquences principales L’administrateur demande le découpage d’une partie de la vidéo,

Le système affiche un formulaire pour le découpage,

L’administrateur précise les instants de début et de fin et valide,

Le système cache le formulaire et enregistre les modifications.

Tableau 9 : Description de cas d'utilisation "Découper video"

IV. Technologies utilisées : HTML5 :

Est la dernière version en date du langage de développement web HTML. Les

spécifications définitives du HTML5 n’étaient pas encore fixées, il comprend

de nouvelles balises et de nouveaux attributs pour les pages web et ouvre surtout

de nouvelles possibilités de développement pour les sites mobiles.

Ce que nous a attirer vers HTML5 c’est qu’il offre un moyen standard de lecture du média,

une clé tirent profit car il n'a pas de norme pour la lecture du média dans une page Web sans

un plug-in de navigateur et aucune garantie que chaque navigateur prendrait en charge le

plug-in.

CSS 3 :

CSS se traduit en français « feuilles de style en cascade ». On l’utilise le langage

pour décrire la présentation d’un document écrit HTML ou XML. La CSS décrit

les couleurs, la police…

La CSS permet de rendre un document plus agréable à lire, mieux présenté… La CSS a donc

pour rôle d’améliorer la mise en page, de séparer la structure de sa présentation et d’améliorer

l’accessibilité des pages web.

Le troisième niveau des feuilles de style en cascade CSS3 comporte plusieurs nouvelles

propriétés graphiques (nouveau support des polices, saturation, luminosité, opacité, ombres,

bordures arrondis, transition, animations…)

JavaScript :

46

JavaScript est un langage de programmation de scripts principalement utilisé pour les pages

web interactives. C'est une extension du langage HTML qui est incluse dans le code. Ce

langage est un langage de programmation qui permet d'apporter des améliorations au langage

HTML en permettant d'exécuter des commandes.

Ce code est directement écrit dans la page HTML, c'est un langage peu évolué qui ne permet

aucune confidentialité au niveau des codes.

AJAX :

AJAX est une maniére de construire des applications Web et des sites dynamiques basés sur

diverses technologies Web ajoutées aux navigateurs dans les années 1990. AJAX est la

combinaison de technologies telles que Javascript, CSS, XML, le DOM et le

XMLHttpRequest dans le but de réaliser des applications Web qui offrent une maniabilité et

un confort d’utilisation supérieur à ce qui se fait jusqu’alors.

Les applications AJAX fonctionnent sur tous les navigateurs Web qui mettent en œuvre les

technologies décrites précédemment, parmi lesquels Mozilla Firefox, Internet Explorer,

Konqueror, Google Chrome, Safari et Opera.

XML :

XML (entendez eXtensible Markup Language et traduisez Langage à balises étendu, ou

Langage à balises extensible) est en quelque sorte un langage HTML amélioré permettant de

définir de nouvelles balises. Il s'agit effectivement d'un langage permettant de mettre en forme

des documents grâce à des balises (markup).

Contrairement à HTML, qui est à considérer comme un langage défini et figé (avec un

nombre de balises limité), XML peut être considéré comme un métalangage permettant de

définir d'autres langages.

La force de XML réside dans sa capacité à pouvoir décrire n'importe quel domaine de

données grâce à son extensibilité. Il va permettre de structurer, poser le vocabulaire et la

syntaxe des données qu'il va contenir. XML a été mis au point par le XML Working Group

sous l'égide du World Wide Web Consortium (W3C) dès 1996.

47

PHP5 :

PHP est un langage de scripts libre principalement utilisé pour produire des

pages Web dynamiques via un serveur http, mais pouvant également fonctionner comme

n’importe quel langage interprété de façon locale, en exécutant les programmes en ligne de

commande. En raison de la richesse de sa bibliothèque, on désigne parfois PHP comme une

plate-forme plus qu’un simple langage.

jQuery :

jQuery est une bibliothèque JavaScript libre qui porte sur l’interaction

entre JavaScript(comprenant AJAX) et HTML, et a pour but de simplifier des commandes

communes de JavaScript. La première version date de janvier 2006.

Popcorn :

Popcorn.js est un Framework HTML5 de media écrit en JavaScript pour les

créateurs des vidéos animés, les développeurs Web et n’importe qui veut créer

des medias interactives sur le Web basée sur le temps. Popcorn.js fait partie du projet Popcorn

de Mozilla.

Textillate :

Textillate.js est une bibliothèque riche écrite en JavaScript qui donne la possibilité d’effectuer

des animations sur les textes, elle est basée sur « animate.css » qui définie jusqu’à 50

animations différentes et « lettering.js » qui permet de découper le texte en lettre et animer

chacune à part.

OSM Player :

« Open Standard Media Player » est un lecteur multimédia HTML5 pour le Web, open source

(GPL), il est cent pour cent basé sur les standards Web et complètement personnalisable.

SGBD : MySQL

MySQL est un système de gestion de base de données de type SQL. Il est

devenu le SGBD open source le plus populaire au monde grâce à sa

performance, sa haute fiabilité et sa simplicité d’utilisation.

48

Au cours de ce chapitre, nous avons détaillé l’analyse de notre projet. Elle est composée de

deux parties parallèles : l’étude fonctionnelle et l’étude technique du projet. Dans l’étude

fonctionnelle du projet consiste à capturer les besoins fonctionnels en termes d’acteurs et de

fonctionnalités principales, raffinée ensuite en des spécifications fonctionnelles et modélisée

en diagrammes de cas d’utilisation. L’étude technique du projet a présenté l’architecture

logicielle et les technologies utilisées durant la réalisation de notre projet. Dans le chapitre qui

suit, nous présentant l’étape de conception du système.

49

CHAPITRE4 : Conception de l’application

CHAPITRE 4 : Conception de l’application

La conception est la phase la plus importante dans le cycle de développement d’un projet. Elle

permet de mettre en place un modèle sur lequel nous allons nous appuyer pour

l’implémentation du système. Nous allons suivre une démarche centré sur les cas d’utilisation

déjà présentés dans le chapitre analyse et spécification des besoins. Cette démarche consiste à

identifier les objets du système. Ces objets nécessitent la définition des classent. Ainsi nous

allons élaborer le diagramme de classe du système pour décrire sa vue statique. Puis nous

allons décrire la vue dynamique par les diagrammes de séquences.

I. Diagramme d’activité :Les diagrammes d’activités sont la représentation proche de l’organigramme ; la description

d’un cas d’utilisation par un diagramme d’activités correspond à sa traduction algorithmique.

Une activité est l’exécution d’une partie du cas d’utilisation. Dans la suite nous présentons le

diagramme d’activité d’administration.

Figure 18 : Diagramme d'activité

51

II. Diagrammes de séquences :Les diagrammes de séquences sont la présentation graphique des interactions entre les acteurs

et le système selon un ordre chronologique dans la formulation UML. Dans la suite, nous

présentons quelques diagrammes de séquence de notre système.

A. Administrateur :

Scénario d’authentification :

L’authentification doit être effectuée avant chaque création du programme de diffusion ou

ajout des news. L’administrateur fournit au système son identifiant et son mot de passe, le

système consulte la base de données pour s’assurer de l’identité de la personne et ouvre une

session, une fois que l’authentification est réussie.

Figure 19 : Diagramme de séquences (Authentification)

Scénario de création d’un programme de diffusion :

Après son authentification, l’administrateur sélectionne une liste de vidéos à partir de la

bibliothèque afin de créer son programme en les plaçant dans un ordre chronologique, puis

pour chacune, il peut la découper ou insérer des textes animés à des temps bien précis et

pendant des durées bien déterminées. Et enfin, l’administrateur visualise le programme créé.

52

Figure 20 : Diagramme de séquences (Création programme)

B. Utilisateurs :

Scénario de visualisation du programme:

Après son accès au site, lorsque l’utilisateur choisis de regarder le programme courant, il

envoie une requête au service streaming et ce dernier demande les fichiers de service

stockage, et enfin il envoie le flux des vidéos à l’écran de l’utilisateur.

Figure 21 : Diagramme de séquences (Visualiser programme)

53

III. Diagramme de classes :Les diagrammes de classes expriment de manière générale la structure statique d’un système

en termes de classes et de relations entre ces classes. Une classe permet de décrire un

ensemble d’objets (attributs et comportements), tandis qu’une relation permet de faire

apparaître des liens entre ces objets. La classe peut être vue comme la factorisation des

éléments communs à un ensemble d’objets.

En se basant sur ce qui précède, une solution conforme aux besoins exprimés et aux objectifs

déjà fixés se résume dans un diagramme composé des classes suivantes :

Figure 22 : Diagramme de classes

Dans ce que suit, nous procédons à la description de ces différentes classes :

Administrateur : Cette classe contient les informations d’authentification des administrateurs

ainsi que les opérations qu’ils peuvent effectuer.

Programme : C’est une classe qui contient les programmes créés et leurs informations et elle

est composée des montages et des playlists.

54

Utilisateur : Représente les opérations que les utilisateurs du site peuvent effectuer. Il regarde

des programmes et des vidéos.

Media : Une classe regroupant les audio et les vidéos, ajouté par un administrateur et peut

être partie d’un programme.

IV. Modèle de données :

Figure 23 : Modèle de données

Dans notre plateforme, on utilise quatre fichiers XML : un pour stocker les informations des

médias, deux pour le montage des vidéos et la création des programmes de diffusion et un

autre pour sauvegarder l’historique des programmes :

data_base.xml : présente l’ensemble des médias dans notre espace de stockage et

permet de les organiser selon leurs types. Sous la balise <library> qui est la balise root

on trouve 3 types de balises <mp4>, <mp3> ou <img> présentant le type du média et

comportant plusieurs éléments pour sa description. <mp4> caractérisé par un attribut

id <mp4 id= ‘’ ‘’>et constitué de 5 balises : <titre>, <duree>, <description>, <path> et

<poster> alors que <mp3> comporte 4 balises : <titre>, <duree>, <path> et <poster>

et pour la balise <img> on trouve les balises <titre>, <description> et <path> ;

55

Figure 24 : data_base.xml

playlist.xml : ce fichier permet de créer une liste de médias spécifique pour un

programme de diffusion. Il est composé d’un ensemble de balises permettant

l’identification des différents médias constitutifs du programme et la description de

leur enchainement au cours du temps. On distingue ainsi la balise root <playlist> avec

<trackList> qui décrit un programme. <trackList> contient plusieurs balises de type

<track>, chacune de ses balises présente un média de type vidéo ou audio caractérisé

par un titre <title>, un path <location> qui présente le chemin pour y accéder et une

image<image> qui s’affiche sur le lecteur avant que la lecture commence ;

Figure 25 : playlist.xml

montage.xml : permet de décrire un ensemble d’animations de textes et d’images

associées aux vidéos du programme de diffusion. L’ensemble des éléments peut être

organisé comme suit : La balise <montage> est la balise root, elle est constituée d’un

ensemble de balises <video> chacune doit comporter une balise <id> permettant de

l’identifier et peut avoir soit la balise <texte> qui présente une animation du texte sur

56

la vidéo soit la balise <image> avec laquelle on peut animer une image. La balise

<texte> elle-même est définie par un instant de départ en secondes <start>, un instant

de fin <end>, un contenu texte <contenu> animé avec un type d’animation spécifique

<animation_txt> et une couleur <couleur>. L’image aussi est identifiée par un temps

de départ et de fin <start> et <end> ainsi qu’un emplacement <path> et une animation

<animation_img> ;

Figure 26 : montage.xml

programme.xml : Permet de stocker les programmes déjà réalisé par l’administrateur,

pour chaque programme il existe une balise <programme></programme> qui a un

attribut « titre » et contient la date de création <date></date>, la liste des vidéos

<playlist></playlist> et le montage <montage></montaget>.

57

Figure 27 : programme.xml

Dans ce chapitre, nous avons conçu notre application en utilisant le diagramme de classes et

le diagramme de séquences de langage UML. Ainsi nous avons passé d’un modèle métier (cas

d’utilisation), décrivant d’une maniére générale les fonctionnalités du systéme, à un modèle

de classe feront l’objet des tables de base de données ou les fichiers XML selon l’utilisation.

58

CHAPITRE5 : Réalisation

Chapitre5 : Réalisation

CHAPITRE 5 : Réalisation

Une des étapes de la vie d’un projet, aussi importante que la conception, est l’implémentation.

Cette étape constitue la phase d’achèvement et d’aboutissement du projet. Pour remplir cette

tâche avec succès il fut savoir utiliser les outils adéquats et nécessaires. Ce choix d’outils peut

influencer sur la qualité du produit obtenu et donc nécessite une attention particulière et doit

se baser sur les besoin du projet et le résultat escompté. Ce chapitre présente alors

l’environnement technique du travail ainsi que le choix pris en matière d’environnement

logiciel. Par la suite nous présentons les interfaces de notre solution.

I. Environnement de développement :Dans cette partie nous nous intéressons à l’étude de l’environnement technique disponible

pour la réalisation de notre projet ensuite nous justifions les choix pris en matière

d’environnement logiciel pour mener à terme la partie applicative.

A. Environnement matériel :

Nous disposons de deux ordinateurs portables :

Intel Pentium, 2.2GHz avec 2Go de RAM (OS : Windows 7)

Intel Core2 Duo 2GHz avec 2Go de RAM (OS : Windows 7)

B. Environnement logiciel :

Entreprise Architect   Enterprise Architect est un outil

d'analyse et de création UML, couvrant le développement de

logiciels du rassemblement d'exigences, en passant par les étapes d'analyse, les

modèles de conception et les étapes de test et d'entretien. Cet outil graphique basé sur

Windows, peut être utilisé par plusieurs personnes et conçu pour vous aider à

construire des logiciels faciles à mettre à jour. Il comprend un outil de production de

documentation souple et de haute qualité.

C. Environnement de programmation :

Les différents outils utilisés dans cette phase de réalisation sont les suivants :

60

Chapitre5 : Réalisation

Dreamweaver est un éditeur WYSIWYG destiné à la conception, au

codage et au développement de sites, de page et d’application Web.

Dreamweaver propose des outils qui vous aideront à créer des

applications Web. Ce logiciel est édité par Adobe Systems. Les

fonctions d’édition visuelle de Dreamweaver vous permettent de créer rapidement des

pages sans rédiger un seule ligne de code. Si vous préférez faire appel au codage

manuel, Dreamweaver intègre également de nombreux outils et fonctions de codage.

Avec Dreamweaver, vous pouvez créer des applications Web dynamiques reposant sur

des bases de données à l’aide de language serveur tels qu’ASP, JSP et PHP.

WampServer est une plateforme de développement Web de type

WAMP, permettant de faire fonctionner localement (sans se connecter à

un serveur externe) des scripts PHP. WampServer n’est en soi un

logiciel, mais un environnement comprenant deux serveurs (Apache et MySQL), un

interpréteur de script(PHP), ainsi que phpMyAdmin pour l’administration Web des

bases MySQL.

Il dispose d’une interface d’administration permettant de gérer et d’administrer ses

serveurs au travers d’un tray icon(icône près de l’horloge windows).

La grande nouveauté de WampServer 2 réside dans la possibilité d’y installer et

d’utiliser n’importe quelle version de PHP, Apache ou MySQLen un clic. Ainsi,

chaque développeur peut reproduire fidèlement son serveur de production sur sa

machine locale.

Figure 28 : Architecture WAMP Server

61

Chapitre5 : Réalisation

W3C markup validation service   : est le seul outil véritablement

fiable pour vérifier la syntaxe du code HTML est le service de

validation du W3C accessible à l’adresse : http://validator.w3.org/

Pour utiliser ce service, il suffit :

de saisir l’adresse de la page à contrôler

d’envoyer le fichier

ou bien de copier directement le code HTML à valider dans le champ prévu à

cet effet.

En déroulant les options, il est possible de préciser le type du document, et d’en

afficher le code source. Cette dernière option est notamment très utile pour savoir où

se situe l’erreur à corriger. 

Lors de la correction, “commencez par le début” et pensez à revalider régulièrement le

document car certaines erreurs en cachent d’autres et à l’inverse certaines erreurs

entraînent de faux positifs. 

CSS Validation Service : est l’outil de validation des feuilles de style CSS de W3C accessible à l’adresse : http://jigsaw.w3.org/ Tout comme pour le validateur HTML, pour utiliser ce service, il suffit : de saisir l’adresse de la page à contrôler

d’envoyer le fichier

ou bien de copier directement le code CSS à valider dans le champ prévu à cet

effet.

62

Chapitre5 : Réalisation

II. Architecture du système :

Figure 29 : Architecture du système

III. Test :Afin d’assurer la qualité de notre travail, on a élaboré une suite de test unitaires et

d’intégration. Ceci dans le but d’assurer le bon fonctionnement de l’application et isoler les

dysfonctionnements pour les corriger tôt dans le processus de réalisation.

Afin de réaliser les tests unitaires d’une façon efficace et industrialisée, on a utilisé les outils

de validation de W3C. Les test d’intégration sont des test qui simulent l’interaction avec un

environnement physique réel. Ils veillent à l’exécution d’un scénario, ce qui garantit que

l’interaction avec l’application se fait comme prévu.

IV. Les IHM de l’application :

A. Front office:

63

Chapitre5 : Réalisation

Figure 30 : Composition de la page publique

En-tête   : est l’en-tête de notre site, elle contient le logo et le nom de la

société.

Figure 31 : En-tête

Lecteur HTML5   : est l’emplacement où les internautes vont regarder le

programme et les vidéos sélectionnés de la vidéothèque.

Figure 32 : Lecteur HTML5

Playlist   : Contient la liste des vidéos du programme en cours.

64

Chapitre5 : Réalisation

Figure 33 : Playlist

Bonnes nouvelle   : Cette partie de la page contient des infos roulantes

verticalement et mise à jour régulièrement par l’administrateur.

Figure 34 : Bonnes nouvelles

Vidéothèque   : Toutes les vidéos que l’administrateur a déjà utilisées dans

les programmes sont chargés automatiquement dans cette partie en les

classant par thèmes (Nouvelles Technologies, formations et vidéos divers).

Figure 35 : Vidéothèque

65

Chapitre5 : Réalisation

Historique programmes   : Tous les programmes déjà créé par

l’administrateur se trouvent dans ce block, il suffit de cliquer sur un pour le

regarder.

B. Back office :

Figure 36 : Composition de la page d'administration

Bibliothèque des medias   : Contient tout les fichiers multimédia que

l’administrateur à téléchargé sur le site, ils sont classés par types (Vidéos,

musique, images, PDFs). Ils sont utilisés pour créer des nouveaux

programmes.

Figure 37 : Bibliothèque

Montage & News   : Cette partie contient deux onglets chacun contenant une

interface, une pour la création du playlist et l’autre pour l’insertion des

breaking news.

66

Chapitre5 : Réalisation

Figure 38 : Partie montage

Figure 39 : Insertion news

Ajout texte animé   : formulaire pour l’ajout d’un texte animé à un instant et

une durée bien déterminés.

Figure 40 : Formulaire ajout texte animé

67

Chapitre5 : Réalisation

Dans ce chapitre nous avons présenté l’environnement de développement (matériel et logiciel)

ainsi que les Framework utilisés pour le développement de notre application. Nous avons

ensuite décrit le travail réalisé, et enfin, nous avons présenté quelques interfaces de

l’application.

68

69

Conclusion générale

Conclusion générale

Au terme de ce modeste projet de fin d’études consacré à la mise en place d’une application

Web TV pour la société CIC en se basant sur les standards du Web. Nous espérons avoir

apporté les éléments qui répondent aux attentes de l’entreprise d’accueil et lui avoir fourni

une solution convenable et adéquate qui va lui permettre de bénéficier d’une rapidité et

efficacité de création des programmes et leur diffusion.

Nous commençons notre mémoire par une présentation générale du projet et de son cadre.

Ensuite, nous raffinons cette présentation par une analyse et spécification détaillées. Puis par

le moyen des diagrammes UML, nous concevons les composants de l’application. Enfin, en

se basant sur les éléments définis auparavant et leurs description, nous réalisons notre

application Web, qui repose sur un ensemble de nouveaux concepts (HTML5, CSS3, Cloud

Computing) et différents Framework (textillate, popcorn) qui nous ont facilité le

développement. Cependant ces nouveaux concepts et ces Frameworks ont nécessité un temps

et un effort importants pour les comprendre et pour apprendre à les utiliser.

Ce projet nous était une expérience humaine et professionnelle enrichissante dans le domaine

de développement qui nous a permis de voir de plus prés le domaine de travail et de bien

utiliser les connaissances requises à l’ISI.

L’application que nous développons satisfait les besoins actuels de CIC, mais elle est ouverte

aux améliorations et enrichissements tel que l’utilisation du SDK de Windows azure ce qui

permet à l’administrateur de l’application de configurer et gérer les ressources du Cloud sans

avoir recours à l’espace d’administration Windows azure, et d’autre part, on peut ajouter

70

Annexes

Annexe A : Développement des applications Windows Azure Media Services

Pour le développement des applications basées sur Service de média de Windows Azure, deux approches principales peuvent être appliquées :

Utiliser un Kit de développement logiciel (SDK) de Service de média de Windows Azure pour .NET, PHP ou Java.

Effectuer des appels directs de l’API REST en utilisant OData et l’API REST de Service de média, plutôt qu’un Kit de développement logiciel (SDK) ou des langages de programmation en dehors de .NET Framework.

Dans cette partie, nous allons essayer de présenter les bases du développement des applications basées sur les services médias de Windows azure par l’API REST en premier lieu et par le SDK pour PHP en deuxième lieu.

API REST

Construction des requêtes

Le service de média de Windows Azure accepte les requêtes HTTP OData et peut répondre au format JSON détaillé ou atom+pub. Chaque client doit utiliser un ensemble d’en-têtes HTTP requis dans le cadre de la connexion à Service de média, ainsi qu’un ensemble d’en-têtes facultatifs.

En-têtes de requête HTTP standard

En-tête Type ValeurAutorisation Support Le support est le seul mécanisme d’autorisation

accepté. La valeur doit également inclure le jeton d’accès fourni par les services de contrôle d’accès.

x-ms-version Décimal 2.1DataServiceVersion Décimal 3.0MaxDataServiceVersion

Décimal 3.0

Tableau 10 : Les en-têtes de requête http standard

Fonctions HTTP standards

Verbe DescriptionGET Renvoie la valeur actuelle d’un objet.

72

POST Crée un objet sur la base des données fournies ou envoie une commande.PUT Remplace un objet ou crée un objet nommé (le cas échéant).DELETE

Supprime un objet.

MERGE Met à jour un objet existant avec les modifications apportées aux propriétés nommées.

HEAD Renvoie les métadonnées d’un objet pour une réponse GET.Tableau 11 : Les fonctions http standards

Identification des entités Windows Azure Media Services

Service de média de Windows Azure utilise une structure d’attribution de noms spécifique pour identifier les ressources dans l’espace de stockage des métadonnées de contenu de Service de média.

La structure de base pour un ID Service de média (nb:type:schéma:SSID) est définie comme suit :

type      est le type de l’identificateur de contenu. schéma      est un schéma d’affectation de nom reconnu par Service de média. SSID    (ID spécifique du schéma) est une chaîne qui correspond aux ID dans le schéma.

Et voici une liste des principales entités du service médias :

Entité DescriptionAssets Un élément multimédia est une entité virtuelle qui contient des

métadonnées sur un média. Il contient un ou plusieurs fichiers.Files Un fichier est un objet blob vidéo ou audio réel sur le système de fichiers

ou sur un serveur distant. Un fichier est toujours associé à un élément multimédia, lequel peut contenir un ou plusieurs fichiers faisant partie d’une collection.

Jobs Un travail est une entité qui contient des métadonnées sur des tâches. Les tâches effectuent des opérations sur des éléments multimédias et des fichiers. Un travail peut créer des éléments multimédias ou des fichiers. Un travail est toujours associé à une ou plusieurs tâches.

Tasks Une tâche est une opération individuelle de travail sur un élément multimédia ou un fichier. Une tâche est associée à un travail.

Access Policies Une stratégie d’accès définit les autorisations pour un fichier ou un élément multimédia (type d’accès et durée).

Locators Un localisateur est un URI qui fournit un accès temporaire à un élément multimédia spécifique.

ContentKeys Une clé de contenu stocke les données de clé utilisées pour chiffrer un élément multimédia.

Tableau 12 : Les principales entités du service média

73

Connexion à Media Services

Deux éléments sont prérequis pour accéder à Service de média de Windows Azure :

un jeton d’accès : récupéré auprès des services de contrôle d’accès et utilisé lors de chaque requête HTTP effectuée auprès du service. Ce jeton est semblable aux autres jetons fournis par les services de contrôle d’accès sur la base des revendications d’accès incluses dans l’en-tête d’une requête HTTP et à l’aide du protocole OAuth v2. Aucune autre condition préalable n’est requise avant la connexion directe à Service de média.

l’URI de Service de média lui-même : L’URI racine pour Media Services est https://media.windows.net/. On doit se connecter à cet URI et si on reçoit une redirection 301 en réponse, on doit effectuer les appels suivants auprès du nouvel URI. L’URI racine pour le chargement et le téléchargement des fichiers d’éléments multimédias est https://votre_compte_de_stockage.blob.core.windows.net/ où le nom du compte de stockage correspond à celui qu’on a utilisé lors de la configuration du compte.

Après l’identification des entités de programmation et la connexion aux services de médias, il est possible de commencer le développement. Ainsi, on peut créer, recevoir, traiter, gérer ou fournir ces éléments avec l’API REST.

Le SDK de Media Services pour PHP

Un SDK peut fournir un ensemble d'outils, des classes d'assistance (par exemple, un code supplémentaire qui simplifie l'accès à un API) et des exemples de code pour aider les utilisateurs à développer et utiliser l'API REST.

Figure 41 : Les couches de développement sur Windows Azure

Le SDK des services médias pour PHP présente un ensemble de classes et de fonctions permettant :

La création d’un asset Le téléchargement d’un contenu vers l’asset Le téléchargement d’un contenu de taille supérieure à 64 MB vers l’asset Le contrôle du téléchargement HTML5 asynchrone Le contrôle du téléchargement Silverlight asynchrone L’encodage des assets L’affichage des états de l’encodage

74

La suppression d’un asset

Dans cette partie, nous avons essayé de présenter les différentes méthodes qui permettent le développement des applications permettant la gestion et la manipulation des services médias du Windows Azure.

75

Annexe B : Présentation W3C

World Wide Web Consortium, http://www.w3.org est une organisation internationale fondée

en 1994 qui se propose de définir et proposer des normes (spécifications ou

recommandations) techniques afin de standardiser les technologies et protocoles utilisés sur le

Web.

Si ses premières recommandations concernaient les normes de présentation du langage

HTML, sa mission s’est ensuite élargie à d’autre technologies(XML, XHTML, XSL, CSS…)

ainsi qu’aux champs liés à l’interaction entre le Web et ses utilisateurs (accessibilité,

utilisabilité, mobilité…)

76

Bibliographie

http://www.commentcamarche.net/contents/1332-introduction-a-xml

http://popcornjs.org/

77