Werkzeuge zur Entwicklung von dynamischen Web-Anwendungen

Shewlakow, Nikolas

Werkzeuge zur Entwicklung von dynamischen Web-Anwendungen

Zusammenfassung

Inhaltsangabe:Einleitung:
Das Wachstum und die Komplexität im Bereich der dynamischen Webanwendungen nehmen zu. Geschäftsanforderungen wie knappe Budgets, enge Termine und die Flächigkeiten der Entwickler verlangen aber nach einfachen Technologien.
RAD-Tools (Rapid-Application-Development-Tools) versuchen die Spannung unter diesen Randbedingungen zu mindern. Leider gibt es noch relativ wenig Literatur, die sich dem Einsatz von visuellen Werkzeugen zur schnellen Entwicklung von Webbapplikationen beschäftigt.
Motiviert durch die beschriebene Situation versucht die vorliegende Arbeit, einen möglichst breiten und praxisorientierten Überblick über die eingesetzten Techniken zur Entwicklung von dynamischen Web-Anwendungen zu schaffen.
Ziele dieser Arbeit sind:
Beschreibung der verbreiteten Techniken und Scriptsprachen im WWW.
Beschreibung der Werkzeuge zur visuellen Entwicklung von dynamischen Webanwendungen.
Beurteilung der zwei ausgewählten Werkzeuge anhand der Entwicklung von einer Webanwendung.

Inhaltsverzeichnis:Inhaltsverzeichnis:
1.Einleitung4
1.1Problemstellung4
1.2Vorgehensweise5
1.3Zitierung7
2.Technologien und Architekturen von Webanwendungen9
2.1Begriffsdefinition9
2.2Statische Webseiten und Grundlagen der HTTP Kommunikation10
2.3Clientseitige Technologien13
2.3.1JavaScript14
2.3.2Flash17
2.3.3JavaApplets18
2.3.4ActiveX21
2.4Serverseitige Technologien22
2.4.1CGI28
2.4.2ASP.NET32
2.4.3PHP34
2.4.4JAVA (JavaServlets, JSP, JavaBeans)36
2.4.5Coldfusion40
2.5Zusammenfassende Beurteilung der Technologien42
3.Entwicklungswerkzeuge für dynamische Webanwendungen43
4.Datenbankenwicklung für das Kursverwaltungssystem49
4.1Analyse der Systemanforderungen50
4.2Konzeptioneller Entwurf (Entity-Relationship-Model)51
4.3Relationales Datenbankschema55
4.4Implementierung57
4.5DeZign Tool Beurteilung58
5.Entwicklung der Anwendung mit Dreamweaver MX59
5.1Allgemeine Merkmale des Programms59
5.2Webseite einrichten (Definition vom lokalen und Testserver)60
5.3Dokumententyp festlegen61
5.4DB Verbindung definieren61
5.5Erstellung von dynamischen Webseiten62
5.5.1index.php / kurs_details.php62
5.5.2kurs_maint.php64
5.5.3kurs_update.php65
5.5.4kurs_delete.php66
5.5.5ablauf_list.php, ablauf_delete.php67
5.5.6ablauf_maint.php, ablauf_update.php68
5.5.7teilnehmer_list.php, teilnehmer_update.php, teilnehmer_delete.php69
5.5.8teilnehmer_maint.php70
5.5.9kurs_teiln_insert.php72
5.5.10kurs_teiln_list.php, […]

Leseprobe

Inhaltsverzeichnis

ID 8168

Shewlakow, Nikolas: Werkzeuge zur Entwicklung von dynamischen Web-Anwendungen

Druck Diplomica GmbH, Hamburg, 2006

Zugl.: Fachhochschule Regensburg, Diplomarbeit, 2004

Dieses Werk ist urheberrechtlich geschützt. Die dadurch begründeten Rechte,

insbesondere die der Übersetzung, des Nachdrucks, des Vortrags, der Entnahme von

Abbildungen und Tabellen, der Funksendung, der Mikroverfilmung oder der

Vervielfältigung auf anderen Wegen und der Speicherung in Datenverarbeitungsanlagen,

bleiben, auch bei nur auszugsweiser Verwertung, vorbehalten. Eine Vervielfältigung

dieses Werkes oder von Teilen dieses Werkes ist auch im Einzelfall nur in den Grenzen

der gesetzlichen Bestimmungen des Urheberrechtsgesetzes der Bundesrepublik

Deutschland in der jeweils geltenden Fassung zulässig. Sie ist grundsätzlich

vergütungspflichtig. Zuwiderhandlungen unterliegen den Strafbestimmungen des

Urheberrechtes.

Die Wiedergabe von Gebrauchsnamen, Handelsnamen, Warenbezeichnungen usw. in

diesem Werk berechtigt auch ohne besondere Kennzeichnung nicht zu der Annahme,

dass solche Namen im Sinne der Warenzeichen- und Markenschutz-Gesetzgebung als frei

zu betrachten wären und daher von jedermann benutzt werden dürften.

Die Informationen in diesem Werk wurden mit Sorgfalt erarbeitet. Dennoch können

Fehler nicht vollständig ausgeschlossen werden, und die Diplomarbeiten Agentur, die

Autoren oder Übersetzer übernehmen keine juristische Verantwortung oder irgendeine

Haftung für evtl. verbliebene fehlerhafte Angaben und deren Folgen.

