Seminar Enterprise Application Integration Web Fundamentals Timir Kanti Ganguly Betreuer: Professor Mitschang

Semainar Web fundamentals Übersicht Das Web als verteiltes Hypertextsystem Protokolle des Internets (TCP/IP) Universal Resource Identifier (URI) Hypertext Transfer Protocol 1.1 (HTTP/1.1) HTML Grundlagen Semainar Web fundamentals

Semainar Web fundamentals Geschichte des WWW Beginn 1990 in Genf im European Laboratory for Particle Physics (CERN) Mitbegründer britischer Informatiker Tim Berners-Lee Zweck: Informationsaustausch zwischen Wissenschaftlern Projekt beruht auf 2 Säulen: neues Dateiformat : HTML neues Internet-Protokoll : HTTP Semainar Web fundamentals

Das Web als verteiltes Hypertextsystem Multimedia verschiedene Medientypen Hypermedia Kombination von Multimedia und Hypertext Verteilung drei Stufen: innerhalb einer Datei innerhalb eines Dateisystems innerhalb eines Netzwerks Semainar Web fundamentals

Netzschichten Internet-Anwendungen Anwendungsschicht Internet (TCP/IP) Internet-Schicht Netzwerk Netzwerkschicht Semainar Web fundamentals

Protokolle des Internets (1) Internet Protocol (IP): verbindungsunabhängiges optimiertes Protokoll zur Paketübermittlung Routen, Zerlegen und das Zusammensetzen der Pakete 32Bit (4 Byte) Struktur für Adressen 4 Milliarden Hosts auf 16,7 Millionen Netzwerken adressierbar Beispiel für IP-Adresse 129.69.18.18 erster Teil der IP-Adresse ist die Netzwerknummer zweiter Teil die Hostnummer Grenze wird durch Klassifizierungsschema für Netzwerktypen bestimmt Semainar Web fundamentals

Protokolle des Internets (2) Klasse -A-, -B- und -C- Netze: - Klasse-A-Adressen: 1.xxx.xxx.xxx bis 126.xxx.xxx.xxx - Klasse-B-Adressen: 128.xxx.xxx.xxx bis 191.xxx.xxx.xxx - Klasse-C-Adressen: 192.xxx.xxx.xxx bis 223.xxx.xxx.xxx121331222222222222 Private Netzwerke : - 10.0.0.0 bis 10.255.255.255 - 172.16.0.0 bis 172.16.255.255 - 192.168.0.0 bis 192.168.255.255 Semainar Web fundamentals

Protokolle des Internets (3) Transmission Control Protocol (TCP) TCP setzt auf IP auf sorgt für verläßliche, verbindungsorientierte Kommunikation TCP fügt jeder IP-Adresse eine Port-Nummer hinzu Semainar Web fundamentals

Universal Resource Identifier (URI) offizieller Name für Identifier innerhalb des Webs URI entweder URL (Uniform Resource Locator) oder URN (Uniform Resource Name) URN zur Zeit noch in Entwicklung Semainar Web fundamentals

Uniform Resource Locator (URL) besteht aus Schema und schemaspezifischem Teil: "//"[Benutzer[":"Kennwort]"@"]host[":"port]"/"urlpath Schemata: ftp: File Transfer Protocol http: Hypertext Transfer Protocol https: HTTP over SSL maito: verwendet SMTP um E-Mails zu verschicken telnet: zum Zugriff auf einen Host Bsp: ftp://benutzername:pass@ftp.domain.de:21/pfad/ Semainar Web fundamentals

Hypertext Tranfer Protocol 1.1 einfaches auf verläßlichen verbindungs-orientiertem Transportdienst aufbauendes Request/Response-Protokoll verwendet dazu die Rollen Client und Server 1. Request an den Server Client Server 2. Response an den Client Semainar Web fundamentals

Semainar Web fundamentals HTTP-Nachrichten verfügen über äußerst einfaches Interaktionsschema zwischen Client und Server Format der beiden Nachrichtentypen (Request und Response) ebenfalls sehr einfach erste Nachricht einer HTTP-Interaktion nach erfolgreichem Verbindungsaufbau ist immer eine Request Message vom Client an den Server die zweite Nachricht ist immer eine Response vom Server an den Client Semainar Web fundamentals

Semainar Web fundamentals Nachrichtenformat (1) generic-message = start-line *message-header CRLF [message-body] start-line = request-line | status-line Semainar Web fundamentals

Semainar Web fundamentals Nachrichtenformat (2) start-line entweder request-line oder status-line danach null oder mehrere Header-Felder aus den folgenden vier Gruppen: General Header Entity Header Request Header Response Header Semainar Web fundamentals

