rapportDigital-TV

1 212 vues

Publié le

0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
1 212
Sur SlideShare
0
Issues des intégrations
0
Intégrations
5
Actions
Partages
0
Téléchargements
0
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

rapportDigital-TV

  1. 1. 1 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 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
  2. 2. 2 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 : ..........................................................................................63 A. Front office:............................................................................................................63 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
  3. 3. 3 Liste des figures Figure 1 : Les piliers stratégiques de CIC .................................................................................11 Figure 2 : Cycle de vie d'un projet XP .......................................................................................14 Figure 3 : Pseudo Streaming .....................................................................................................22 Figure 4 : La lecture en continu ................................................................................................23 Figure 5 : Les service du cloud .................................................................................................29 Figure 6 : Composition du cloud ..............................................................................................30 Figure 7 : Les types du cloud....................................................................................................31 Figure 8 : Les scénarios d’utilisation du cloud .........................................................................33 Figure 9 : Architecture Windows Azure Media Services ........................................................35 Figure 10 : Création de compte de stockage............................................................................37 Figure 11 : Création service média...........................................................................................37 Figure 12 : Réservation des capacités......................................................................................38 Figure 13 : Téléchargement des vidéos....................................................................................38 Figure 14 : Les opérations à effectuer sur une vidéo...............................................................39 Figure 15 : Encodage ................................................................................................................39 Figure 16 : Tableau de bord du service média .........................................................................40 Figure 17 : Cas d'utilisation global ...........................................................................................44 Figure 18 : Diagramme d'activité..............................................................................................51 Figure 19 : Diagramme de séquences (Authentification) .........................................................52 Figure 20 : Diagramme de séquences (Création programme) ..................................................53 Figure 21 : Diagramme de séquences (Visualiser programme) ................................................53 Figure 22 : Diagramme de classes ............................................................................................54 Figure 23 : Modèle de données.................................................................................................55 Figure 24 : data_base.xml.........................................................................................................56 Figure 25 : playlist.xml.............................................................................................................56 Figure 26 : montage.xml...........................................................................................................57 Figure 27 : programme.xml ......................................................................................................58 Figure 28 : Architecture WAMP Server ...................................................................................61 Figure 29 : Architecture du système ........................................................................................63 Figure 30 : Composition de la page publique ..........................................................................64 Figure 31 : En-tête ....................................................................................................................64 Figure 32 : Lecteur HTML5 .....................................................................................................64 Figure 33 : Playlist....................................................................................................................65 Figure 34 : Bonnes nouvelles....................................................................................................65 Figure 35 : Vidéothèque ...........................................................................................................65 Figure 36 : Composition de la page d'administration ...............................................................66 Figure 37 : Bibliothèque ...........................................................................................................66 Figure 38 : Partie montage........................................................................................................67
  4. 4. 4 Figure 39 : Insertion news ........................................................................................................67 Figure 40 : Formulaire ajout texte animé..................................................................................67 Figure 41 : Les couches de développement sur Windows Azure.............................................74
  5. 5. 5 Liste des tableaux Tableau 1 : Estimation des tâches............................................................................................16 Tableau 2 : Comparaison TV sur internet.................................................................................21 Tableau 3 : Les protocoles standards........................................................................................25 Tableau 4 : Les protocoles propriétaires..................................................................................26 Tableau 5 : Avantages/Inconvénients des services du cloud ....................................................29 Tableau 6 : Description de cas d'utilisation "Athentification" .................................................44 Tableau 7 : Description de cas d'utilisation "Créer programme" .............................................45 Tableau 8 : Description de cas d'utilisation "Insérer animation"..............................................45 Tableau 9 : Description de cas d'utilisation "Découper video" ................................................46 Tableau 10 : Les en-têtes de requête http standard................................................................72 Tableau 11 : Les fonctions http standards ...............................................................................73 Tableau 12 : Les principales entités du service média.............................................................73
  6. 6. 6 Liste des abréviations LSE: Local Software Economy IT: Information Technology TV: Television XP: eXtreme Programming XML: eXtensible Markup Language HTML: HyperText Markup Language HTML5: HyperTextMarkupLanguage 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: MicrosoftMediaSrvice overHTTP 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 FTP: File Transfer Protocol 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
  7. 7. 7 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
  8. 8. 8 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.
  9. 9. CHAPITRE1 : Contexte du projet
  10. 10. 10 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ésentationde 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.
  11. 11. 11  Renforcer l'esprit d'entreprise et l'esprit de créativité parmi la population des jeunes.  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ésentationdu projet Supportde Startups tirer parti des nouvelles competences technologiques et entrepreneuriales pour améliorer l'efficacitédes startups et la prestation de services innover dans un environementouvert Fournir une plate-forme innovante pour le développement d'entreprises technologiques locales pertinentes au niveau mondial democratiser l'education avec les TIC Améliorer l'accès aux technologies de l'éducation et intégrer les citoyens avec la «connaissanceIT”
  12. 12. 12 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.
  13. 13. 13 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
  14. 14. 14  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.
  15. 15. 15 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
  16. 16. 16 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 5 Tableau 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
  17. 17. 17 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.
  18. 18. CHAPITRE2 : Etat de l’art
  19. 19. 19 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évisionsur 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)
  20. 20. 20  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
  21. 21. 21 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 garantie Tableau 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é.
  22. 22. 22 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
  23. 23. 23  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).
  24. 24. 24  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.
  25. 25. 25  Protocoles standards 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é
  26. 26. 26 pour diminuer la bande-passante du serveur. Ce protocole supporte la mobilité, c'est-à-dire le changement à la volée 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.
  27. 27. 27  Flash Media Encoding Server (FMES): 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
  28. 28. 28 Real Media, partiellement lu. Il implémente les protocoles standards de diffusion ainsi que le 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
  29. 29. 29 pour les utilisateurs, qui ne se soucient ni de la plateforme, ni du matériel, qui sont mutualisés avec d’autres entreprises. 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).
  30. 30. 30 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
  31. 31. 31 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
  32. 32. 32 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.
  33. 33. 33 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
  34. 34. 34  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).
  35. 35. 35  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
  36. 36. 36  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.
  37. 37. 37 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
  38. 38. 38  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
  39. 39. 39 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
  40. 40. 40 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.
  41. 41. CHAPITRE3 : Analyse et spécification des besoins
  42. 42. 42 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écificationdes 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 formalisation des fonctionnalités attendues de notre système ainsi que toutes les règles de gestion qui les régissent.
  43. 43. 43 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’utilisationglobal : 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.
  44. 44. 44 Figure 17 : Cas d'utilisation global B. Descriptiontextuelle 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"
  45. 45. 45  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»
  46. 46. 46 Titre Découper vidéo 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…)
  47. 47. 47  JavaScript : 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
  48. 48. 48 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.  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
  49. 49. 49 devenu le SGBD open source le plus populaire au monde grâce à sa performance, sa haute fiabilité et sa simplicité d’utilisation. 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.
  50. 50. CHAPITRE4 : Conception de l’application
  51. 51. 51 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é
  52. 52. 52 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éé.
  53. 53. 53 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)
  54. 54. 54 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.
  55. 55. 55 Programme : C’est une classe qui contient les programmes créés et leurs informations et elle est composée des montages et des playlists. 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
  56. 56. 56 <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> ; 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
  57. 57. 57 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 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>.
  58. 58. 58 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.
  59. 59. CHAPITRE5 : Réalisation
  60. 60. Chapitre5 : Réalisation 60 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 :
  61. 61. Chapitre5 : Réalisation 61  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
  62. 62. Chapitre5 : Réalisation 62  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.
  63. 63. Chapitre5 : Réalisation 63 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:
  64. 64. Chapitre5 : Réalisation 64 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.
  65. 65. Chapitre5 : Réalisation 65 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
  66. 66. Chapitre5 : Réalisation 66  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.
  67. 67. Chapitre5 : Réalisation 67 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é
  68. 68. Chapitre5 : Réalisation 68 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.
  69. 69. 69 Conclusion générale
  70. 70. 70 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
  71. 71. Annexes
  72. 72. 72 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 Valeur Autorisation 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.1 DataServiceVersion Décimal 3.0 MaxDataServiceVersion Décimal 3.0 Tableau 10 : Les en-têtes de requête http standard Fonctions HTTP standards Verbe Description GET Renvoie la valeur actuelle d’un objet. 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).

×