Diplomica GmbH

http://www.diplom.de, Hamburg 2006

Printed in Germany

Einleitung

- 1 -

Inhaltsverzeichnis:

1. Einleitung...4

1.1.

Problemstellung ... 4

1.2.

Vorgehensweise ... 5

1.3.

Zitierung... 7

2. Technologien und Architekturen von Webanwendungen. ...9

2.1.

Begriffsdefinition... 9

2.2.

Statische Webseiten und Grundlagen der HTTP Kommunikation... 10

2.3.

Clientseitige Technologien. ... 13

2.3.1.

JavaScript... 14

2.3.2.

Flash... 17

2.3.3.

JavaApplets... 18

2.3.4.

ActiveX... 21

2.4.

Serverseitige Technologien... 22

2.4.1.

CGI... 28

2.4.2. ASP.NET ... 32

2.4.3.

PHP ... 34

2.4.4.

JAVA (JavaServlets, JSP, JavaBeans)... 36

2.4.5.

Coldfusion... 39

2.5.

Zusammenfassende Beurteilung der Technologien... 41

3. Entwicklungswerkzeuge für dynamische Webanwendungen...42

4. Datenbankenwicklung für das Kursverwaltungssystem ...48

4.1.

Analyse der Systemanforderungen ... 49

4.2.

Konzeptioneller Entwurf (Entity-Relationship-Model)... 50

4.3.

Relationales Datenbankschema ... 54

4.4.

Implementierung... 56

4.5. DeZign Tool Beurteilung... 57

5. Entwicklung der Anwendung mit Dreamweaver MX ...58

5.1.

Allgemeine Merkmale des Programms... 58

5.2.

Webseite einrichten (Definition vom lokalen und Testserver)... 59

5.3.

Dokumententyp festlegen ... 60

5.4.

DB Verbindung definieren... 60

Einleitung

- 2 -

5.5.

Erstellung von dynamischen Webseiten ... 61

5.5.1.

index.php / kurs_details.php ... 61

5.5.2.

kurs_maint.php ... 63

5.5.3.

kurs_update.php... 64

5.5.4.

kurs_delete.php ... 65

5.5.5.

ablauf_list.php, ablauf_delete.php ... 66

5.5.6.

ablauf_maint.php, ablauf_update.php... 67

5.5.7.

teilnehmer_list.php, teilnehmer_update.php, teilnehmer_delete.php ... 68

5.5.8.

teilnehmer_maint.php ... 69

5.5.9.

kurs_teiln_insert.php... 71

5.5.10. kurs_teiln_list.php, kurs_teiln_delete.php ... 73

5.5.11. Authentifizierung ... 75

5.5.12. Java Script im Dreamweaver MX... 77

5.6.

Designentwicklung ... 78

6. Entwicklung der Anwendung mit CodeChargeStudio...80

6.1.

Allgemeine Merkmale des Programms... 80

6.2.

Einrichten einer ODBC Datenquelle ... 81

6.3.

Vorgehensweise bei der Entwicklung der Seite ... 83

6.4.

Entwicklung der Grundfunktionen mit dem Projekt-Assistenten... 84

6.5.

Erweiterung der Funktionalitäten der dynamischen Webseite ... 88

6.5.1.

kurs_list.php (index.php) ... 89

6.5.2.

kurs_details.php ... 90

6.5.3.

ablauf_list.php... 93

6.5.4.

ablauf_maint.php ... 94

6.5.5.

teiln_kurs.php ... 95

6.5.6.

teilnehmer_list.php ... 98

6.5.7.

teilnehmer_maint.php ... 100

6.6.

CSS Design ... 101

7. Resümee...102

8. Literaturverzeichnis ...104

8.1.

Technische Referenzen und Ressourcen... 104

8.2.

Sekundärliteratur... 106

Einleitung

- 3 -

Abbildungsverzeichnis:

Abbildung 1: statische Webseite... 10

Abbildung 2: clientseitige Technologien - JavaScript ... 15

Abbildung 3: clientseitige Technologien - JavaApplets ... 18

Abbildung 4: serverseitige Technologien ... 22

Abbildung 5: PHP Sessionsverwaltung - Anlehnung an Williams/Lane... 25

Abbildung 7: serverseitige Technologien - ASP.NET... 32

Abbildung 8: serverseitige Technologien - PHP Statistik ... 34

Abbildung 9: serverseitige Technologien PHP Zend Engine ... 35

Abbildung 10: serverseitige Technologien - Java Servlet... 37

Abbildung 11: serverseitige Technologien - Servlets vs. CGI... 38

Abbildung 12: serverseitige Technologien - ColdFusion MX Webserver ... 39

Abbildung 13: serverseitige Technologien - Rich Internet Applications ... 40

Abbildung 14: DeZign Tool Entitäten Kursverwaltung ... 51

Abbildung 15: DeZign Tool - m:n Beziehung ... 52

Abbildung 16: DeZign Tool - Schlüsselattribute... 53

Abbildung 17: DeZign Tool - DB-spezifische Datentypen ... 55

Abbildung 18: DeZign Tool - Import ER MySQL ... 57

Tabellenverzeichnis:

Tabelle 1: Client- und Serverseitige Technologien... 9

Tabelle 2: HTTP Request Aufbau... 11

Tabelle 3: HTTP Response Aufbau ... 12

