Samstag, 31. Juli 2010

entwickler.com Magazine Konferenzen Entwickler Akademie Entwickler-Forum Jobbörse Bücher
Software & Support Verlag




 
CREATE OR DIE!!
 
September 2006
aus VISUAL-X Ausgabe: Volume 14.2006
Flash IE-Patch
Carlo Blatz

Jeden hat es wohl in den letzten Wochen genervt: Flash wird im Browser von einem hässlichen Rahmen umrandet, und erst nach einem Klick hinein kann die Interaktion beginnen. Für viele war das neue Browser-Verhalten trotz langer Ankündigungen ein Schock. So manch einer bekommt angesichts des neuen Rahmens Angst, dass er von Spyware oder Malware heimgesucht wird. Banner reagieren nicht mehr auf den ersten Klick, maussensible Flashfilme können User erst nach einem Klick sehen, und Enter-Buttons reagieren nur auf einen Doppelklick. Kann man diese Probleme zuverlässig lösen?


Seit dem Internet Explorer (IE)-Zwangsupdate MS06-013 im April 2006 greift dieser Mechanismus zum Schutz vor dem so genannten Eolas-Patent und selbst im neuesten Opera-Browser ist der Schutzmechanismus enthalten. Das Browserverhalten wird derart modifiziert, dass eine mögliche Verletzung des umstrittenen US-Patents mit der Nummer 5838906 vermieden wird. Bereits 1999 entbrannte der Streit zwischen Microsoft und Eolas Technologies, der schließlich mit einer Strafe von 521 Millionen US-Dollar für Microsoft endete. Das Ende 1994 angemeldete Patent von Eolas schützt die Idee des Einbettens von Plug-ins oder Applets in Websites und damit auch von ActiveX-Controls wie Flash oder Quicktime.

User können nach dem Update ihres Browsers nicht mehr direkt mit ActiveX-Controls interagieren, die in Websites über EMBED, OBJECT oder APPLET eingebunden sind. Die Controls werden zwar weiterhin geladen, aber ihre Bedienschnittstelle ist blockiert. Erst nach einem Klick wird das Control freigegeben. Eine Flashanimation oder ein Quicktime- bzw. Flash-Video wird also auch weiterhin abgespielt, die Playerbuttons sind jedoch zunächst deaktiviert.

Bindet man die externen Programme hingegen nicht über HTML, sondern beispielsweise über JavaScript ein, wird der Patentschutz wirksam umgangen. Auch wenn in der Konsequenz das Gleiche passiert, der Form ist Genüge getan, es gibt keine direkte Einbindung in die HTML-Datei. So wird der Aufruf über Variablen durch ein JavaScript geschleift und verhindert damit die Sperrung des Controls. Dieses Prinzip wurde vor allem von Geoff Stearns im kostenlosen SWFObject-Projekt perfektioniert [1]. Es wurde unter der MIT-Lizenz veröffentlicht und darf somit frei genutzt werden. Wie praktisch, dass man sich mit dieser Lösung direkt einem weiteren Flash-Problem gewidmet und dem zentralen Script eine Flashdetection spendiert hat. So vertrauen bereits Skype, YouTube und viele Weitere dem kostenlosen Script.

Wichtig für den Erfolg ist selbstverständlich, dass das SWFObject kompatibel zu allen Standard-Webbrowsern ist, wie etwa für den PC: IE5/5.5/6, Netscape 7/8, Firefox, Mozilla, und Opera sowie für den Mac: IE5.2, Safari, Firefox, Netscape 6/7, Mozilla und Opera 7.5+. Zudem sollte es problemlos mit neueren und zukünftigen Versionen laufen.

Aufruf
Das Script zeichnet sich insbesondere durch seine einfache Integration in drei Schritten aus. Als Erstes bindet man es als externe JS-Datei ein (dadurch ist der Code nicht in der HTML-Datei und das Patent wird umgangen). Danach kreiert man mit einem benannten DIV den alternativ zu Flash anzuzeigenden Inhalt. Und zuletzt muss nur noch das Flash mit seinen Parametern in neuer SWFObject-Form eingebunden werden. Zusammen sieht das beispielsweise so aus:

