Das pollende Web

Mit AJAX taucht eine Web-Technik in der Automation auf, welche die Schwachstellen vieler Web-basierter Applikationen – lange Bildaufbauzeiten und die fehlende automatische Datenaktualisierung – beseitigt. Als Teil der Web- 2.0-Entwicklungen bringt AJAX Web-Visualisierungen zum Pollen und verspricht Desktop-ähnliche Reaktionszeiten.

Mit AJAX taucht eine Web-Technik in der Automation auf, welche die Schwachstellen vieler Web-basierter Applikationen – lange Bildaufbauzeiten und die fehlende automatische Datenaktualisierung – beseitigt. Als Teil der Web- 2.0-Entwicklungen bringt AJAX Web-Visualisierungen zum Pollen und verspricht Desktop-ähnliche Reaktionszeiten.

INHALT:
Die AJAX-Komponenten
Licht und Schatten
AJAX in der Automation
AJAX im Einsatz
Autor

AJAX steht für Asynchronous Java Script And XML. AJAX ist keine neue Programmiersprache, sondern eine sinnvolle und kreative Anwendung bestehender Techniken: JavaScript, XML/ HTML sowie DOM. Neu ist vor allem die Möglichkeit, zwischen dem Webclient (Browser) und Webserver einen asynchronen Datenaustausch durchzuführen. Die HTML-Seite wird dabei nicht komplett neu geladen und aufgebaut. Stattdessen werden lediglich die relevanten Inhalte oder Nutzdaten nachgeladen.

Die AJAX-Komponenten

Bei JavaScript handelt es sich um eine clientseitige Scriptsprache, die von Netscape entwickelt wurde, um HTML-Seiten dynamisch zu gestalten. Bei JavaScript kann der Programmcode innerhalb eines HTML-Dokumentes stehen oder aber als externe Datei im Dateikopf (Head) eines HTML-Dokumentes eingebunden sein. Mittels JavaScript lässt sich nun der Webserver im Hintergrund aufrufen und Daten anfordern (Request).

Der Webserver beantwortet (Response) diese Anforderung und stellt die geforderten Daten zur Verfügung. Das empfohlene Austauschformat der Daten ist dabei XML. Schließlich ist die eXtensible Markup Language inzwischen das am häufigsten verwendete Austauschformat. In XML erstellte Dateien erreichen damit die größte Kompatibilität mit Applikationen, die in Sprachen wie C/C++ oder PHP programmiert wurden. XML-Dokumente sind textbasiert und durch Tags strukturiert und hierarchisch gegliedert.

Kernstück und verantwortlich für das Nachladen der Web-Seiten ist das API (Application Programming Interface) XMLHttpRequest, das in JavaScript als Objekt zur Verfügung steht.

Das vom World-Wide-Web-Consortium (W3C) standardisierte DOM (Document Object Model) ist eine für AJAX-Anwendungen wichtige Programmierschnittstelle. Mittels DOM lassen sich Webseiten dynamisch verändert. DOM steht in JavaScript zur Verfügung und repräsentiert alle Elemente eines HTML-Dokuments und stellt sie in einer Baumstruktur dar. Über JavaScript kann somit auf jedes Element der Webseite zugegriffen und verändert werden, beispielsweise die Farbe, Animation oder Größe eines Visualisierungsobjekts. Es können aber auch neue Elemente innerhalb des HTML-Dokumentes erstellt werden – z.B. Bilder, Texte, Tabellen und Formulare.

AJAX ist kostenfrei, wie alle Browsertechnologien betriebssystemunabhängig und steht in modernen Browsern bereits ohne Plug-In zur Verfügung. Speziell im Internet-Explorer bis einschließlich Version 6 muss die ActiveX-Schnittstelle sowie bei allen Browsern generell JavaScript aktiviert sein.

Die Entwicklungen im Bereich Web-basierter Automation sind in den letzten Jahren in den Vordergrund gerückt. Dies zeigt unter anderem auch das ZVEI-Projekt Webmation (siehe auch Computer & AUTOMATION2006, Heft 10, S. 42ff). Die Hersteller klassischer Visualisierungssoftware verfolgen verständlicherweise einen mehr oder weniger proprietären Ansatz. Diese Unternehmen werden sich vermutlich nicht an der Einführung von AJAX im industriellen Umfeld beteiligen, dessen Chancen gerade in der Offenheit und Interoperabilität liegen.

Als erster Steuerungshersteller setzt Brangl Electronics AJAX in ihrer Web@SPS ein. Zielsetzung war, eine einfach zu programmierende Steuerung zu entwickeln, die ohne kommerzielle Werkzeuge auskommt. Deswegen wird der Programmcode mit einem Editor in eine Textdatei geschrieben. Die Visualisierung lässt sich über beliebige HTML-Editoren erstellen und in den integrierten Web-Server der Steuerung laden. Damit sind Kauf und Pflege einer teuren Programmier- und Visualisierungssoftware hinfällig.

Bei der Projektierung kommt der Automatisierer bei dieser Lösung allerdings nicht direkt mit AJAX in Verbindung. Für die AJAX-Integration gibt es eine Engine, die im HEAD-Bereich des zu erstellenden HTML-Dokuments lediglich mit einem Link zu implementieren ist. Die Problematik der unterschiedlichen Browser-Interpretationen wurde bei der Erstellung der AJAX-Engine berücksichtigt. Somit werden alle aufgeführten Browser unterstützt. Für den schnellen Einstieg werden fertige Visualisierungsseiten in HTML mitgeliefert.

Der Datenaustausch zwischen Web-Server (SPS) und Client (Browser) erfolgt im XML-Format. Innerhalb der XML-Struktur sind die aktuellen Variablen der Steuerung enthalten. Die Struktur der XMLDatei ist statisch. Die AJAX-Engine analysiert (parst) die XML-Dokumente und stellt die darin enthaltenen Informationen wie Elemente, Attribute usw. mittels adressiertem ID-Tag an die gewünschte Position in der Web-Seite.