Tabelle 4: Vergleich Scriptsprachen Perl, Python, Tcl ... 29

Tabelle 5: authoring tools... 42

Tabelle 6: Entwicklungswerkzeuge - Linklisten... 44

Tabelle 7: Entwicklungswerkzeuge - Codegeneratoren... 45

Tabelle 8: Anforderungen an Kursverwaltungssystem... 49

Tabelle 9: Datenbankunterstützung in Visual Studio .NET... 57

Tabelle 10: CodeCharegStudio Erweiterung der Funktionalitäten der Seiten... 88

Einleitung

- 4 -

1. Einleitung

1.1. Problemstellung

Die Fortschritte in der Kommunikations- und Informationstechnik haben heute zu

einer Vielzahl von dynamischen Webapplikationen wie E-Commerce-Anwendungen

oder Content Management Systemen geführt. Kaum eine große Web-Site ob

Mobile.de oder Fokus Online kommt heute ohne Datenbank im Hintergrund aus.

Zwar hat die New Economy im Frühjahr 2000 einen Technologiecrash erlitten, aber

der nächste Boom kann sie wieder beleben. ,,Die kurzfristigen Auswirkungen einer

neuen Technik werden meist überschätzt und die langfristigen unterschätzt", wird der

Science-Fiction-Autor und Technologieexperte Arthur C. Clarke in der Zeitung ,,Die

Zeit" zitiert.

Das Wachstum und die Komplexität im Bereich der dynamischen Webanwendungen

nimmt zu. Die Geschäftsanforderungen wie knappe Budgets, enge Termine und die

Flächigkeiten der Entwickler verlangen aber nach einfachen Technologien.

RAD-Tools (Rapid-Application-Development-Tools) versuchen die Spannung unter

diesen Randbedingungen zu mindern. Leider gibt es noch relativ wenig Literatur,

die sich dem Einsatz von visuellen Werkzeugen zur schnellen Entwicklung von

Webbapplikationen beschäftigt.

Motiviert durch die beschriebene Situation versucht die vorliegende Arbeit, einen

möglichst breiten und praxisorientierten Überblick über die eingesetzten Techniken

zur Entwicklung von dynamischen Web-Anwendungen zu schaffen.

Ziele dieser Arbeit sind:

Beschreibung der verbreiteten Techniken und Scriptsprachen im WWW.

Beschreibung der Werkzeuge zur visuellen Entwicklung von dynamischen

Webanwendungen

Beurteilung der zwei ausgewählten Werkzeuge anhand der Entwicklung von

einer Webanwendung.

Fischermann / New Economy - Revolution im zweiten Anlauf

http://www.zeit.de/2003/42/Vorabdruck_II

Einleitung

- 5 -

1.2. Vorgehensweise

Kapitel 2, Technologien und Architekturen von Webanwendungen, beschäftigt sich

mit verschiedenen Sprachen und Techniken aus dem Bereich

Internetprogrammierung, die heute im Web eingesetzt werden, um dynamische

Applikationen zu entwickeln. Dabei erfolgt die Einordnung der wichtigsten

technischen Standards und Spezifikationen rund ums Internet.

Kapitel 2.1 definiert den Begriff ,,dynamische Webanwendung".

Kapitel 2.2 beschreibt die clientseitigen-, Kapitel 2.3 die serverseitigen

Webtechnologien. Kapitel 2.3 macht eine Beurteilung der Techniken im Hinblick auf

die Entwicklung von einer Beispielanwendung in den Kapiteln 4, 5 und 6.

Kapitel 3, Entwicklungswerkzeuge für dynamische Webanwendungen, gibt einen

Überblick über die am Markt verfügbaren Tools. Anschließend erfolgt die

Fokussierung auf RAD (Rapid Applikation Development) Werkzeuge, die eine

visuelle Anbindung von Datenbanken erlauben.

Im Kapitel 4, Datenbankenwicklung für das Kursverwaltungssystem, wird eine

relationale Datenbank für die Beispielanwendung ,,Kursverwaltungssystem"

entwickelt. Der Aufbau wird durch das DbDezign Werkzeug unterstützt.

Kapitel 5, Entwicklung der Anwendung mit Dreamweaver MX, schildert die

Vorgehensweise bei der Entwicklung von einem Kursverwaltungssystem mit dem

Tool Dreamweaver MX. Das Kursverwaltungssystem ist ein kleines ein Mann

Projekt, das mit visuellen RAD-Werkzeugen entwickelt wird. Deswegen empfiehlt

sich hier als Vorgehensweise ein so genanntes ,,Intuitives Programming", d.h. man

hat Anfanges keine präzise Vorstellung über die Funktionalität des Systems. Häufig

konkretisieren sich die Zielvorstellungen erst im Laufe des Projekts, bzw. werden

durch das Entwicklungswerkzeug beeinflusst.

Kapitel 6, Entwicklung der Anwendung mit CodeChargeStudio, erörtert die

Entwicklung der gleichen Beispielanwendung ,,Kursverwaltungssystem" mit einem

Einleitung

- 6 -

weiteren Werkzeug Namens CodeChargeStudio. Ziel ist es, das Verstehen und den

Nachvollzug der Vorgehensweise zur erfolgreichen Entwicklung der konkreten Web

Applikation zu schaffen.

