XML-Versand und -Empfang mit Flash

Das XML-Objekt von Flash eignet sich auch zum Versenden von Daten an einen Webserver.

Artikel erschienen in Swiss IT Magazine 2002/01

     

Hier kann das XML-Objekt in Flash zunächst zusammengebaut werden, um dann in Form von Rohdaten an den Webserver verschickt zu werden. Dieser muss dann seinerseits den XML-Code serverseitig auswerten und kann anschliessend ein Ergebnis an die Flash-Anwendung zurücksenden.



Das Versenden von XML-Daten über das XML-Objekt geschieht mit der Methode send(). Leider funktioniert dies nicht im Netscape Navigator 4.7 (getestet wurde die Windows-Version 4.73) bei der Windows-Version von PHP. Alle anderen gängigen Browser wie IE, Opera 5.12 und Netscape 6.1 machten keine Probleme. Auch mit Netscape 4.7 funktioniert es schliesslich, wenn die Dateien auf dem (Linux-)Webserver liegen.




Um ein XML-Objekt zu versenden, wird es zunächst in Flash erzeugt. Es soll das schon beschriebene Beispiel mit den zwei Elementen verwendet werden. Als Zusatz zum schon bestehenden Code werden die folgenden Zeilen angefügt:











test.contentType = "text/xml";
newXml = new Xml();
newXml.onLoad = onload;
test.sendAndLoad("http://localhost/
show_vars.php", newXml);

function onload(ready)
{
if (ready)
{
myText += "=========== " + "\n"
myText += "Status: " + newXML.status +
"\n";
myText += newXml.toString();
}
}






Zum Testen sollte man in jedem Fall einen neuen Flash Player im Browser benutzen. Damit kann der contentType des zu versendenden Objekts auf "text/xml" gesetzt werden. Andernfalls wird als Standardvorgabe "application/x-www-form-urlencoded" verwendet, was bei der Verarbeitung zu Problemen führen kann, denn die übertragenen Daten werden keineswegs url-encoded bevor sie versandt werden. Einzelheiten dazu findet man auf der Macromedia Website. Das dazugehörige PHP-Script empfängt die Daten dann als "HTTP_RAW_POST_DATA". In dem Beispiel werden die übergebenen Informationen um eigene Infos ergänzt und wieder zurückgeschickt:












<?
echo '<?xml version="1.0"?>';
echo "<H1>hello</H1>";
echo "<info>size Post:
" . sizeof($HTTP_POST_VARS) .
"</info>";
echo "<info>size GET:


" . sizeof($HTTP_GET_VARS) .
"</info>";
echo "<info>size raw:
" .sizeof($HTTP_RAW_POST_DATA) .
"</info>";
echo $HTTP_RAW_POST_DATA;
?>







Die hier mit echo ausgegebenen Daten müssen als gültiges XML formatiert werden. Diese Daten werden, ebenso wie die Originaldaten des Flash-XML-Objekts, wieder zurückgeschickt und im Flash-Film hinter dem Originalcode ausgegeben. Als Ergebnis sollte dann im Browser folgendes erscheinen:











<H1>Header</H1>
<first_Element dummy="dummy1"
name="firstname">text node
</first_Element>
<second_Element dummy="dummy2"
name="secondname">text node
</second_Element>===========
Status: 0
<?xml version="1.0"?>
<H1>hello</H1>
<info>size Post: 0</info>
<info>size GET: 0</info>
<info>size raw: 1</info>
<H1>Header</H1>
<first_Element dummy="dummy1"
name="firstname">
text node</first_Element>
<second_Element dummy="dummy2"
name="secondname">text node
</second_Element>






Wegen der fehlenden Whitespaces werden die Tags hintereinander ausgegeben. Um eine sinnvolle Auswertung zu erreichen, muss der Server den übergebenen XML-Code natürlich auswerten und eine passende Antwort zurücksenden. Eine solche Anwendung würde allerdings den Rahmen des Artikels sprengen. Denkbar wäre beispielsweise die Anmeldung eines Benutzers mit den Tags <username> und <password>, die dann von PHP mit dem expat-Modul ausgewertet wird. War die Anmeldung erfolgreich, könnte der Server ein XML-Tag <login> mit dem Inhalt "failed" oder "ok" zurücksenden. Der Flash-Film kann dann entsprechend reagieren.


Ein praktisches Beispiel

Eine wirklich praktische Anwendung findet man bei http://flash5actionscript.com/xmlobject.php. Hier wird am Beispiel des News-Dienstes Moreover.com erläutert, wie die verfügbaren XML-Daten dieser Website in einem Flash-Film ausgewertet werden können. Eine etwas abgewandelte Version soll hier als praktisches Beispiel dienen.



Zunächst wird in Flash ein grösseres Textfeld benötigt. Dieses sollte als mehrzeiliges Feld mit HTML-Eigenschaft definiert werden. Als Name wird hier "linkText" gewählt. Im ersten Schlüsselbild wird folgender Code eingetragen:












urlXML = new XML();
urlXML.onLoad = leseDaten;
linkText = "Bitte warten...";
urlXML.load("http://p.moreover.com/cgi-
local/page?c=Job%20markets%20news&o=xml");






Auch in diesem Beispiel wird, wie im vorherigen Artikel gezeigt, zunächst ein neues XML-Objekt erzeugt. In einem nächsten Schritt wird die onLoad-Methode der Funktion leseDaten() zugeordnet. Diese Funktion wertet nach erfolgreichem Einlesen die XML-Daten dann aus.




Die Website www.moreover.com liefert über die angegebene URL XML-Code, der im Detail wie folgt aussieht:











<?xml version="1.0" encoding="iso-8859-1" ?>
<!DOCTYPE moreovernews (View Source
for full doctype...)>
- <moreovernews>
- <article id="_28881529">
<url>http://c.moreover.com/
click/here.pl?x28881522</url>
<headline_text>Job market may be facing
steep climb</headline_text>
<source>Boston Globe</source>
<media_type>text</media_type>
<cluster>moreover...</cluster>
<tagline />
<document_url>http://www.boston.com/globe/
business/bostoncapital/</document_url>
<harvest_time>Dec 11 2001 5:55PM
</harvest_time>
<access_registration />
<access_status />
</article>
<article id="_28878300">
<url>http://c.moreover.com/click/
here.pl?x28876315</url>
<headline_text>Delphi to seek a further
1,400 job cuts</headline_text>
<source>WAITNEWS.com</source>
<media_type>text</media_type>
<cluster>moreover...</cluster>
<tagline />
<document_url>http://www.waitnews.com/
moreover.htm</document_url>
<harvest_time>Dec 11 2001 3:44PM
</harvest_time>
<access_registration />
<access_status />
</article>






Wie oben erwähnt, wertet die Funktion leseDaten() diesen XML-Code dann so aus, wir es die folgenden Code-Zeilen veranschaulichen:











function leseDaten(fertig)
{
if(!fertig)
{
return;
}







Ist das Lesen noch nicht beendet, kann die Funktion verlassen werden, was durch folgende Codezeilen bewerkstelligt wird.











linkText = "Daten wurden geladen,
formatiere ...\n";
mainTag = new XML;
elementTag = new XML;
articleList = new Array;
elementList = new Array;
mainTag = this.firstChild.nextSibling;






Die benötigten Arrays werden initialisiert, und der Main-Tag wird mit firstChild.nextSibling ausgelesen.











if(mainTag.nodeName.toLowerCase() !=
"moreovernews")
{
return;
}







Ist der Node-Name nicht "moreovernews", muss ein Fehler vorliegen und die Funktion wird verlassen.











articleList = mainTag.childNodes;







Die Methode childNodes gibt ein Array von untergeordneten Knoten zurück, das im folgenden in der For-Schleife ausgewertet wird.











linkText = "";
for(i=0; i<=articleList.length; i++)
{
document_url = "";
headline_text = "";
source = "";
id = "";
if(articleList[i].nodeName.toLowerCase()
== "article")
{
elementList = articleList[i].childNodes;






Hat der Knoten den Namen "article", so existieren wiederum untergeordnete Knoten mit den einzelnen Elementen dieses Artikels. Die Artikel-ID wird dann für die spätere Anzeige zwischengespeichert.











id = articleList[i].attributes.id;







In der For-Schleife werden jetzt die einzelnen Artikel-Elemente ausgelesen.











for(k=0; k<=elementList.length; k++)
{
elementTag = elementList[k];
elementType = elementTag.nodeName.


toLowerCase();
if(elementType == "source")
{
source = elementTag.firstChild.
nodeValue;
}
if(elementType == "headline_text")
{
headline_text = elementTag.
firstChild.nodeValue;
} else {
if(elementType == "url")
{
url = elementTag.firstChild.
nodeValue;
}
}
}





Abschliessend wird der Text mit dem Link zusammen im Textfeld angezeigt.











linkText += id + ":
<font color=\"#0000FF\">";
linkText += "<a href=\"" + url +
"\" target=\"_blank\">" +
headline_text +
"</a>";
linkText += "</font> - " + source + "<br>";






Die vorgestellten Programmierschritte lassen sich selbstverständlich für viel komplexere Anwendungen einsetzen. Wir hoffen, mit dieser Einführung das Interesse der Flash-Entwicklergemeinde geweckt zu haben.



Artikel kommentieren
Kommentare werden vor der Freischaltung durch die Redaktion geprüft.

Anti-Spam-Frage: Aus welcher Stadt stammten die Bremer Stadtmusikanten?
GOLD SPONSOREN
SPONSOREN & PARTNER