<script type="text/javascript" src="swfobject.js"></script> 
<div id="flashcontent">
Dieser Text wird durch den Flashinhalt ersetzt.
</div>
<script type="text/javascript">
var so = new SWFObject("movie.swf", mymovie", "200", "100", "7", "#000000");
so.write("flashcontent");
</script>

Der Inhalt im DIV wird durch den Flashinhalt ersetzt, sodass User, die das Flash-Plug-in installiert haben, den Inhalt des Elementes nicht sehen. Dieser Trick hat einen weiteren Vorteil: Suchmaschinen können den alternativen Inhalt der Seite indexieren.

Für den Aufruf von Flash erstellt man ein neues SWFObject und trägt die benötigten Parameter ein. Dafür sind folgende vorgesehen:

  • swf – Der Pfad zu der swf-Datei und der Name.
  • id – Die ID des OBJECT- oder EMBED-Tags. Das EMBED-Tag braucht diesen Wert auch als Namensattribut für die Verwendung von swliveconnect.
  • width – Die Breite des Flashfilms.
  • height – Die Höhe des Flashfilms.
  • version – Die benötigte Player-Version. Dies kann als string im Format majorVersion.minorVersion.revision angelegt werden. Beispiel: 6.0.65, Oder einfach nur die Angabe der Versionsnummer 6.
  • background color – Dies ist der HEX-Wert der Hintergrundfarbe des Flashfilms.

Optionale Parameter:

  • useExpressInstall – Wenn User zum Upgrade das ExpressInstall-Feature einsetzen sollen, muss dieser Wert auf true gesetzt werden.
  • quality – Die Qualität, mit der der Flashfilm abgespielt werden soll. Wenn kein spezieller Wert gesetzt wird, gilt der Default-Wert high.
  • xiRedirectUrl – Wenn User, die das ExpressInstall-Upgrade durchgeführt haben, zu einer URL umgeleitet werden sollen, kann diese URL hier eingegeben werden.
  • redirectUrl – Wenn User, die nicht die korrekte Plug-in-Version einsetzen, umgeleitet werden sollen, kann diese URL hier angegeben werden.
  • detectKey – Dies ist der Name der URL-Variablen, den das SWFObject-Skript braucht, wenn eine Erkennung umgangen wird. Default ist "detectflash". Beispiel: Um die Flash-Erkennung zu umgehen und einfach nur den Flashfilm auf die Seite zu schreiben, kann man ?detectflash=false zur URL des Dokumentes hinzufügen, welches den Flashfilm enthält.

Mit dem Befehl so.write("flashcontent"); wird dem SWFObject-Skript mitgeteilt, dass es den Flashinhalt auf die Seite schreiben soll (wenn das System des Users die korrekte Version des Plug-ins installiert hat) indem es den Inhalt im entsprechenden HTML-Element ersetzt.

Flashdetection
SWFObject entdeckt die Flashplayer ab Version 3, einfach durch die Übergabe des Versionsparameters als string-Wert, der gewünscht ist. Am Beispiel des Flashplayers Version 6.0.65 sieht das so aus:

var so = new SWFObject("movie.swf", "mymovie", "200", "100", "6.0.65", "#000000");

Ist der Minor-Release unwichtig, genügt auch ein einfaches 6 als Versionsparameter.

Flashvars
Flashvars zu benutzen ist der einfachste Weg, um Daten aus HTML in den Flashfilm zu bekommen. Allerdings funktioniert dies nur einmal, nämlich dann, wenn der Film zum ersten Mal geladen wird. Mit dem Flashvars-Parameter der OBJECT- und EMBED-Einbindung wurden die Werte wie URL-Variablen übergeben:

variable1=wert1&variable2=wert2&variable3=wert3 usw. 

Mit SWFObject geht das etwas schöner: Man kann nach der SWFObject-Einbindung – und vor dem so.write("flashcontent") – beliebig viele Werte in dieser Form übergeben:

so.addVariable("variable1", "wert1"); 
so.addVariable("variable2", "wert2");

Ist das einmal geschehen, stehen alle übergebenen Variablen sofort dem Flashfilm zur Verfügung. Man kann sie dann benutzen wie jede andere Variable der _root timeline.

Das SWFObject-Skript verfügt zusätzlich über eine Funktion, die es erlaubt, Variablenwerte aus dem URL-String zu lesen. Beispielsweise, wenn man eine URL hat, die wie folgt aussieht: www.example.com/page.html?variable1=wert1. Mit der Funktion getQueryParamValue() kann man diese Werte ganz einfach auslesen und dem Flashfilm übergeben. Entsprechend dem gerade gezeigten URL-String sieht das so aus:

so.addVariable("variable1",
getQueryParamValue("variable1"));

Mit der getQueryParamValue()-Funktion können auch Variablen vom location.hash ausgelesen werden, was manchmal benutzt wird, um direkt in die Flash-Applikation zu verlinken. Ein Beispiel für diese tiefe Verlinkung findet man in der Slideshow Pro [2].

ExpressInstall
SWFObject unterstützt vollständig das ExpressInstall-Feature des Macromedia Flash Player. Im SWFObject-Skript ist eine ActionScript-Datei implementiert, die SWFObject erlaubt, den Upgrade-Prozess aus dem Flashfilm heraus zu starten. Der User muss zum Upgrade seines Players nicht die ursprüngliche Seite verlassen. Wenn das Upgrade erfolgreich durchgeführt wurde, wird er sofort wieder zurückgeleitet.

Um ExpressInstall benutzen zu können, muss die im Paket enthaltene expressinstall.as-Datei in die jeweilige fla-Datei eingebunden und damit beim Start des Films die Upgrade-Notwendigkeit mit einer simplen Abfrage beim User geprüft werden (if (ExpressInstall.needsUpdate)). Es ist wichtig, das erste Frame (oder das Frame, in dem der ExpressInstall-Check geschieht) leer zu lassen, wenn Flash Player 7 oder höher benötigt wird. Für einen Live-Test dieses Codes kann man die source/so_tester.fla in der SWFObject-ZIP-Datei öffnen.

Für alle, die es nicht händisch einbauen möchten, gibt es auch eine Dreamweaver-Extension namens CMX Insert FlashObject 1.2 [3] und ein entsprechend modifiziertes Flashtemplate [4].

Wie man bereits an den diversen weiteren optionalen Parametern gesehen hat, kann SWFObject noch einiges mehr. Weitere Beispiele und Ausführungen finden sich unter [5]. Alles in allem ist das durch die Community gewachsene Projekt eine gute Alternative zum alten Macromedia Detection Kit. Schließlich setzt sogar Adobe das Script (leicht modifiziert) ein.


  1. SWFObject-Projekt
  2. Slideshow Pro
  3. CMX Insert FlashObject 1.2
  4. Flashtemplate
  5. SWFObject
    Hat Ihnen dieser Artikel gefallen? Dann abonnieren Sie VISUAL-X direkt über unser

zur vorherigen Seite
zurück
an den Anfang der Seite
nach oben
Diesen Artikel drucken
drucken
Diesen Artikel weiterempfehlen
empfehlen

Anzeige
Software & Support Verlag GmbH