Kapitel 7, Resümee, beurteilt den Einsatz der RAD-Werkzeuge und macht ein

Vergleich zwischen Dreamweaver und CodeCargeStudio.

Einleitung

- 7 -

1.3. Zitierung

Die Fülle der Technologien, die für die Entwicklung von dynamischen Webseiten

eingesetzt werden, ist riesengroß. Eines der Ziele dieser Diplomarbeit war es, einen

Überblick über die wichtigsten Technologien zu schaffen und die

Dokumentationsquellen aufzuzeigen.

Auf folgende Informationsquellen wurde in der Diplomarbeit referenziert:

Requests For Comments (RFCs) [RFC] sind Dokumente für technische

Standards im Internet. Sie werden mit fortlaufenden Nummern seit den

Anfangstagen des ARPANET geführt. Internet Engineering Task Force

[IETF] ist die zuständige Organisation für die Verwaltung.

Recommendations des W3-Konsortiums [W3C]

Man unterscheidet folgende Entwicklungsstadien der Dokumentation

Working Drafts Candidate Recommendation Proposed Recommendation

Recommendation

Die HTML 4.0 Specification hat zum Beispiel normativen Charakter,

während DOM Level 2 CSS nur informativer Natur ist.

Anbieter-Dokumentationen

Technologien wie Coldfusion, Flash, ASP sind herstellerspezifisch und

werden oft von Anbietern auf den Entwickler-Seiten dokumentiert. Auch

Open Source Projekte wie PHP stellen sehr gute Dokumentationen bereit, die

die Verbreitung dieser Technik unterstützten.

Freie Dokumentation (aus dem Internet)

Gibt man einen Suchbegriff wie JAVA in eine Suchmaschine ein, so entdeckt

man eine Fülle von Material - Webseiten, Vorlesungsunterlagen, Vorträge,

Linksammlungen, Anleitungen etc.

Fachbücher im Bereich der Entwicklung von dynamischen Webanwendungen

gibt es sehr viele. Da es sich meist um relativ neue Technologien im

Entwicklungsstadium handelt, haben die Bücher oft nur mangelhafte

Qualität. Für die Entwicklungswerkzeuge wie CodeChargeStudio (siehe

Kapitel 6) gibt es noch keine Fachbücher am Markt.

http://www.w3.org/TR/

Einleitung

- 8 -

Folgende Zitiertechniken fand ich für die Diplomarbeit sinnvoll:

RFCs, W3C Spezifikationen und anbieterspezifische Dokumentationen

werden in eckigen Klammern [] mit Endnoten am Ende der Arbeit

referenziert, z.B [HTML4.0]. Diese Zitiertechnik hat sich in der technischen

Fachliteratur zunehmend verbreitet.

Bücher werden ,,klassisch" mit Fußnoten und Seitenangabe zitiert.

Freie Dokumentationen aus dem Internet sind analog zu Büchern zitiert, statt

Seitenangaben erfolgt die Angabe der vollständigen Internetadresse und des

Abrufdatums.

Technologien und Architekturen von Webanwendungen.

- 9 -

Technologien und Architekturen von Webanwendungen.

2.1. Begriffsdefinition.

,,Eine Web-Anwendung ist ein Softwaresystem, das auf Spezifikationen des World

Wide Web Consortium (W3C) beruht und Web-spezifische Ressourcen wie Inhalte

und Dienste bereitstellt, die über eine Benutzerschnittstelle, den Web-Browser,

verwendet werden."

Im Web existieren drei Arten von Dokumenten:

statischen,

clientseitig und

serverseitig erzeugte Dokumente.

Statische Dokumente sind die einfachsten Dokumente, wie z.B. einfache HTML-

Dokumente, MP3-Clips oder PDF-Dateien. Die letzten beiden Arten (clientseitig und

serverseitig erzeugte Dokumente) bezeichnet man auch als dynamische Dokumente

oder dynamische Webanwendungen, da sie jeweils auf die Bedürfnisse des Clients

zugeschnitten werden.

Nachfolgende Tabelle zeigt einen Überblick über die wichtigsten Techniken zur

Erzeugung von dynamischen Webanwendungen, die in diesem Kapiteln beschreiben

werden.

Clientseitige Technologien

Serverseitigen Technologien

JavaScript (serverseitige

JavaScript nicht behandelt)

Flash Coldfusion

JavaApplets

JavaServlets, JSP, EJB

ActiveX ASP,

ASP.Net

CGI (Perl, TCL, Python)

PHP

Tabelle 1: Client- und Serverseitige Technologien

Kappel, Pröll, Reich, Retschitzegger (Hrsg)/ Web Engineering / S. 2

Vgl. Günther /PHP ein praktischer Einstieg/ 21 f.

Technologien und Architekturen von Webanwendungen.

- 10 -

2.2.

Statische Webseiten und Grundlagen der HTTP Kommunikation

An Beispiel einer statischen Webseite wird nachfolgend das Prinzip von HTTP

[HTTP1.1] erläutert. HTTP hat die Aufgabe, ein gemeinsam verständliches Schema

für die Datenübertragung zu definieren.

Dadurch kann der eine

Kommunikationspartner die Informationen des anderen auswerten. Daten und

Informationen werden dabei in einem so genannten Multimedialen Hypertext

Dokument präsentieret. Dieses wird mit Hilfe von HTML [HTML4.01]

beschrieben.

