2. Webapplikationen. Webzugang. Präsentation. Geschäftslogik. Browser. Datenhaltung. JSP, Servlets, ASP, PHP. HTML + JavaScript? +Java Applets?

Größe: px

Ab Seite anzeigen:

Download "2. Webapplikationen. Webzugang. Präsentation. Geschäftslogik. Browser. Datenhaltung. JSP, Servlets, ASP, PHP. HTML + JavaScript? +Java Applets?"

Elsa Kerner
vor 6 Jahren
Abrufe

1 1 2. Webapplikationen Web Client Präsentation HTML + JavaScript? +Java Applets? Browser Cookies HTTP mit HTML+Cookies HTTP mit Formularinhalt und Cookie Server Webzugang JSP, Servlets, ASP, PHP Geschäftslogik EJB, PHP,... ggf. JDBC Datenhaltung RDBMS

2 2 2.1 HTML Markup -Sprache zur Beschreibung von Struktur ( Tags), Inhalt und ggf. Layout einer Webseite bietet u.a.: Text, Listen, Tabellen, Verweise, Bilder, Frames, Formulare für jede HTML-Version eigene vordefinierte Dokumenten-Typ-Definition (DTD) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> Aufbau eines HTML-Dokuments: ASCII-Datei mit Inhalt, Tags und Meta-Informationen u.a. für Suchmaschinen Meta-Informationen: Autor, Schlüsselworte, verwendeter Editor, Klassifikation WYSIWYG-Webseiten-Tool (z.b. Frontpage) setzt Tags automatisch ein

3 Die wichtigsten Tags Beispiele siehe Web-Seite Tagname Funktion <HTML>... </HTML> deklariert eine HTML-Seite <HEAD>... </HEAD> enthält den Kopf der HTML-Seite <TITLE>... </TITLE> definiert den Titel der Seite <BODY>... </BODY> enthält den Körper der HTML-Seite <Hn>... </Hn> definiert eine Überschrift der Ebene n <B>... </B> setzt... in Fett-Schrift <I>... </I> setzt... in Kursiv-Schrift <UL>... </UL> bzw. beschränkt eine ungeordnete Liste, <OL>... </OL> bzw. eine nummerierte Liste <LI> Beginn eines Listeneintrags <BR> erzwingt eine neue Zeile <P> beginnt einen neuen Absatz <HR> fügt eine horizontale Linie ein <PRE>... </PRE> vorformatierter Text; wird nicht umformatiert <IMG SRC= Adresse > lädt ein Bild <A HREF= URL >... </A> fügt einen Link mit der Beschreibung... ein <! > Kommentar

4 Cascading Style Sheets (CSS) Layout-Eigenschaften werden durch Tags festgelegt, z.b. <H2 ALIGN=center><FONT COLOR=red>Einleitung</FONT></H2> um diese nicht bei jedem Textelement wiederholen zu müssen, können Style-Sheets festgelegt werden, z.b. H2 {text-align: center; color: red} festlegbare Eigenschaften: Farbe, Font-Familie, Font-Stil (z.b. italic), Font- Größe, Zeichenabstand, Wortabstand, Text-Dekoration (z.b. underline, blink), horizontale und vertikale Ausrichtung und Einrückung, Hintergrund-Farbe bzw. -Bild usw.

5 5 Style-Sheets werden eingebunden über: 1) <LINK>-Tag im Head-Teil eines Dokuments <LINK REL=StyleSheet HREF="style.css" TYPE="text/css"> z.b. <STYLE TYPE="text/css"> url( </STYLE>

6 6 3) Einbettung des Styles in das Dokument, z.b. <STYLE TYPE="text/css">  </STYLE> 4) Inlining: schlecht, da keine Trennnung von Dokument und Layout, Bsp.: <H2 STYLE="color: red; text-align: center">einleitung</h2> bei widersprüchlichen Styles zählt die speziellere Festlegung stärker (Tag > 4) > 3) > 2) > 1) > Browser-Einstellung)

7 Formulare erlauben die interaktive Zusammenstellung von Informationen zur Übermittlung an einen Webserver Teil einer Web-Seite

8 8 Tags in Formularen 1) Beginn und Ende eines Formulars, z.b. <FORM ACTION="/cgi-bin/script1.pl" METHOD="GET">... </FORM> ACTION-Attribut definiert URL des Verarbeitungsprogramms METHOD-Attribut bestimmt Methode der Übertragung an den Server: GET: Eingaben werden als Teil der URL übertragen Zugriff aus CGI-Skript über Umgebungsvariablen QUERY STRING und/oder PATH INFO POST: Eingaben in Payload übertragen und über Standardeingabe an CGI- Skript geleitet