Statuscodedefinitionen jede in einer HTTP-Response Message enthaltene Statuscode besteht aus einer dreistelligen Zahl: Informational (1xx) Successful (2xx) Redirection (3xx) Client Error (4xx) Server Error (5xx) Semainar Web fundamentals

Semainar Web fundamentals Sicherheit bei HTTP (1) Unterscheidung zwischen zwei Aspekten: Authentifizierung des Clienten: zwei Möglichkeiten: Basic Authentication und DigestAccess Authetication sichere Übertragung der Daten zwischen Client und Server zwei Möglichkeiten: Secure HTTP (S-HTTP) und HTTP über SSL (HTTPS) Semainar Web fundamentals

Semainar Web fundamentals HTTP über SSL Ansatz: sichere Transportinfrastruktur durch zusätzliche Schicht zwischen TCP/IP-Schicht und HTTP als Anwenderprotokoll HTTP FTP Telnet andere SSL TCP/IP Semainar Web fundamentals

Semainar Web fundamentals Cookies HTTP ist zustandsloses Protokoll, d.h. vorangegangene Interaktionen zwischen Client und Server haben keinen Einfluss aus nachfolgende Interaktionen Cookie: zwischen Client und Server ausgetauschte Informationen zum Aufrechterhalten eines Zustands => Herstellung einer logischen Sitzung Semainar Web fundamentals

Semainar Web fundamentals HTML Grundlagen HTML wurde 1990 erfunden aktuelle Version ist 4.0 HTML (Hypertext Markup Language) ist eine sogenannte Auszeichnungssprache HTML hat die Aufgabe, die logischen Elemente (z.B. Überschriften, Textabsätze, Listen, Tabellen, Grafikreferenzen) eines Dokuments zu beschreiben HTML basiert auf SGML (Standard Generalized Markup Language) Semainar Web fundamentals

Grundlegender Aufbau eines HTML-Dokuments <HEAD>-Abschnitt des Dokuments <BODY>-Abschnitt des Dokuments Semainar Web fundamentals

Semainar Web fundamentals Document Head (1) enthält Informationen über das Dokument Titel einer HTML Datei: <head> <title>Titel</title> ...andere Angaben im Dateikopf... </head> Adreßbasis (base URI): <head><base href="http://www.ganguly.de">....</head> Semainar Web fundamentals

Semainar Web fundamentals Document Head (2) Metadaten eines Dokuments <head> <meta name="description" content="Dieser Beschreibungstext soll einem Anwender im Suchdienst bei Auffinden dieser Datei erscheinen"> <meta name="author" content="Name des Autors"> <meta name="keywords" content="HTML, Meta-Informationen, Suchprogramme, HTTP-Protokoll"> <meta name="date" content="2000-07-17T09:59:58+00:00"> ... andere Angaben im Dateikopf ... </head> Semainar Web fundamentals

Semainar Web fundamentals Document Body enthält den eigentlichen Teil des Document Contents <body>-Tag kann verschiedenene Attribute enthalten, darunter auch „onload“ und „onunload“ Farbe für Hintergrund, Texte und Links: <body bgcolor=#663333 text=#FFCC99 link=#FF9966 vlink=#FF9966 alink=#FFFFFF> Hintergrundbild: <body background="kacheln.gif"> Semainar Web fundamentals

HTML Grundlagen für Textdarstellung (1) Überschriften: HTML unterscheidet 6 Überschriftenebenen <h1>Überschrift 1. Ordnung</h1> <h3>Überschrift 3. Ordnung</h3> <h1 align=center>Überschrift 1. Ordnung</h1> <h3 align=right>Überschrift 3. Ordnung</h3> <h4 align=justify>Überschrift 4. Ordnung</h4> Semainar Web fundamentals

HTML Grundlagen für Textdarstellung (2) Textformate: <tt> stellt Text als Fernschreiber- oder als Konstantenschrift dar <i> stellt Text kursiv dar <b> stellt Text fett dar <big> stellt Text in einer "großen" Schriftart dar <small> stellt Text in einer "kleinen" Schriftart dar <strike> und <s> stellen Text durchgestrichen dar <u> stellt Text unterstrichen dar <pre> erzeugt vorformatierten Text, d.h. der Browser zeigt den Text so an wie er im Quelltext steht, es werden mehrere Leerzeichen und Zeilenumbrüche beachtet Semainar Web fundamentals