Webbrowser

Request

Response

Webserver

test.html

<html>

</head>

<body>

<h1>eine Testseite</h1>

</body>

</html>

Abbildung 1: statische Webseite

Vgl. Rahm, Vossen /Web & Datenbanken: Konzepte, Architekturen, Anwendungen/ S.101 f.

Technologien und Architekturen von Webanwendungen.

- 11 -

Schritt 1:

Der Webbrowser eines Clients schickt einem Server einen Request nach einem

Objekt. (Voraussetzung dafür ist der Aufbau einer TCP/IP Verbindung [TCPIP]).

Ein Objekt ist üblicherweise eine Webseite, die der Client über URL [URL] im Form

von Dienst://Server/Verzeichnis/Datei identifiziert.

Ein HTTP Request könnte für Server wie folgt aussehen:

GET /test.html HTTP/1.1

Host: www.web.de

User-agent: Mozilla/4.0

Accept: text/html, application/pdf , image/gif ...

Header

Erläuterung

GET /test.html HTTP/1.1

Document Protokolversion

Host: www.web.de

Name des Hosts, an den der Client sich zu

wenden glaubt

User-agent: Mozilla/4.0

Browser-Kennung (hier Internet Explorer)

Accept: text/html, application/pdf ,

image/gif ...

Von Browser akzeptierte Formate in Form

MIME (Multipurpose-Internet-Mail-

Extension-Standrd)[MIME]

Tabelle 2: HTTP Request Aufbau

Schritt 2:

Der Server prüft den eingehenden HTTP-Request

(existiert die angeforderte Datei?

Prüfen der Zugriffsberechtigung,

Prüfen des MIME-Typs der angeforderten Datei)

Technologien und Architekturen von Webanwendungen.

- 12 -

Schritt 3:

Der Server schickt dem Client einen HTTP-Response zurück. Der HTTP-Response

könnte für den Client wie folgt aussehen:

HTTP /1.1 200 OK

Server: Apache /2.0 (NT)

Content-type: text/html

<html>

<h1>eine Testseite</h1>

</html>

Header

Erläuterung

HTTP /1.1 200 OK

Protokoll-Version / Statuscode /Erläuterung

Server: Apache /2.0 (NT)

Servertyp und Betriebssystem

Content-type: text/html

Formatbeschreibung des gesendeten

Dokumentes in Form MIME

</head> ...

Auf eine Leerzeile folgt das Objekt, hier

HTML Dokument

Tabelle 3: HTTP Response Aufbau

Schritt 4: Darstellung im Browser des Clients

Auf der Basis von MIME entscheidet der Browser ob er die gesendete Bytefolge

selber interpretiert (wie im Beispiel MIME-Typ Content-type: text/html) oder

andere Hilfswerkzeuge, zum Beispiel Application/pdf zur Interpretation und

Darstellung auf dem Bildschirm aufruft. Bei der Kommunikation müssen sich die

Beteiligten darauf einigen, ob der Empfänger (Webbroser: Accept: text/html,

application/pdf , image/gif ...) den Mime-Type akzeptiert, den der Sender

(Webserver: Content-type: text/html) senden will. Moderne Browser akzeptieren in

der Regel jeden Mime-Typ und bieten dem Anwender einfach an, falls sie den

Mime-Typ nicht kennen, die zu empfangenden Daten als Download-Datei

abzuspeichern.

Übersicht der HTTP-Statuscodes wie 403 Forbidden/ 404 not found in RFC 1945 und 2068

Vgl. Münz /SELFHTML/ Diverse technische Ergänzungen/MIME-Typen

http://selfhtml.teamone.de/diverses/mimetypen.htm

Technologien und Architekturen von Webanwendungen.

- 13 -

2.3. Clientseitige

Technologien.

Zur Erzeugung von clientseitigen dynamischen Dokumenten werden hauptsächlich

die nachfolgend beschriebenen Technologien JavaScript, Flash, Java(Applets) und

ActiveX verwendet.

Frank Braun

schreibt zum Thema clientseitige Technologien:

,,Technisch gesehen gibt es Scriptsprachen (JavaScript, JScript, VBScript,

ActionScript) und Plugins (Java /JRE , Macromedia ShockWave Flash).

Systematisch kann man Seitengestaltung und Seiteninhalt unterscheiden:

Seitengestaltung: Durch Interaktion mit dem Browserbenutzer wird die Seite von

mitgelieferten Programmen/Programmteilen (JavaScript) auf Mausbewegungen

umgestaltet. Seiteninhalt: Durch mitgelieferte Programme (JavaApplets) wird der

Seiteninhalt überhaupt erst bestimmt (berechnet)."

Die strikte Teilung in clientseitige und serverseitige dynamische Webanwendungen

ist nicht immer aufrechtzuerhalten: JavaScript und ActiveX sind auch auf dem Server

einsetzbar, Flashentwickler Macromedia hat sich in den neusten Entwicklungen Rich

Internet Applikationen (integrierte Client-Server Technologie, Vgl. Kap 2.4.5.) auf

die Fahnen geschrieben.

Braun / Interaktive Webseiten /

http://www.uni-regensburg.de/EDV/kurs_info/brf09510/2003/s03istoff.phtml

Technologien und Architekturen von Webanwendungen.

- 14 -

2.3.1. JavaScript

