Die ExternalInterface Klasse von Flash ist eine Programmier-Schnittstelle, die die Kommunikation zwischen ActionScript und der "Außenwelt" (z.B. einer HTML-Seite mit JavaScript) ermöglicht.

Ein kurzes Beispiel zeigt, wie die Kommunikation in beide Richtungen mithilfe des populären SWFObjects funktioniert.

ExternalInterface Klasse

Damit man von "extern" (also aus dem JavaScript-Code) Funktionen in Flash ausführen kann, muss man die entsprechenden Funktion explizit in ActionScript definieren. Erst dann sind diese von außen erreichbar. Dazu dient die Funktion addCallback der ExternalInterface-Klasse.

Die addCallback-Methode erwartet zwei Parameter: Der erste ist der Name der Funktion, wie sie für den Zugriff aus JavaScript heißen soll. Der zweite Parameter ist die tatsächliche ActionScript-Funktion, die beim Aufruf ausgeführt werden soll.

Ein Beispiel: Mit ExternalInterface.addCallback("setTextField", setTF); wird eine Funktion mit dem Namen setTextField definiert, die durch JS erreichbar ist. Intern wird dann die AS-Funktion setTF ausgeführt.

Actionscript:
  1. function setTF(name:Object):void {
  2.     myText.text = name.inputValue;
  3. }
  4. ExternalInterface.addCallback("setTextField", setTF);

Möchte man übrigens Werte an JavaScript zurückliefern, geschieht dies wie gewohnt über den return-Befehl am Ende der Funktion.

SWFObject und JavaScript

Nun gilt es, die Funktion innerhalb der HTML Seite auszuführen. Dazu kommt JavaScript in Verbindung mit SWFObject zum Einsatz.

Der relevante JS-Codeschnippsel lautet:

Actionscript:
  1. var obj = swfobject.getObjectById("myFlash");       
  2. if (obj && typeof obj.setTextField != "undefined") {                                                
  3.     var customObj = {
  4.         inputValue: document.getElementById("myInput").value,
  5.         sonstiges: "Weitere parameter"
  6.     };
  7.     obj.setTextField(customObj);
  8.     document.getElementById("myInput").value ="";

Zuerst stellt mein eine Referenz zu dem div her, der den Flashcontent enthält: var obj = swfobject.getObjectById("myFlash"). Dies ist der gleiche div wie im eigentlichen SWFObject-Aufuruf swfobject.embedSWF("externalinterface.swf", "myFlash", ….

Die if-Abfrage prüft, ob die Referenz erfolgreich war und ob es die Methode setTextField gibt.

Danach wird ein Objekt customObj erstellt, das mit mehreren Instanzeigenschaften gefüllt wird. In diesem Beispiel hätte es auch ein einfacher String statt eines Objekts getan. Ich wollte jedoch gleich die Verwendung eines Objekts zeigen, da dies eine praktische Methode ist, eine Vielzahl ein Informationen auf einmal zu übergeben.

obj.setTextField(customObj) startet nun die Funktion in ActionScript und übergibt als Parameter des gerade erstellte Objekt.

Beispiel: JS <>AS

Das folgende Beispiel hat zwei Textfeldern, eines in Flash und eines in HTML. Über die zwei Buttons lassen sich die Werte des Textfeld hin- und herkopieren.

Link: Beispiel anschauen
Link: Download (Quellcode)