WebTV qui alterne entre émissions en « direct » et « playlist »

Dans les deux derniers articles sur red5,  nous avions vu que ce logiciel permet de diffuser un flux en direct mais aussi qu’il permet de diffuser une liste de lecture  vidéo synchronisée côté serveur. Et bien, pour se rapprocher toujours un peu plus de l’application webTV idéale, nous allons voir aujourd’hui comment, via notre animation flash, basculer  entre la lecture de la playlist et la diffusion d’évènements en direct.

J’avais déjà cherché une réponse à ce problème il y a quelques mois et était tombé sur un article très intéressant du blog de Chloé Desoutter. Elle explique que la solution est de construire le player afin qu’il se connecte par défaut à la playlist et d’ajouter un écouteur d’évènement qui, s’il détecte la présence d’un flux en live, coupe la lecture du différé et démarre celle du live. Intéressant non ? …sauf que je n’avais pas réussi à créer « l’écouteur » car lorsque l’on demande à red5 le statut d’un stream inexistant, il ne répond rien (aucun moyen de relever sa disponibilité ou son indisponibilité).

Je m’étais donc rabattu sur la création d’un « super player« , une animation flash destinée à être utiliser par l’administrateur de la webTV afin de jongler entre tous les flux disponibles (webcam1, webcam2 et liste de lecture). Le super player relève donc le flux sélectionné et inscrit son nom dans un fichier. Ce fichier est lui-même lu, toutes les 10 secondes, par le player du client qui vérifie qu’il est bien connecté à la bonne source.

• L’avantage de ce système est que la diffusion de l’émission en direct ne démarre pas dès qu’on connecte la régie au serveur. On peut ainsi effectuer quelques corrections et vérifications avant d’être à l’antenne.

• Le défaut de ce système : ça bug grave… déjà parce que le serveur à du mal à suivre, mais aussi (et surtout) parce que le nombre de requêtes sur le fichier « info » (écrit par le super player et lu en meme temps par les players de tous les clients) explose !!

Ce n’était donc pas la bonne solution…

En fait ce qu’il nous faut pour arriver à basculer entre programme live et différé, c’est :

• par défaut le lecteur flash doit lire le flux différé
• savoir si le flux live est disponible ; si oui j’arrête la lecture de la playlist et je démarre celle du direct
• savoir quand le direct prend fin, pour stopper sa lecture et reprendre celle du différé

Comme je le disais plus haut, mon souci venait de l’évènement qui détecte le début du live. En fait, on peut se débrouiller en demandant à flash de nous informer des métadonnées d’un stream, tel que son titre par exemple. Si l’on démarre l’animation flash et que le live est disponible, il va nous donner son titre. De même si le live démarre pendant la lecture d’un autre stream. Et pour savoir lorsque le direct prend fin, il suffit de demander à flash les statuts du stream ; si le live s’arrête, il nous dira : « NetStream.UnpublishNotify ».

Un peu de code devrait être plus explicite :

//------------fonctions de lecture-------------------------------
function lecture(){
   nc= new NetConnection()  //nouvelle connection
   nc.connect("rtmp://localhost/playlistTest") //se connect au flux de la playlist
   ns= new NetStream(nc) //nouveau flux
   vids.attachVideo(ns) //le flux est lu par l'objet "vids"
   ns.setBufferTime(2) //je règle la mémoire tampon sur 2 secondes
   ns.play("webtv") //je lis le tout
   ;
 
   //-------------test---disponibilité--live------------------------
   tc= new NetConnection() //nouvelle connection
   tc.connect("rtmp://localhost/oflaDemo") //se connect au flux de l'application du live
   ts= new NetStream(tc)
   ts.play("live_webcam");           //se connect au stream du live
   ts.onMetaData = function(info:Object) { //je récupère le nom du stream
      trace("titre: " +info.title);
      if(info.title == "live"){        //si j'ai la réponse je démarre sa lecture
      //-------------à--lancer--si--live--disponible-------------------
      ns.close(); //je coupe le stream de la playlist
      nc.close(); //je coupe la connection à l'application de la liste de lecture
      vids.attachVideo(ts) //c'est parti pour la lecture !
      ts.setBufferTime(2)
      ts.onStatus = function(info){ //je surveille une hypotétique fin du live
         trace("statut de la connection :"+info.code);
         if(info.code == "NetStream.Play.UnpublishNotify"){ //si le live prend fin je ferme le stream et je redémarre tout
            ts.close();
            tc.close();
            lecture();
         }
       }
     }
   };
}
//-----------------------lance--le--tout-------------------------
lecture();

Un chose qu’il nous faut modifier pour que ça marche, c’est de ne pas oublier d‘inclure la métadonnée voulue dans le live. Pour ce faire, il suffit d’ajouter quelques lignes à l’animation flash utilisée pour la diffusion en direct :

//Envoie de métadonnées
var metaData:Object = new Object();
metaData.title = "live"; //comme métadonnée, j'ai pris le titre "live"
broadcast_ns.send("@setDataFrame", "onMetaData", metaData);//ici le stream se nomme "broadcast_ns"

Pour mon application, j’ai donc largement utilisé l’idée de Chloé Desoutter ainsi que le système de diffusion live proposé sur le site de l’ecm dans un tutoriel consacré à red5 que j’ai juste un peu modifié.

les deux fichiers sources utilisés dans le tutoriel sont téléchargeables