Bei Webseiten mit JavaScript sollte man genau genommen von dynamischen

Webseiten, aber von statischen Webanwendungen sprechen, da die Seiten ohne

Änderungen an den Browser gesendet und erst im Client verändert werden.

,,Dynamisches HTML ist JavaScript für Browser ab Version 4". Diese Definition

nennt Christian Wenz

im Buch ,,JavaScript - Browserübergreifende Lösungen" als

eine Art kleinster gemeinsamer Nenner aller konkurrierenden Beschreibungen.

JavaScript ist also die bekannteste Clientseitige Skriptsprache.

JavaScript Code wird in HTML-Dokumente integriert, und ermöglicht die

Veränderung der Elemente eines HTML-Dokuments.

JavaScripts werden nicht kompiliert, sondern werden von einem JavaScript-

Interpreter (der sogenannten "Sandbox"), der in den Browser integriert ist,

interpretiert.

Javascript ist keine vollwertige Programmiersprache wie zum Beispiel Java: sie kann

keine Verbindung zu Datenbanken aufnehmen, ihre Interaktion mit

Systemressourcen ist sehr eingeschränkt, und sie kann die meisten für die

datenbankbasierte Webanwendung erforderlichen Aufgaben nicht erfüllen.

Allerdings ist JavaScript sehr geeignet zum Umgang mit Formularen und zur

Steuerung der Anzeige von Daten für den Benutzer.

Die typischen Aufgaben von JavaScript sind also:

Dynamik in HTML-Dokumente bringen (Roll-Over-Buttons, Pull-Down-Menüs)

Browser-Attribute verändern (neue Fenster, Fenstergröße etc)

dynamisches Bewegen von Layern

Erstes Prüfen von Formulardaten auf dem Client und ggf. Fehlermeldung

Christian Wenz /JavaScript - Browserübergreifende Lösungen/

Vgl. Williams, Lane /Web Datenbank Applikationen mit PHP und MySQL/ S. 315 f.

Technologien und Architekturen von Webanwendungen.

- 15 -

Ein JavaScript Beispiel:

Webbrowser

Request

Response

Webserver

test.html

<html>

<script

type="text/javascript">

<!--

alert("ein Test");

//-->

</script>

</head>

<body>

</body>

Abbildung 2: clientseitige Technologien - JavaScript

Die Interaktion zwischen dem Browser und dem Server ist analog einer statischen

Webseite. Das im Hypertest zusätzlich eingebettete JavaScript wird zur Laufzeit vom

Web-Browser interpretiert.

Technologien und Architekturen von Webanwendungen.

- 16 -

Stefan Münz beschreibt in SelfHTML

die Entwicklung von JavaScript und DOM

wie folgt:

,, JavaScript ist eine Sprache, die 1995 von Netscape eingeführt und lizenziert wurde.

Unter dem Namen ECMAScript [ECMA] ließ sich Netscape von EMCA (European

Computer Manufacturers Association) JavaScript als Industriestandard deklarieren.

In der Spezifikation "ECMA-262" wurde dieser Standard festgeschrieben.

Microsoft entwickelte gleichzeitig die eigene Sprachvariante JScript[JScript].

Wegen Gerangel zwischen Netscape und Microsoft um die bessere JavaScript-

Unterstützung wurde das "Doppeltprogrammieren" zur lästigen Pflicht.

Um diesem Missstand auf Dauer abzuhelfen, wurde das W3-Konsortium

eingeschaltet, damit eine allgemeine Sprachnorm entsteht.

Das W3-Konsortium

erarbeitete dabei jedoch keinen konkreten JavaScript-Standard, sondern ein

allgemeines Modell für Objekte eines Dokuments. Dieses Modell sollte eine

Scriptsprache, die sich als Ergänzungssprache zu Auszeichnungssprachen wie

HTML versteht, vollständig umsetzen. Vom W3-Konsortium erhielt das Modell die

Bezeichnung DOM - Document Object Model [DOM]... Die JavaScript-Version, die

DOM erstmals umsetzt, ist die Version 1.5."

Die getesteten Werkzeuge Dreamweaver MX und CodeChargeStudio unterstützen

das Implementieren von clientseitigen JavaScript-Code. In Kap 5.5.12 wird darauf

eingegangen. Schwerpunkte dieser Diplomarbeit sind eindeutig serverseitig erzeugte

dynamische Webanwendungen.

Münz /SELFHTML/

http://selfhtml.teamone.de/javascript/intro.htm

Technologien und Architekturen von Webanwendungen.

- 17 -

2.3.2. Flash

Flash ist ein von Macromedia entwickeltes propriäteres Format für skalierbare

Vektorengrafiken. Es macht Animationen interaktiv; der Betrachter kann sich in den

Ablauf der Filmchen einmischen. Die Bilder sind meist als Vektordaten abgelegt und

lassen sich daher verlustfrei vergrößern oder verkleinern. Mit der Möglichkeit,

Musik abzuspielen, ist Flash das Format der Wahl für Filme und Animationen mit

Musikuntermalung bei vergleichsweise geringen Dateigrößen. Mit Hilfe der

eingebauten Programmiersprache ActionScript gelingen Kreativen mit ein wenig

Programmierwissen sogar richtige Spiele.

Das W3C Konsortium bietet zwei XML-basierte Alternativen zum Flash:

