Logo - 5.120 Bytes

H.264 MPEG-4-AVC Video Encoding by websmith®

Flash-Video Einbinden:
  • MP4-Video auf der Homepage
  • Adobe Flash Player und MP4
  • MP4 Streaming Metadaten

So binden Sie Ihre MP4-Videos in die Webseiten ein. Finden Sie Tipps zur Konvertierung, Encodierung und zum Streaming hochauflösender H.264 Web Videos im Adobe Flash Player.

Encoding Praxis - Videos encoden mit Windows (GUI)

... und rein ins Web. Einbinden eines Flashplayers in die Internetseite

Nun müssen Sie aus einer breiten Auswahl an Flashplayern Ihren Favoriten auswählen, um das zuvor erstellte Video auf Ihrer Webseite einfügen zu können. Meiner Meinung nach sind die interessantesten auf flash-basierenden Player der von Jeroen "JW" Wijering enwickelte JW FLV Player und der von der Flowplayer Ltd. entwickelte, gleichnamige Flowplayer. Für den prinzipiellen Einsatz des Adobe Flash Players spricht in jedem Fall die hohe Verbreitung, da dieser laut Adobes Statistiken, bereits auf 98% aller internetfähigen Desktop PCs vorhanden ist.

In diesem Beispiel haben wir haben uns für den bekannten und recht weit verbreiteten JW FLV Player entschieden. Das Player Paket kann auf der Webseite von http://www.longtailvideo.com bezogen werden. Auf der Webseite befindet sich unter anderem ein praktischer Wizard, mit dem Sie die meisten Anpassungen des Players vornehmen können. Der Wizard generiert aus den Eingaben sofort verwendbaren Quellcode. Wem der Flowplayer mehr zusagt, kann diesen auf der Webseite von http://www.flowplayer.org beziehen.

Der JW FLV Player ist sehr einfach zu konfigurieren und kann zum Beispiel mit dem nachfolgenden JavaScript-Code auf einer Webseite eingebettet werden:

<p id="content">Das Video wird in diesem Absatz eingebunden</p>
<script type='text/javascript' src='swfobject.js'></script>
<script type='text/javascript'>
   var player = new SWFObject('player.swf','player','240','212','9');
   player.addParam('allowfullscreen','true');
   player.addParam('allowscriptaccess','always');
   player.addParam('flashvars','file=video.mp4');
   player.write('content');
</script>

Hier wird ein MPEG-4-Video mit dem Abemssungen 240px x 192px in einen Paragraph (HTML P-Tag) eingebunden, dem vorher ein ID-Attribut namens “content” zugewiesen wurde. Im Grunde läßt sich das Video über das swobject.js je nach Ihrem Layout in jedes Block-Element also auch in eine DIV oder eine Tabellenzelle einbinden.

Im Beispiel wird davon ausgegangen, daß das Video, die Seite, in der das Video eingebettet ist, das Javascript für die Flash-Erkennung und der JW FLV Player im gleichen Verzeichnis liegen. Achten Sie also darauf, dass Sie die Pfade für die swfoject.js, player.swf und video.mp4 richtig anpasst haben. Wenn alle Schritte abgearbeitet sind, sollte das Video im Browser abspielbar sein.

Wenn der Effekt auftritt daß der Flashplayer zunächst die komplette Videodatei herunterlädt, bevor er dieses Video abspielt, haben Sie die moov atom Informationen des Videos nicht korrigiert. Der Flashplayer kann die mp4 Metadaten nicht richtig interpretieren.

Sehr viele Video Encoder schreiben die mp4 Metadaten sehr unsauber. Sie schreiben den Index an das Ende der Videodatei und nicht, wie vom Flashplayer erwartet, an den Anfang der Datei. Um dies zu korrigieren folgen Sie den Schritten des Kapitels: "Einfügen der MP4 Streaming Metadaten mit Yamb".

» weiter […]

© 2009 Codecasters GmbH – MPEG-4-AVC-Encoding (H.264) – professionelles H.264 / X264 Video Encoding & Streaming – Video on Demand aus Rosenheim