HTML Grundlagen für Textdarstellung (3) Schriften: <basefont face="Verdana">Ab hier alles in Verdana, nur <font face= "Avalon">hier nicht</font>Hier wieder alles in Verdana <font size=1>Ziemlich winziger Text</font> <font size=+1>Text etwas größer als normal</font> <font color=#FFFFFF>Weißer Text</font> <font color="white">Weißer Text</font> <font face="Avalon,Wide Latin">Das ist Text in Schriftart Avalon, oder, falls Avalon nicht darstellbar, in Wide Latin </font> Semainar Web fundamentals

HTML Grundlagen für Textdarstellung (4) Deutsche Umlaute und scharfes S: ä für ä und ß für ß Beispiel: In München steht ein Hofbräuhaus. Dort gibt es Bier aus Maßkrügen. Horizontale Linien: <hr> Zeilenumbrüche: <br> Textabsätze: <p> und </p> Semainar Web fundamentals

Semainar Web fundamentals Listen drei Listentypen Unordered Lists: <ul> und </ul> Listenelemente mit <li> und </li> Ordered Lists: <ol> und </ol> Definition Lists: <dl> und </dl> zu definierender Ausdruck: <dt> und </dt> Definition: <dd> und </dd> Semainar Web fundamentals

Semainar Web fundamentals Tabellen <table border=3 align=center> <tr><td align=center height=50>links oben</td> <th colspan=2 width=500><th colspan=2></th></tr> <tr><th rowspan=2><th rowspan=2></th> <td>Inhalt 1</td><td>Inhalt 2</td></tr> <tr><td bgcolor=#efefef>Inhalt 3</td align=right><td>Inhalt4</td></tr> </table> Semainar Web fundamentals

Semainar Web fundamentals Bilder/Grafiken geeignete Dateiformate sind GIF und JPEG Beispiel: <img src="bild.gif" width=33 height=14 border=0 alt="Beschreibung"> Semainar Web fundamentals

Semainar Web fundamentals Links (Verweise) (1) stellen zu verschiedenen Zwecken nutzbare Verbindungen zwischen Informationen dar am häufigsten zum Verweis auf ein anderes Dokument es sind auch Verweise innerhalb eines Dokuments möglich als Verweisquelle neben Text auch Grafik möglich Semainar Web fundamentals

Semainar Web fundamentals Links (Verweise) (2) Beispiele: <a href="ziel.html">Verweistext</a> <a href="ziel.html" target=“Zielfenster">Verweistext</a> <a href="#Anker">Verweistext</a> <a href="ziel.html#Anker1"><img src=“bild.gif" alt="bild"></a> <a name="Anker"><h1>Überschrift 1</h1></a> <a name="Anker1"><img src="datei.gif"></a> <a href="mailto:timir@ganguly.de?subject=Feedback zum Seminar"> Mail an Timir, timir@ganguly.de</a> Semainar Web fundamentals

Semainar Web fundamentals Frames (1) Erfindung von Netscape offiziell erst seit HTML 4.0 Frames sind eigentlich eine Sammlung von Web-Seiten wird häufig verwendet, um Seiten so zu gestalten, damit sie Benutzerschnittstellen von Computerprogrammen ähneln Aufteilung in Inhalt und Inhaltsverzeichnis Semainar Web fundamentals

Semainar Web fundamentals Frames (2) Semainar Web fundamentals

Semainar Web fundamentals Formulare (1) mit HTML können Formulare erstellt werden Formulardaten können entweder per E-Mail zugeschickt werden oder von CGI-Programm auf dem Server bearbeitet werden Semainar Web fundamentals

Semainar Web fundamentals Formulare (2) Beispiel 1: <form action="mailto:timir@ganguly.de" method=post enctype="text/plain"> ... Elemente des Formulars wie Eingabefelder, Auswahllisten, Buttons usw. ... </form> Beispiel 2: <form action="/cgi-bin/auswert.pl" method=get> Semainar Web fundamentals

Semainar Web fundamentals

Semainar Web fundamentals Formulare (3) <form> Name:<input type=text size=50 maxlenght=50 name="Name"> Passwort: <input type=password name="Passwort" maxlength=10 size=10> <textarea name="Kommentar " rows=3 cols=20></textarea> <input type=radio name="Zahlmethode" value="Mastercard"> Mastercard <br> <input type=radio name="Zahlmethode" value="Visa"> Visa <input type=submit value="Absenden"> <input type=reset value="Abbrechen"> </form> Semainar Web fundamentals

Semainar Web fundamentals Formulare (4) Beispiel: Semainar Web fundamentals

Semainar Web fundamentals Literatur [1] Erik Wilde, "World Wide Web", Springer 1999 [2] http://www.netzwelt.de/selfhtml [3] Naba Barkakati, RedHat 6.0 Linux, Franzis Semainar Web fundamentals