SVG [SVG] und SMIL [SMIL], die in Verbindung mit JavaScript und DOM

ähnliche Möglichkeiten eröffnen. Doch leider werden die modernen Browser mit

Flash-Plugins ausgeliefert, sind aber noch nicht ohne weiteres in der Lage, SVG oder

SMIL zu verarbeiten. Und solange es kein Autorenwerkzeug dafür gibt, das auch

solche Web-Entwickler anspricht, die keinen Quelltext am Bildschirm ertragen

können, werden es diese Standards schwer haben gegen Erscheinungen wie Flash.

Zugriff auf Datenbanken wird im Kapitel 2.4.5. behandelt.

Vgl.Clemens Gleich /Das bewegte Web: Techniken für dynamische und animierte Netzseiten

http://www.heise.de/ct/02/03/090/default.shtml

Vgl. Münz /SELFHTML/

http://selfhtml.teamone.de/intro/technologien/flash.htm

Technologien und Architekturen von Webanwendungen.

- 18 -

2.3.3. JavaApplets

Die Technologieanbieter von Java, Sun Microsystems, beschreiben Applets wie

folgt: ,,An applet is a program written in the Java programming language that can be

included in an HTML page, much in the same way an image is included. When you

use a Java technology-enabled browser to view a page that contains an applet, the

applet's code is transferred to your system and executed by the browser's Java Virtual

Machine (JVM)."

Im Folgenden wird der Client-Server Kommunikationsvorgang beschrieben und in

der Abbildung 3 veranschaulicht:

Request

Response

mit Applet

Webbrowser

JVM

Java Virtual

Machine

Webserver

test.html

<html>

<object

classid= "java:dbzugriff.class"

codetyte="application/java">

</object>

</html>

dbzugriff.class

Datenbank

JDBC

API

JDBC

oder

SQLJ

ausführbare

Applet-Datei

Der Webbrowser des

Clients schickt einem

Server einen Request

nach einer HTML Datei,

die auf ein Java-Applet

als Objekt verweist.

Der Webserver schickt

das HTML Dokument

und das Java-Applet an

den Webbrowser zurück.

Die HTML Seite ist also

nur notwendig, um das

Applet zu laden.

Hat der Client die

passende

Laufzeitumgebung

(z.B. JRE-version 1.3),

so wird

Abbildung 3: clientseitige Technologien - JavaApplets

JavaApplets

http://java.sun.com/applets/

Technologien und Architekturen von Webanwendungen.

- 19 -

das Applet von dieser ausgeführt, falls nicht, sollte man in der HTML Datei

eine automatische Umleitung auf Download von Plug-In ermöglichen.

Das Applet baut ggf. eine dauerhafte JDBC Verbindung zum

Datenbankserver auf. Das führt dazu, dass die Verarbeitung von

Formulardaten und Sessionsmanagement keine Rolle mehr spielen, da sie aus

dem Verbindungslosen HTTP Protokoll resultieren.

JavaApplets ermöglichen nicht nur ein Verändern der Browser-Attribute oder

Animationen wie JavaScript, sondern auch einen Zugriff auf Datenbanken. Die

Verbindung kommt dabei nicht über HHTP zustande, sondern über ein eigenes

Protokoll wie JDBC API

Setzt man Java-Applets im Intranet ein, so könnte man die Clients mit Java Plug-In

ausstatten und auf Webserver und Browser ganz verzichten. Ergebnis wäre ein so

genannter ,,dicker" Client, der die Anwendungslogik enthält, die Serverschicht ist

das DBMS selbst. Die Vorteile einer solchen Lösung sind die Möglichkeiten des

Entwurfs ganz speziell auf Anforderungen angepassten Lösungen.

Auch andere Vorteile gegenüber serverseitigen Technologien sind mit den Applets

realisierbar:

dauerhafte Datenbankverbindung (Wegfall von Sessionsmanagement, siehe

Kap 2.4)

Plattformunabhängigkeit (Laufzeitumgebung ist auf alle Betriebssystemen

installierbar)

Hohe Performance (durch direkte Kommunikation mit der Datenbank ohne

den Umweg über den Webserver)

Die oben genannten Vorteile werden wie folgt relativiert:

auf dem Client muss ein geeignetes JRE [JRE] installiert sein.

(zwar ist ein automatischer Download möglich, jedoch könnten z.B. fehlende

Administrationsrechte die Installation verhindern)

Vgl. Rahm, Vossen /Web & Datenbanken: Konzepte, Architekturen, Anwendungen/ S.107

Java Plug-in Technology

http://java.sun.com/products/plugin/index.jsp

Krüger /Handbuch der Java-Programmierung/

http://www.javabuch.de/

Technologien und Architekturen von Webanwendungen.

- 20 -

Das Applet kann keine Eingaben aus HTML-Formularen übernehmen oder

Resultate in solche einfügen. (Umweg über JavaScript ist plattformabhängig

möglich).

Sicherheitsproblematik führt zu einem Leistungsproblem (Beim Laden von

Applets prüft der Browser, ob der Client gewisse Sicherheitsbedingungen wie

Verbot von Lesen/Schreiben der Daten auf dem lokalen Datensystem erfüllt)

Nach einigen Jahren zeichnet sich jedoch ab, dass Java für alle möglichen Zwecke

gut geeignet ist, dass es aber im Web nicht die Dominanz erreicht hat, die von Sun

