Ergänzend zum Artikel Dynamic Streaming mit dem Flash Media Server möchte ich eine sehr einfache Möglichkeit zeigen, wie man ohne große ActionScript-Kenntnisse dynamisches Streaming mit der FLV Playback Komponente 2.5 und einer SMIL-Datei realisieren kann.

Verwendet wird eine XML-Datei nach dem SMIL-Standard (Synchronized Multimedia Integration Language), einer Auszeichnungssprache für zeitsynchronisierte, multimediale Inhalt.

SMIL-Datei erstellen

Die SMIL-Datei kann mit jedem Text-/Codeeditor erstellt werden und wird mit dem (frei wählbaren) Dateinamen dynstream.smil im gleichen Verzeichnis wie die Flashanwendung abgespeichert.

PLAIN TEXT
XML:

  1. >
  2.    >
  3.       base="rtmp://192.168.2.108/vod/" />
  4.    >
  5.    >
  6.       >
  7.         src="mp4:sample1_150kbps.f4v" system-bitrate="150000"/>
  8.         src="mp4:sample1_700kbps.f4v" system-bitrate="700000"/>
  9.         src="mp4:sample1_1500kbps.f4v" system-bitrate="1500000"/>
  10.       >
  11.    >
  12. >

Sie enthält im head den Pfad zum Flash Media Server (rtmp://192.168.2.108) und der FMS-Anwendung mit dem Video (vod).

Im body stehen die Pfade zu den Bitraten-Varianten des Videos. Bei system-bitrate wird die jeweilige Bitrate eingetragen (in Bit, nicht wie in ActionScript in KBit)

SMIL-Datei in Flash laden

In Flash wird wie gewohnt die FLV Playback Komponente eingebunden. Einziger wesentlicher Unterschied: Man gibt statt eines Videofiles als Quelle einfach die SMIL-Datei als Videodatei an! Außerdem muss man das dynamische Streaming noch aktivieren (Zeile 2).

PLAIN TEXT
Actionscript:

  1. import fl.video.*;
  2. VideoPlayer.iNCManagerClass = NCManagerDynamicStream;
  3. myFLVPlayback.source = "dynstream.smil";

SMIL-Datei in Flex laden

Verwendet man Flex, sieht die Kombination von FLV Playback Komponente und externer SMIL-Datei z.B. so aus:

PLAIN TEXT
XML:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. :Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="onCreationComplete()" layout="absolute">
  3.     :Script>
  4.        
  5.             import mx.core.UIComponent;
  6.             import fl.video.*;
  7.            
  8.             private var vid:FLVPlayback;
  9.            
  10.             private function onCreationComplete():void  {
  11.                
  12.                 VideoPlayer.iNCManagerClass = NCManagerDynamicStream;
  13.                            
  14.                 vid = new FLVPlayback();
  15.                 var ui:UIComponent = new UIComponent();
  16.                 this.addChild( ui );
  17.                 ui.addChild( vid );
  18.                 
  19.                 vid.width = 640;           
  20.                 vid.height = 480;
  21.                 vid.skin = "SkinUnderPlaySeekMute.swf";
  22.                
  23.                 vid.source = "dynstream.smil";                           
  24.             }    
  25.         ]]>
  26.     :Script>
  27.    
  28.    
  29. :Application>