9 9 2) Text- und Passwort-Eingabe <INPUT TYPE=text" NAME="Kunde"> <INPUT TYPE=password" NAME="passwd"> 2) Knöpfe <INPUT TYPE="submit" VALUE="Abschicken"> <INPUT TYPE="image" SRC="bild.gif"> <INPUT TYPE="reset" VALUE="Formular löschen"> 3) Radio-Knöpfe und Ankreuzfelder <INPUT TYPE="radio" NAME="zahlungsmittel" VALUE="bar"> <INPUT TYPE="checkbox" NAME="mit Abendessen">

10 10 4) Menüs und Scroll-Listen <SELECT NAME="wohnort" SIZE=1> <OPTION>Telgte <OPTION>Greven </SELECT> bei SIZE > 1: Scroll-Liste (ggfs. MULTIPLE) 5) Textfelder <TEXTAREA ROWS=5 COLS=20 NAME="bemerkung"> </TEXTAREA> 6) Datei (mit Browser) auswählen und an Server schicken <INPUT TYPE="file" SIZE=20> Beispiele siehe Webseite

11 Cookies sind kurze Informationen, die der Client einer Seite zuordnet und lokal speichert (mit Verfallsdatum) verleihen dem Browser ein Gedächtnis z.b.: beim erneuten Besuch einer Web-Seite brauchen Informationen nicht neu eingegeben zu werden werden in HTTP-Nachricht an den Server mitübertragen werden bei der Übertragung i.allg. nicht geschützt

12 Bestandteile eines Cookies Domäne: erzeugender Webserver ( 20 Cookies pro Client und Domäne) Pfad im Dateibaum des Servers mit Programmen, die Cookie verwenden dürfen sicher?

12 12 Bestandteile eines Cookies Domäne: erzeugender Webserver ( 20 Cookies pro Client und Domäne) Pfad im Dateibaum des Servers mit Programmen, die Cookie verwenden dürfen sicher?: wenn ja: Cookie wird nur an sicheren Server weitergegeben bei Ablauf der gültig-bis -Zeit wird Cookie gelöscht entsprechendes Überschreiben erzwingt Löschen Anwendung: z.b. Warenkorb, benutzerbezogene Informationsaufbereitung, CRM (Benutzerprofile), Log-in-Informationen

13 Java-Applets 2.2 Client-seitige Programmlogik Applet-Tag wird eingebunden in Web-Seite das zugehörige Applet (d.h. eingeschränkte Java-Programmstück) wird vom Server geladen und beim Client ausgeführt ohne Einschränkungen könnten Applets beim Client Schäden anrichten daher: Java-Byte-Code wird von der abstrakten Maschine JVM interpretiert unsichere Operationen werden hierbei abgefangen (z.b. keine Festplattenzugriffe, Kommunikation nur mit dem Server) Applets erweitern Web-Seiten um die Ausdruckskraft einer Programmiersprache (insbesondere auch: Grafik, Audio)

14 JavaScript von Netscape entwickelte Skriptsprache typischer Einsatz in Web-Seiten Java-ähnliche Syntax JavaScript-Programmstücke werden vom Browser beim Client ausgeführt erlaubt Interaktion zwischen Web-Seite und Benutzer ohne Rückgriff auf den Server

15 15 Skripte können: Formulare validieren html-seiten generieren die Browserumgebung ändern (Farbe,... ) html-dokumente laden Web-Seiten Benutzer- bzw. Umgebungs-abhängig aufbereiten mit Java (sowie VRML und Plug-ins) interagieren (LiveConnect) Beispiele siehe Web-Seite

16 16 Was kann JavaScript nicht? lokale Dateien lesen oder schreiben Netzwerk-Operationen (außer Web-Seiten laden) Multithreading

Ähnliche Dokumente

Inhalt HTML 2. Applets Frames Formulare CSS cascading style sheets. Lehrveranstaltung Internet in AT Dr.-Ing. A. Braune TECHNISCHE UNIVERSITÄT DRESDEN

Inhalt HTML 2. Applets Frames Formulare CSS cascading style sheets. Lehrveranstaltung Internet in AT Dr.-Ing. A. Braune TECHNISCHE UNIVERSITÄT DRESDEN Inhalt HTML 2 Applets Frames Formulare CSS cascading style sheets SS 06 1 Applets Das Applet Java Applets sind kleine Java-Programme mit deren Hilfe aktive Webseiten erstellt werden können. werden mit