ursprünglich einmal erhofft wurde.

Die Gründe dafür sind zum einen die Tatsache,

dass Microsoft die Unterstützung für aktuelle (momentan Version 1.4) Java-

Varianten mit Stand JDK1.1 eingestellt hat. Was die Sprachgrundlage anbelangt, ist

das kein Beinbruch, aber die Datenbankprogrammierung ist bei diesem Stand erst

rudimentär verfügbar, an Transaktionen oder Read-Only-Resultsets ist dabei

überhaupt nicht zu denken.

Zum anderen erfolgt die Verdrängung von JavaApplets aus dem Internet durch Flash

bei solchen Anwendungen wie Animationen, Effekte, oder Online-Spiele.

Vgl. Münz /SELFHTML.

http://selfhtml.teamone.de/intro/technologien/java.htm

Vgl. Hinrichs /Web-Datenbanken/ S.580

Technologien und Architekturen von Webanwendungen.

- 21 -

2.3.4. ActiveX

Die Webopedia

definiert die AktiveX Technologie:

"A loosely defined set of technologies developed by Microsoft. ActiveX is an

outgrowth of two other Microsoft technologies called OLE (Object Linking and

Embedding) and COM (Component Object Model)."

ActiveX ist kein Internet-Standard im herkömmlichen Sinn, sondern der Versuch,

spezifische Eigenschaften des MS-Windows-Betriebssystems für Web-Seiten

nutzbar zu machen. So ist es mit Hilfe von ActiveX beispielsweise möglich,

Eingaben aus HTML-Formularen einer Web-Seite über die OLE-Schnittstelle von

Windows direkt in eine Excel-Tabelle oder eine Access-Datenbank einzulesen (oder

umgekehrt). ActiveX-Controls benutzen nämlich die OLE-Schnittstelle von

Windows, um mit ihrer Umgebung zu kommunizieren.

ActiveX basiert auf der Möglichkeit, wieder verwendbare Softwarekomponenten in

binärer Form mit standardisierten Interfaces bereitzustellen, die von verschiedenen

Client-Programmen genutzt werden können. Diese Softwarekomponenten müssen

dem so genannten COM-Standard (Component Object Model) entsprechen. Dabei ist

es völlig egal, in welcher Programmiersprache die Controls geschrieben worden sind,

es sind also ActiveX-Controls in Visul Basic, C oder sogar Java denkbar.

Der Vorteil gegenüber Java-Applets ist die Geschwindigkeit der (auf Windows

optimierten) ActiveX- Technik. Nachteilig ist das Fehlen von Sandboxing (Prüfen

von Sicherheitsbedingungen). Es gibt nur einen Vertrauenscheck auf Basis einer

digitalen Signatur. Dieses Verfahren macht aber keine Aussage über die

Funktionsweise der Software selbst und ob sie gewollt oder ungewollt

(Programmierfehler) schadensstiftende Wirkung entfalten kann.

ActiveX-Komponenten stellen, da sie keinerlei Einschränkungen bzgl. der Windows-

und System-Funktionalität unterliegen, ein immenses Sicherheitsrisiko dar.

www.wewopedia.com

Münz /SELFHTML/

http://selfhtml.teamone.de/intro/technologien/activex.htm

Bundesamt für Sicherheit in der Informationstechnik (BSI) /Ausführbare Inhalte

Sicherheitsrisiken und Lösungen

http://www.bsi.bund.de/fachthem/sinet/literatddos/aktivinh.htm

Landeszentrum für Datenschutz Schleswig-Holstein

http://www.datenschutzzentrum.de/selbstdatenschutz/safer/browser/actcntnt/activex.htm

Technologien und Architekturen von Webanwendungen.

- 22 -

2.4. Serverseitige

Technologien

Abbildung 4 zeigt die

Schematische Darstellung der

serverseitigen Technologien -

der Server gestaltet automatisch

vor dem Absenden die Seite

individuell.

Webbrowser

http://www.localhost/test.php?kurs_id=2

Request

Response

Schrittweise Beschreibung

erfolgt auf den Seiten 25 bis 29.

Webserver test.php

<html>

Datenbanktreiber

Datenbank

<?php

include db.inc

$query = SELECT *

FROM kurs WHERE

kurs_id =

$HTTP_GET_VARS

['kurs_id']

echo `query'

</html>

<html>

Organisation

</html>

CGI /Apache API /ISAPI/ NSAPI

Perl/ PHP/ JSP/ ASP/

Coldfusion /...

Response

Request

(Datensatz)

(Abfrage)

Abbildung 4: serverseitige Technologien

Details

Seiten
Erscheinungsform: Originalausgabe
Jahr: 2004
ISBN (eBook): 9783832481681
ISBN (Paperback): 9783838681689
DOI: 10.3239/9783832481681
Dateigröße: 2.2 MB
Sprache: Deutsch
Institution / Hochschule: Fachhochschule Regensburg – Betriebswirtschaft
Erscheinungsdatum: 2004 (August)
Note: 1,7
Schlagworte: internet datenbanken skriptsprachen rad-tools

Autor

Nikolas Shewlakow (Autor:in)

Werkzeuge zur Entwicklung von dynamischen Web-Anwendungen

Zusammenfassung

Leseprobe

Inhaltsverzeichnis

Details

Autor

Nikolas Shewlakow (Autor:in)