Internetbasierte Systeme Internetbasierte Systeme SS 2010 Michael Jäger 27. Juni 2010 1 / 446 Internetbasierte Systeme Internetbasierte Systeme SS 2010 Wie entwickle ich Software für das Web? http://www.w3.org http://www.denic.de 2 / 446 Internetbasierte Systeme Themen Thematischer Überblick Teil 1: Basiswissen Webprogrammierung XML & Co DOM – Document Object Model XML und Java HTML/XHTML Cascading Stylesheets (CSS) Javascript und Ajax HTTP und Webbrowser 3 / 446 Internetbasierte Systeme Themen Thematischer Überblick Teil 2: Java Enterprise Technologie – JEE Architekturmodell Java Server Pages (JSP) und Servlets Java Server Faces (JSF) Java Naming and Directory Interface (JNDI) Java Persistenz API (JPA) Java Enterprise Beans 4 / 446 Internetbasierte Systeme Themen Thematischer Überblick Teil 3: Einführung in Webservices Service-orientierte Architekturen (SOA) Webservices, SOAP und REST WSDL Webservice-Erweiterungen (WS-*) Geschäftsprozessmodellierung Java und Webservices 5 / 446 Internetbasierte Systeme Literatur Literatur „Basiswissen Web-Programmierung“ von Heide Balzert, W3L-Verlag 2007, 25 EUR „Java EE 5“ von Thomas Stark, Addison-Wesley/Pearson Studium 2007, 30 EUR Foliensammlung auf meiner WWW-Homepage (wird während des Semesters ergänzt) Die SELFHTML-Website: http://de.selfhtml.org Diverse Internet-Quellen (siehe Foliensammlung) 6 / 446 XML – Extensible Markup Language Teil II XML 7 / 446 XML – Extensible Markup Language 3 XML und Co. Einführung XML-Parser und andere Werkzeuge XML Syntax DTD - Dokumenttyp-Definitionen 4 XML Schema Language XML Schema – Einführung XML Schema – Namensräume XML Schema – Typsystem XML Schema – Import und Include 5 XSL XSL - Extensible Stylesheet Language XSL – XSLT XSL – XPath XSLT XSLT – Push- und Pull-Verarbeitung XSLT – Textblöcke XSLT – Default-Aktionen XSLT – Kontrollstrukturen XSLT – Kopieren von Strukturen 6 XML und Java Überblick JAXP - DOM JDOM und DOM4J JAXP - SAX JAXP Transformationen 8 / 446 XML – Extensible Markup Language XML und Co. XML & Co XML XPath XSLT DTD XML Schema XPointer 9 / 446 XML – Extensible Markup Language XML und Co. Einführung XML – Extensible Markup Language Markupsprache Meta-Sprache Standard des WWW-Konsortiums (W3C) Weiterentwickelt aus SGML Versionen: 1.0 (1998), 1.1 (2004) (Quelle: http://www.wikipedia.de) 10 / 446 XML – Extensible Markup Language XML und Co. Einführung XML-Familie Strukturspezifikation mit DTD und Schema XML-Schema zur Spezifikation der XML-Dokumentstruktur komplexes Typsystem Syntax XML-basiert DTD - Document Type Definition Technisch überholter Vorgängerstandard von XML-Schema rudimentäres Typsystem spezielle Syntax aber: DTDs noch sehr verbreitet 11 / 446 XML – Extensible Markup Language XML und Co. Einführung XML-Familie XSL – Transformation und Präsentation von XML XSL – XML Stylesheet Language Sprachfamilie: Oberbegriff für XSLT und Co. XSLT – XSL Transformations Regelbasierte Sprache zur Transformation von XML-Dokumenten XPath Sprache zur Selektion von Dokumenten-Substrukturen XSL-FO – Formatting Objekts Formatspezifikationen zur Erzeugung von Printmedien 12 / 446 XML – Extensible Markup Language XML und Co. Einführung Beispiel für ein XML-Dokument <?xml version="1.0" encoding="UTF-8" standalone="yes"?> <buch autor="Wilhelm Busch"> <titel> Max und Moritz </titel> <kapitel id="1"> Erster Streich. </kapitel> <kapitel id="2"> Zweiter Streich. </kapitel> </buch> Syntax: Verarbeitungsanweisungen Tags (Auszeichnungen) Elemente Attribute 13 / 446 XML – Extensible Markup Language XML und Co. Einführung Syntax, Wohlgeformtheit und Gültigkeit Element- und Attributnamen frei wählbar keine vordefinierte Bedeutung (im Gegensatz zu HTML!). Wohlgeformtes Dokument: Tag-Schreibweise und Klammerstruktur stimmen Gültiges Dokument: Aufbau entspricht Schema bzw. DTD 14 / 446 XML – Extensible Markup Language XML und Co. XML-Parser und andere Werkzeuge XML-Parser: Strukturanalyse von XML-Dokumenten I Aufgaben Wohlgeformtheit und Gültigkeit gegen Schema/DTD prüfen Methoden zur Weiterverarbeitung bereitstellen Basis für XSLT Ausprägungen: Standalone-Parser integriert in Webbrowser (z.B. „Expat“ in Firefox) integriert in Entwicklungsumgebung in Programmiersprachen-Bibliotheken als API-Komponente 15 / 446 XML – Extensible Markup Language XML und Co. XML-Parser und andere Werkzeuge XML-Parser: Strukturanalyse von XML-Dokumenten II Analysetechnik DOM-Parser erzeugen DOM-Baum SAX-Parser feuern Ereignisse Stream-Parser (ereignis- und programmgetriebene Analyse) 16 / 446 XML – Extensible Markup Language XML und Co. XML-Parser und andere Werkzeuge XML-Editoren und -Entwicklungsumgebungen unterstützen Erstellung von XML, DTD, Schema Unterstützung für XSLT und CSS Beispiel: „netbeans“ integrierte Open-Source Entwicklungsumgebung mit guter XML-Funktionalität (http://netbeans.org) 17 / 446 XML – Extensible Markup Language XML und Co. XML-Parser und andere Werkzeuge Sonstige XML-Werkzeuge XSLT-Prozessoren: Regelbasierte Transformation von Dokumenten serversseitig: z.B. saxon, Apache Xalan Webbrowser: z.B. Firefox-Komponente TransforMiiX FOP-Prozessoren: Erzeugung von PDF, Postscript, PCL z.B. Apache FOP (Formatting Objects Processor) XML-Toolkit: XML-Verarbeitung auf Kommandozeile (http://xmltk.sourceforge.net) 18 / 446 XML – Extensible Markup Language XML und Co. XML Syntax Syntax: Bestandteile des XML-Dokuments XML-Deklaration sonstige Verarbeitungsanweisungen (optional) Wurzelement Kern des Dokuments repräsentiert „fachliche Nutzdaten“ beliebig komplex Kommentare (optional) 19 / 446 XML – Extensible Markup Language XML und Co. XML Syntax XML-Deklaration und andere Verarbeitungsanweisungen XML-Deklaration: Metainformationen für XML-Parser <?xml version="1.0" encoding="UTF-8" standalone="yes"?> Metainformationen für XSLT-Transformation <?xml-stylesheet type="text/xsl" href="adressbuch.xsl"?> 20 / 446 XML – Extensible Markup Language XML und Co. XML Syntax XML-Element Bestandteile: Start-Tag, Inhalt, End-Tag <buch isbn="2-675-54877-X"> ... </buch> Element-Inhalt: leer einfacher Text Unterelemente gemischter Inhalt <br></br> oder <br /> <name>Harry Hirsch</name> <name><vn>Harry</vn><nn>Hirsch</nn></name> Start-Tag: Elementname, beliebige Attribute Attributwerte immer in Apostrophen Groß-/Kleinschreibung wird unterschieden leeres Element = Element mit leeren Inhalt 21 / 446 XML – Extensible Markup Language XML und Co. XML Syntax Textinhalt mit XML-Sonderzeichen Problem XML-Sonderzeichen im Textinhalt verwirren Parser Lösung: Ersatzdarstellung Ersatzdarstellung &amp; &apos; &quot; &lt; &gt; Sonderzeichen & ’ " < > englische Bezeichnung „ampersand“ „apostrophe“ „quotation mark“ „less than“ „greater than“ 22 / 446 XML – Extensible Markup Language XML und Co. XML Syntax Textinhalt mit XML-Sonderzeichen CDATA-Abschnitte Problem Lange Text-Inhalte mit vielen XML-Sonderzeichen Lösung: CDATA-Blöcke <![CDATA[ Dieses <Tag> wird nicht als Tag interpretiert ]]> 23 / 446 XML – Extensible Markup Language XML und Co. XML Syntax Kommentare im XML-Dokument Syntax-Beispiel <!-- dies ist ein XML-Kommentar --> An welcher Stelle? außerhalb des Wurzelements im Wurzelement: überall, wo Text-Inhalt erlaubt ist ein- oder mehrzeilig gehören logisch nicht zum Dokument Prozessor darf Kommentare „verschlucken“ 24 / 446 XML – Extensible Markup Language XML und Co. XML Syntax Adressbuch-Beispiel I Datei: adressbuch.xml 1/2 <?xml version="1.0" encoding="UTF-8" ?> <!-- Adressbuch Version 1.0 --> <adressbuch aktualisiert="1.4.2008" version="2"> <adresse> <vorname>Hugo</vorname> <nachname>Meier</nachname> <strasse>Waldweg 7</strasse> <plz>35231</plz> <ort>Dinkelsdorf</ort> <email>[email protected]</email> <tel typ="mobil">0160/987654</tel> </adresse> 25 / 446 XML – Extensible Markup Language XML und Co. XML Syntax Adressbuch-Beispiel II Datei: adressbuch.xml 2/2 <adresse> <titel>Sir</titel> <vorname>Edward</vorname> <nachname>McDonerty</nachname> <strasse>Bergstrasse 13a</strasse> <plz>76522</plz> <ort>Burgstadt</ort> <tel typ="zuhause">08945/23456</tel> <privatkontakt /> </adresse> </adressbuch> 26 / 446 XML – Extensible Markup Language XML und Co. DTD - Dokumenttyp-Definitionen DTD - Dokumenttyp-Definitionen DTD definiert syntaktische Struktur eines Dokuments Pro Element: zulässige Attribute Pro Element: Struktur (leer, einfach, Unterelemente) DTD direkt im XML-Dokument DTD als separate Datei DTD verwendet spezielle Syntax, d.h. keine XML-Syntax 27 / 446 XML – Extensible Markup Language XML und Co. DTD - Dokumenttyp-Definitionen DTD-Beispiel: Adressbuch <!-- Dateiname: adressbuch01.dtd --> <!ELEMENT adressbuch (adresse+)> <!ATTLIST adressbuch stand CDATA #REQUIRED version CDATA #IMPLIED> <!ELEMENT adresse (titel?, vorname, nachname, strasse, plz, ort, email?, tel+, privatkontakt?)> <!ELEMENT titel (#PCDATA)> <!ELEMENT vorname (#PCDATA)> <!ELEMENT nachname (#PCDATA)> <!ELEMENT strasse (#PCDATA)> <!ELEMENT plz (#PCDATA)> <!ELEMENT ort (#PCDATA)> <!ELEMENT email (#PCDATA)> <!ELEMENT tel (#PCDATA)> <!ATTLIST tel typ CDATA #REQUIRED> <!ELEMENT privatkontakt EMPTY> 28 / 446 XML – Extensible Markup Language XML und Co. DTD - Dokumenttyp-Definitionen Elementstruktur in der DTD Syntax: <!ELEMENT Elementname Strukturspezifikation > Varianten der Strukturspezifikation: leere Elemente: EMPTY einfache Elemente: (#PCDATA) („parsed character data“ = einfacher Text) strukturierte Elemente: Liste mit Strukturspezifikationen für direkte Unterelemente <!ELEMENT adresse (titel?, vorname, nachname, strasse, plz, ort, email?, tel+, privatkontakt?)> 29 / 446 XML – Extensible Markup Language XML und Co. DTD - Dokumenttyp-Definitionen DTD-Syntax für strukturierte Elemente Elementname = genau ein Element Elementname? = Element ist optional Elementname* = beliebige Sequenz von Elementen (ggf. leer) Elementname+ = nichtleere Sequenz von Elementen Syntaktische Alternativen: |-Operator, z.B. <!ELEMENT postadresse (wohnadresse | postfach)> <!ELEMENT wohnadresse (strasse, hausnummer) > <!ELEMENT postfach (#PCDATA)> 30 / 446 XML – Extensible Markup Language XML und Co. DTD - Dokumenttyp-Definitionen Attribute in der DTD Pro Element: beliebig viele Attribut-Definitionen <!ATTLIST Elementname Attribute > Attribute: Sequenz von Attributdefinitionen mit Attributname Typ (z.B. CDATA) ggf. Zusatzangaben (z.B. #REQUIRED) Beispiel: <!ATTLIST adressbuch stand CDATA #REQUIRED version CDATA #IMPLIED> Reihenfolge der Attribute spielt keine Rolle! 31 / 446 XML – Extensible Markup Language XML und Co. DTD - Dokumenttyp-Definitionen Attributtypen Zeichenketten: CDATA Aufzählungstypen, z.B. <!ATTLIST adresse kategorie (freunde | beruf | golfclub)> NOTATION-Typen für externe Formate (z.B. Bildformate) <!ATTLIST person icon NOTATION (gif | jpg) #IMPLIED> ID, IDREF, IDREFS für eindeutige Bezeichner ENTITY, ENTITIES – für die Verwendung von Makros NMTOKEN, NMTOKENS – Zeichenketten mit erweitertem Zeichenvorrat (gegenüber CDATA) 32 / 446 XML – Extensible Markup Language XML und Co. DTD - Dokumenttyp-Definitionen Zusatzangaben in der Attributdefinition #REQUIRED (Pflichtattribut) #IMPLIED (optionales Attribut, Standard) Attributwert (Defaultwert) #FIXED Attributwert (fester Wert) 33 / 446 XML – Extensible Markup Language XML und Co. DTD - Dokumenttyp-Definitionen Beispiel: DTD und passendes Dokument <!ELEMENT buchbestand (buch+)> <!ATTLIST buchbestand version CDATA #FIXED "1.0" sprache CDATA "deutsch"> <!ELEMENT buch (autor, titel, inhalt)> <!ATTLIST buch kategorie (Sachbuch | Fachbuch | Roman) "Fachbuch" isbn ID #REQUIRED neuauflageVon IDREF "null"> <buchbestand sprache="spanisch"> <buch isbn="2-675-54877-X"> ... </buch> <buch isbn="2-675-54856-X" neuauflageVon="2-675-54877-X"> ... <buch kategorie="Roman" isbn="3-456-98982-X"> ... </buch> ... 34 / 446 XML – Extensible Markup Language XML und Co. DTD - Dokumenttyp-Definitionen Beispiel: DTD direkt im XML-Dokument DOCTYPE-Deklaration enthält DTD <!DOCTYPE adressbuch [ <!ELEMENT adressbuch ... <!ATTLIST adressbuch ... <!ELEMENT adresse ... ... ]> <adressbuch ... <adresse ... ... </adressbuch> 35 / 446 XML – Extensible Markup Language XML und Co. DTD - Dokumenttyp-Definitionen Trennung von DTD und Dokument DTD: adressbuch.dtd <!ELEMENT adressbuch ... <!ATTLIST adressbuch ... <!ELEMENT adresse ... ... Dokument: adressbuch.xml DOCTYPE-Deklaration verweist auf DTD <!DOCTYPE adressbuch SYSTEM "adressbuch.dtd"> <!-- hier lokale Datei, alternativ: URL der entfernten DTD --> <adressbuch ... <adresse ... ... </adressbuch> 36 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Einführung XML Schema XML Schema: Universell verwendete Metasprache XML Schema ist die eigentliche Metasprache innerhalb der XML-Familie. Anwendungsbereich Mit XML Schema definiert man Syntax und Typen für Dokumenten-, Daten- und Dateiformate, domänenspezifische Sprachen, Programmiersprachen. 37 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Einführung XML-Schema: Anwendungsbeispiele Definition domänenspezifischer Sprachen XHTML, JSP (Java Server Pages), BPEL (Geschäftsprozessmodellierung) Geschäftsdokumente Auftrag, Lieferschein, Rechnung, Kundenkontakt, „Elektronische Patientenakte“ (Klinikinformationssystem) Technische Anwendungen Nachrichtenformat (SOAP), Vektorgraphikformat (SVG), Speicherformat für Office-Dokumente (OpenOffice), Deployment-Deskriptoren (JEE/Tomcat) 38 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Einführung Schema – Grundlegende Merkmale Ein Schema definiert komplexe Datenstrukturen Typsystem mit vordefinierten und benutzerdefinierten Typen XML-Syntax: Schema ist selbst XML-Dokument Wiederverwendbarkeits- und Modularisierungskonzepte W3C-Standard (http://www.w3.org/XML/Schema) Nutzung mehrerer Schemas im selben XML-Dokument Tutorial http://www.w3.org/TR/xmlschema-0 39 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Einführung Aufbau eines Schemas Ein Schema ist eine Definitionssammlung Ein Schema ist eine Sammlung globaler Definitionen: Elemente, Typen und Attribute. Ein Schema ist ein Namensraum Die Definitionen eines Schemas bilden in der Regel(!) einen weltweit eindeutigen Namensraum Ein Schema ist selbst ein XML-Dokument „flachere Lernkurve“ durch bekannte einfache Basissyntax Einsatz von XML-Tools (validieren, visualisieren, in Datenbanken abspeichern . . . ) 40 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Einführung Struktur und Verwendung eines Schema-Dokuments Schema: adressbuch.xsd <?xml version="1.0" encoding="utf-8"?> <xsd:schema xmlns:xsd="http://www.w3.org/2001/XMLSchema"> ... Definitionen </xsd:schema> Verwendung: adressbuch.xml: <?xml version="1.0" encoding="utf-8"?> <adressbuch xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="adressbuch.xsd"> ... </adressbuch> 41 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Mit XML Schema definiert man Namensräume Problem: Namenskollisionen in einem XML Dokument Ein Schema ist ein separat entwickelte Komponente Ein Dokument benutzt mehrere Schemas (Import und Nutzung von Element- und Attributdefinitionen) Eindeutigkeit aller Element- und Attributnamen im Dokument nötig Ohne modulares Sichtbarkeitskonzept: Kollisionen unvermeidbar 42 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Kollisions-Szenario Schema A definiert „Kunde“ mit Unterelement „Nummer“ (Kundennummer) Schema B definiert „Auftrag“ mit Unterelement „Nummer“ (Auftragsnummer) „Rechnung“ benutzt beides Namenskonflikt zwischen beiden „Nummer“-Elementen Lösung: Benannte Namensräume / qualifizierte Bezeichner <kunde:nummer> ... </kunde:nummer> ... <auftrag:nummer> ... </auftrag:nummer> 43 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Merkmale von XML-Namensräumen Namensraum-Definition Definition durch Schema als „target namespace“ Sammlung von Definitionen (Elemente, Attribute, Typen) Namensraum-Import und -Nutzung Verwendung in jedem XML-Dokument (→ auch in einem Schema!) Jedes Element kann Namensräume importieren und nutzen Element vererbt seine Namensräume an seine Kinder und Attribute Import-Deklaration: Pseudoattribut „xmlns“ 44 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Verwendungsbeispiel SOAP SOAP: XML-basiertes Transportprotokoll für Webservices Webservices kommunizieren mittels SOAP-Nachrichten W3C definiert Nachrichtenformat als Namensraum "http://www.w3.org/2003/05/soap-envelope" SOAP-Nachricht <env:Envelope xmlns:env="http://www.w3.org/2003/05/soap-envelope"> <env:Header> ... </env:Header> <env:Body> ... </env:Body> </env:Envelope> 45 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Beispiel zur Verwendung zweier Namensräume <bestellung xmlns:produkt="http://localhost/XML/produkt" xmlns:kunde="http://localhost/XML/kunde" > <produkt:nummer>p49393</produkt:nummer> <produkt:name>JXY Rasierer VC100</produkt:name> <produkt:menge>1</produkt:menge> <produkt:preis waehrung="Euro">69,--</produkt:preis> <kunde:nummer>k2029</kunde:nummer> <kunde:name>Meier, Fritz</kunde:name> <kunde:lieferadresse>Hauptstr. 4, 80111 Hof </kunde:lieferadresse> </bestellung> Namensraum-URI: http://localhost/XML/produkt Kurzname: „produkt“ „bestellung“ gehört zu keinem Namensraum 46 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Namensraumbezeichner Namensraumbezeichner ist ein eindeutiger URI Verwendungsstelle definiert Kurznamen zum URI Kurzname redefinierbar und löschbar reservierte Kurznamen mit Sonderfunktion: beginnen mit „xml“ (z.B. xmlns) Kurznamen-Konventionen für Standardnamensräume Beispiel: xsd - Namensraumkürzel für Schema-Definitionen 47 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Default-Namensraum: Weglassen des Namensraumkürzels Schreibvereinfachung für einen Namensraum Jedes Element kann einen Default-Namensraum definieren Syntax: xmlns=Namensraum-URI Elementnamen ohne Namensraum-Angabe: Default-Namensraum Attributnamen ohne Namensraum-Angabe: kein Namensraum Begriff: Qualifizierter Name Qualifiziert = „gehört zu einem Namensraum“ Explizit: durch Namensraumkürzel Implizit: durch Default-Namensraum 48 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Beispiel für Default-Namensraum: „produkt“ <bestellung xmlns="http://localhost/XML/produkt" xmlns:kunde="http://localhost/XML/kunde"> <nummer>p49393</nummer> <name>JXY Rasierer VC100</name> <menge>1</menge> <preis waehrung="Euro">69,--</preis> <kunde:nummer>k2029</kunde:nummer> <kunde:name>Meier, Fritz</kunde:name> <kunde:lieferadresse>Donnerbalkenstr.14, 80111 München </kunde:lieferadresse> </bestellung> Namensraum-URI: http://localhost/XML/produkt Kurzname fehlt → Default-Namensraum „bestellung“ gehört zum Default-Namensraum 49 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Redefinieren und Löschen des Default-Namensraums <Vectra xmlns="http://www.opel.com/"> <Karosserie>...</Karosserie> <Motor xmlns="http://www.generalmotors.com/"> <!-- Motor gehört zu "http://www.generalmotors.com/" --> ... </Motor> <!-- zurück bei Opel --> <Rad>...</Rad> </Vectra> <Vectra xmlns="http://www.opel.com/"> <Karosserie>...</Karosserie> <Motor xmlns=""> <!-- Motor gehört zu keinem Namensraum --> ... </Motor> ... 50 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Definition eines Namensraums Namensraum-Definition: „targetNamespace“ Schema-Wurzelement xsd:schema hat optionales Attribut „targetNamespace“ Attributwert: Namensraum-URI des vom Schema definierten Namensraums Namensraum beinhaltet: Alle globalen Definition des Schemas <xsd:schema xmlns:xsd="http://www.w3.org/2001/XMLSchema" targetNamespace="http://www.meyer.com/my"> ... Weiterführender Artikel: http://www.oracle.com/technology/pub/articles/srivastava_namespaces.html 51 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Schema-Adressen im Dokument Validierung von Dokumenten: Schema-Adresse? Namensraum-URI ist keine Schema-Adresse! Schema-Adresse wird separat angegeben (optional) Schema-Adresse ermöglicht Validierung 52 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Attribut xsi:schemaLocation String, repräsentiert eine Liste von Paaren: Namensraum-URI (identisch zum URI im xmlns-Attribut) Adresse des zugehörigen Schemas (URI oder Dateipfad) <adressbuch xmlns:="http://www.meinedomaene.de/schema/adressbuch" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation= "http://www.meinedomaene.de/schema/adressbuch adressbuch.xsd"> ... </adressbuch> Attribut xsi:noNamespaceSchemaLocation Schema-Adresse für Namensraum-freie Bezeichner 53 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Qualifikation von Namen aus Namensraum Namensräume: Qualifikationspflicht für globale Namen Die Toplevel-Definitionen eines Schemas heißen „global“, die anderen „lokal“ Globale Namen müssen immer qualifiziert werden: explizit: durch Namensraumkürzel oder implizit: durch Zugehörigkeit zum Default-Namensraum 54 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Namensräume Schema bestimmt Qualifikationspflicht für lokale Namen lokale Namen: Namensraum kann aus übergeodnetem Element bestimmt werden Schema fordert oder verbietet Qualifikation: einheitlich für alle Elemente: einheitlich für alle Attribute: (elementFormDefault= . . . ) (attributeFormDefault= . . . ) <?xml version="1.0" encoding="US-ASCII"?> <schema xmlns="http://www.w3.org/2001/XMLSchema" xmlns:tns="http://www.library.com" targetNamespace="http://www.library.com" elementFormDefault="qualified" attributeFormDefault="unqualified"> 55 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Merkmale des Typsystems Typen für Elemente und Attribute einfache und komplexe Typen vordefinierte und benutzerdefinierte Typen Einfache und komplexe Typen Attribut: einfacher Typ Element mit Attributen: komplexer Typ Element mit Unterelementen: komplexer Typ 56 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Element-Definition Definition eines Elements mit anonymem komplexen Typ <xsd:element name="adresse"> <xsd:complexType> <xsd:sequence> <xsd:element name="titel" type="xsd:string" minOccurs="0" maxOccurs="1"> <xsd:element name="vorname" type="xsd:string" /> <xsd:element name="nachname" type="xsd:string" /> ... </xsd:sequence> </xsd:complexType> </xsd:element> 57 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Typdefinition und Verwendung Typdefinition <xsd:complexType name="adressTyp"> <xsd:sequence> <xsd:element name="titel" type="xsd:string" minOccurs="0" maxOccurs="1" /> <xsd:element name="vorname" type="xsd:string" /> <xsd:element name="nachname" type="xsd:string" /> ... </xsd:sequence> </xsd:complexType> Verwendung <xsd:element name="adresse" type="adressTyp"> 58 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Attribut-Definitionen Adressbuch mit 3 Attributen <xsd:element name="adressbuch"> <xsd:complexType> <xsd:sequence> <xsd:element name="adresse" type="adressTyp" maxOccurs="unbounded"> </xsd:sequence> <xsd:attribute name="aktualisiert" type="xsd:date" use="required" /> <xsd:attribute name="version" type="xsd:string" use="default" value="1.0" /> <xsd:attribute name="sprache" type="xsd:language" use="optional" /> </xsd:complexType> </xsd:element> 59 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Verwendungsstellen von Typen Element-Definitionen Attribut-Definitionen (nur einfache Typen!) Typdefinitionen (z.B. als „extension“-Basistyp) 60 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Vordefinierte Typen für XML-Schemata (Auswahl) xsd:string anyURI: Uniform Resource Identifier (URI) xsd:decimal language: Sprachbezeichnung (de-DE, en-US, fr) xsd:integer ID: eindeutiger Bezeichner (Identifier) xsd:float IDREF: Verweis auf ID xsd:boolean xsd:date xsd:time 61 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Wichtige Konstruktoren für benutzerdefinierte Typen einfache Typen xsd:list xsd:restriction xsd:enumeration xsd:union Werteliste Wertebereich einschränken Aufzählungstyp Vereinigung von Wertemengen komplexe Typen xsd:sequence xsd:all xsd:choice Unterelemente in fester Reihenfolge Unterelemente mit beliebiger Reihenfolge Varianten für Unterelemente 62 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Definition einfacher Typen: Einschränkungen Einschränkung des Wertebereichs <xsd:simpleType name="SmallIntTyp"> <xsd:restriction base="xsd:integer"> <xsd:minInclusive value="1" /> <xsd:maxInclusive value="100" /> </xsd:restriction> </xsd:simpleType> Einschränkung durch regulären Ausdruck <xsd:simpleType name="ArtikelNrTyp"> <xsd:restriction base="xsd:string"> <xsd:pattern value="[X|Y|Z]\s\d{3}-\d{5}" /> </xsd:restriction> </xsd:simpleType> 63 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Definition einfacher Typen: Aufzählungstypen Aufzählung mit xsd:restriction <xsd:simpleType name="FarbeTyp"> <xsd:restriction base="xsd:string"> <xsd:enumeration value="rot" /> <xsd:enumeration value="gelb" /> <xsd:enumeration value="blau" /> </xsd:restriction> </xsd:simpleType> 64 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Definition einfacher Typen: Wertelisten Listentyp <xsd:simpleType name="FarblisteTyp"> <xsd:list itemType="FarbeTyp" /> </xsd:simpleType> eingeschränkter Listentyp <xsd:simpleType name="DreiFarbenTyp"> <xsd:restriction base="FarblisteTyp"> <xsd:length value="3" /> </xsd:restriction> </xsd:simpleType> 65 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Definition einfacher Typen: Vereinigung von Wertemengen union-Typ <xsd:simpleType name="IntOderDecimalTyp"> <xsd:union memberTypes="int decimal" /> </xsd:simpleType> 66 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Abgeleitete komplexe Typen Einschränkung und Erweiterung Restriction Restrictions repräsentieren immer Teilmengen des Basistyps Diverse Einschränkungen möglich, z.B. Komponententyp einschränken optionale Komponenten weglassen min/max-Occurs einschränken Alle Komponenten (Subelemente, Attribute) des neuen Typs explizit deklarieren! 67 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Abgeleitete komplexe Typen Einschränkung und Erweiterung Extension Hinzufügen von Elementen/Attributen Basistyp kann simpler oder komplexer Typ sein Extension eines einfachen Typs: komplexer Typ, falls Attribute dazukommen Bei Extension nur zusätzliche Attribute und Elemente deklarieren! 68 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Komplexer Restriction-Typ Basistyp abgeleiteter Typ <xsd:complexType name="Fahrzeug"> <xsd:sequence> <xsd:element name="ps" type="xsd:positiveInteger"/> <xsd:element name="geschw" type="xsd:positiveInteger"/> <xsd:/sequence> <xsd:/complexType> <xsd:complexType name="LKW"> <xsd:complexContent> <xsd:extension base="Fahrzeug"> <xsd:sequence> <xsd:element name="nutzlast" type="xsd:positiveInteger"/> .... </xsd:sequence> </xsd:extension> </xsd:complexContent> </xsd:complexType> 69 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Typen im Instanzdokument: xsi:type XML-Dokument verwendet Schema-Typen <auto:lieferliste xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:auto="http://www.autofabrik.com/auto" datum="2009-12-12"> <lieferung xsi:type="auto:PKWTyp"> ... </lieferung> <lieferung xsi:type="auto:LKWTyp"> ... </lieferung> </auto:lieferliste> Generischer Typ im Schema, abgeleiteter Typ im Dokument Typ im Schema: „lieferung“ hat generischen Typ z.B. „FahrzeugTyp“ oder „xsd:anyType“ Typ im Dokument: „lieferung“ hat abgeleiteten Typ: „PKWTyp“ bzw. „LKWTyp“ 70 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Typsystem Ausblick: XML-Vererbungskonzepte Abgeleitete Typen und xsi:type (siehe oben) Substitutionsgruppen (substitutionGroup-Attribut) (zur Modellierung von Vererbungsbeziehung zwischen Klassen) Abstrakte Elemente (abstract-Attribut) (zur Modellierung abstrakter Klassen) Finale Elemente und Typen (final-Attribut) (Einschränkung von Ableitungen) Substitutionsverbote (block-Attribut) 71 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Import und Include Modularisiertes Schema: Import und Include include – Ein Namensraum auf mehrere Dateien verteilt Umfangreiche Namensräume: auf mehrere Dateien verteilen Zusammenfügen: include-Element in übergeordneter Schema-Datei <xsd:schema xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:pcParts="http://www.example.de/pcParts" targetNamespace="http://www.example.de/pcParts"> ... <xsd:include schemaLocation="http://www.example.de/schema/harddisk.xsd"/> <xsd:include schemaLocation="http://www.example.de/schema/ram.xsd"/> ... </xsd:schema> 72 / 446 XML – Extensible Markup Language XML Schema Language XML Schema – Import und Include Modularisiertes Schema: Include import – mehrere zusammengehörige Namensräume Schema-Module, die eigene Namensräume definieren Zusammenfügen: import-Element in übergeordneter Schema-Datei <xsd:schema xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:pcParts="http://www.example.de/pcParts" targetNamespace="http://www.example.de/parts"> ... <xsd:import namespace="http://www.example.de/pcParts" schemaLocation="pcParts.xsd"/> ... <... <xsd:attribute name="weight" type="pcParts:weightType"/> .../> ... </xsd:schema> 73 / 446 XML – Extensible Markup Language XSL XSL - Extensible Stylesheet Language XSL - Extensible Stylesheet Language Sprachfamilie zur Visualisierung von XML-Dokumenten: XSLT (XSL-Transformations) Muster-basierte Transformationsregeln für XML-Dokumente XPath (XML Path Language) Selektion von Elementen und Attributen XSL-FO (XSL Formatting Objekts) Layout für Printmedien XPointer Verweise auf externe Dokumente 74 / 446 XML – Extensible Markup Language XSL XSL – XSLT XSLT – Transformationen mit XSL-Stylesheets XSLT-Stylesheet: Transformationsregeln für XML-Dokument Zielsprachen: XML, HTML, XHTML, Text, PDF und andere Ziel- und Quelldokument können beliebig voneinander abweichen! 75 / 446 XML – Extensible Markup Language XSL XSL – XSLT XSLT-Transformationen sind baumorientiert Stylesheet <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="..."> ... </xsl:template> . . Transformationsregeln . <xsl:template match="..."> ... </xsl:template> </xsl:stylesheet> (statt xsl:stylesheet kann auch xsl:transform stehen) 76 / 446 XML – Extensible Markup Language XSL XSL – XSLT Transformationsregeln xsl:template XSL-Stylesheet = Liste von Transformationsregeln Regel: Selektor + Aktion Selektor: XPath-Ausdruck bestimmt, für welche Elemente des die Regel gilt Aktion: statischer Ausgabetext und/oder Kommandos zur dynamischen Erzeugung von Ausgabetext 77 / 446 XML – Extensible Markup Language XSL XSL – XSLT Referenzierung von XSL-Stylesheets Stylesheets: lokale Dateien oder Internet Adressierung im XML-Dokument: Dateipfad oder URL Stylesheet-URL in Verarbeitungsanweisung <?xml version="1.0" encoding="UTF-8"?> <?xml-stylesheet type="text/xsl" href="adressbuch.xsl"?> <adressbuch ... ... 78 / 446 XML – Extensible Markup Language XSL XSL – XSLT Beispiel: XML → HTML Adressbuch → E-Mail-Verzeichnis adressbuch.xml <?xml version="1.0" encoding="UTF-8" ?> <adressbuch aktualisiert="1.4.2008" version="2"> <adresse> <vorname> Hugo </vorname> <nachname> Meier </nachname> <strasse> Waldweg 7 </strasse> <plz> 35231 </plz> <ort> Dinkelsdorf </ort> <email> [email protected] </email> <tel typ="mobil"> 0160/987654 </tel> </adresse> ... 79 / 446 XML – Extensible Markup Language XSL XSL – XSLT adressbuch.xsl <?xml version="1.0"?> <xsl:stylesheet xmlns:xsl="http://www.w3.org/..." version="1.0"> <xsl:template match="/"> <html> <body> <h1> E-Mail-Verzeichnis </h1> <table border="4"> <tr><th>Vorname</th> <th>Nachname</th> <th>E-Mail</th> </tr> <xsl:template match="adresse"> <tr> <td> <xsl:value-of select="vorname" /> </td> <td> <xsl:value-of select="nachname" /> </td> <td> <xsl:value-of select="email" /> </td> </tr> </xsl:template> </xsl:stylesheet> <xsl:apply-templates /> </table> </body> </html> </xsl:template> 80 / 446 XML – Extensible Markup Language XSL XSL – XSLT Regel für Wurzelement <xsl:template match="/"> ... Regeln auf Kinder anwenden <xsl:apply-templates /> Im Beispiel: HTML-Tabellen-Gerüst für E-Mail-Adressen erzeugen Regel für Adressen <xsl:template match="adresse"> ... Im Beispiel: HTML-Tabellenzeile erzeugen Elementwert <xsl:value-of select="..."> ... 81 / 446 XML – Extensible Markup Language XSL XSL – XSLT Ausführen der Transformation Ausführen in Apache Xalan xalan -HTML -IN adressbuch.xml -XSL adressbuch2email.xsl -OUT email.html Ausführung im Webbrowser: automatisch lädt XML-Dokument findet <?xml-stylesheet ...>-Verarbeitungsanweisung lädt Stylesheet führt Transformation aus zeigt resultierende HTML-Datei an Nicht jeder Browser unterstützt XSLT! 82 / 446 XML – Extensible Markup Language XSL XSL – XSLT Ausführung in der Entwicklungsumgebung 83 / 446 XML – Extensible Markup Language XSL XSL – XPath XPath: Baum- bzw. DOM-orientierte Sprache XPath-Ausdruck: „Pfad“ selektiert Teile (Elemente, Attribute) eines XML-Dokuments z.B. einen Knoten, einen Teilbaum oder eine Menge von Attributen Selektionskriterien komplex, benutzen u.a. Positionen im Baum Knotentypen Elementnamen, Attributnamen Attributwerte Zum Lernen und Experimentieren: XLab (http://www.zvon.org) 84 / 446 XML – Extensible Markup Language XSL XSL – XPath XML-Dokument und Baum <?xml version="1.0" encoding="UTF-8" ?> <Musiksammlung> <Album> <Titel> ... <Interpret> ... <Genre> ... </Album> <Album> <Titel> ... <Interpret> ... <Genre> ... </Album> <Album> <Titel> ... <Interpret> ... <Genre> ... </Album> </Musiksammlung> 85 / 446 XML – Extensible Markup Language XSL XSL – XPath DOM-Bäume: Knotentypen Wurzelknoten: repräsentiert komplettes XML-Dokument Ist Elternknoten des Wurzelelements Elementknoten: XML-Element Kinder: Elementknoten, Attributknoten oder Namensraum-Knoten Attributknoten: Attribut mit Name und Wert Textknoten: einfacher Textinhalt Namensraumknoten: Namensraum (für Element oder Attribut) Verarbeitungsanweisungsknoten: Verarbeitungsanweisung (Kind des Wurzelknotens) Kommentarknoten: Kommentarinhalt 86 / 446 XML – Extensible Markup Language XSL XSL – XPath Knotentypen im DOM-Baum visitenkarte.xml <?xml version="1.0" encoding="UTF-8" ?> <Name typ=="person"> <Vorname> Karl </Vorname> <Nachname> Schneider </Nachname> </Name> 87 / 446 XML – Extensible Markup Language XSL XSL – XPath XPath-Grundelemente Ein (Lokalisierungs-)Pfad ist eine Sequenz von Pfadelementen Pfadelemente werden mit / abgetrennt relative und absolute Pfade Pfadelemente enthalten Achse (optional) Knotentest Prädikate (optional) Syntax: achse::knotentest[ Prädikat ] Pfade mit „|“ verknüpfbar: Vereinigung der Elementmengen Klammern möglich zur eindeutigen Zuordnung von Operanden 88 / 446 XML – Extensible Markup Language XSL XSL – XPath Achsen und Knotentests Eine Achse selektiert eine Knotenmenge Achse definiert Knotenmenge über Relation zum aktuellen Knoten, z.B. child::, parent:: Default-Achse: child:: – Menge aller Kindknoten Zugriff auf Attribute über die Achse attribute:: Zugriff auf Namensraum über die Achse namespace:: Knotentest Elementname selektiert passende Elemente, z.B. child::adresse Attributname selektiert passende Attribute (aus der Attributachse), z.B. attribute::email „*“ selektiert alle Knoten der Achse, z.B. child::*, attribute::* 89 / 446 XML – Extensible Markup Language XSL XSL – XPath Prädikate [ not(...) and (...) or ... ] Prädikate innerhalb von Pfaden Prädikate können Knotenmengen weiter einschränken: child::*[2] (2. Kindelement) child::*[position()<3] (Die ersten 2 Kindelemente) descendant::*[@version] (alle Nachkommen mit „version“-Attribut) Pfade als Argumente von Prädikaten Prädikate können Pfade auswerten count(child::*) (Anzahl der Kinder) name(child::*[last()]) (Name des letzten Kindelements) 90 / 446 XML – Extensible Markup Language XSL XSL – XPath Kurznotation Zwei äquivalente Pfade ausführlich: kurz: child::adresse[1]/child::email/attribute::typ adresse[1]/email/@typ Bestandteile child:: adresse [1] attribute:: typ Default-Achse, in der Kurznotation weggelassen Knotentest: selektiert „adresse“-Elemente Prädikat (hier: Index), selektiert 1. Element Attribut-Achse, kurz: @ Knotentest: selektiert Attribut „typ“ 91 / 446 XML – Extensible Markup Language XSL XSL – XPath Beispiele für Achsen Auf den folgenden Folien: Baumdarstellungen für Achsen (aus selfhtml.org) aktueller Knoten; blau markiert durch die Achse ausgewählte Knoten: nummeriert 92 / 446 XML – Extensible Markup Language XSL XSL – XPath child:: – alle Kindknoten parent:: – Elternknoten 93 / 446 XML – Extensible Markup Language XSL XSL – XPath descendant:: alle Nachkommen ancestor:: Alle Vorfahren 94 / 446 XML – Extensible Markup Language XSL XSL – XPath following:: im Dokument dahinter stehende Elemente preceding:: im Dokument davor stehende Elemente 95 / 446 XML – Extensible Markup Language XSL XSL – XPath following-sibling:: im Dokument dahinter stehende Geschwisterelemente preceding-sibling:: im Dokument davor stehende Geschwisterelemente 96 / 446 XML – Extensible Markup Language XSL XSL – XPath self:: Der Knoten selbst descendant-or-self:: Knoten selbst und alle Nachkommen 97 / 446 XML – Extensible Markup Language XSL XSL – XPath ancestor-or-self:: Knoten selbst und alle Vorgänger 98 / 446 XML – Extensible Markup Language XSL XSL – XPath Achsen, Filter und Prädikate Kurznotation für Achsen / . .. // @ Wurzelknoten aktuelles Element übergeordnetes Element Kompletter Baum (descendant_or_self) Attributknoten bzw. Teilbaum Knotentest als Filter Elementnamen oder „*“ (für alle Elemente) Attributnamen 99 / 446 XML – Extensible Markup Language XSL XSL – XPath Prädikate als Filter Prädikate schränken die selektierte Knotenmenge weiter ein viele vordefinierte Prädikate mit Operatoren zu komplexen Prädikaten verknüpfbar Syntax: [ Ausdruck ] Prädikat: Filterung nach Anzahl der Knoten //buch[count(Seite)<=100 and count(Seite)>=10] selektiert alle „buch“-Elemente mit 10-100 „Seite“-Kindelementen 100 / 446 XML – Extensible Markup Language XSL XSL – XPath Ausgewählte XPath-Beispiele adresse alle Kinder mit Namen „adresse“ adresse|*/adresse alle Kinder und Enkel mit Namen „adresse“ adresse[3] | */*[last()-1] 3. Kind mit Namen „adresse“ und vorletzter Enkel //vorname alle Elemente mit Namen „vorname“ ..|../*[1] übergeordneter Knoten und dessen 1. Kind ../@* alle Attribute des übergeordneten Knotens ../@*[2] 2. Attribut des übergeordneten Knotens ../attribute::waehrung Attribut „waehrung“ des übergeordneten Knotens ../@waehrung Attribut „waehrung“ des übergeordneten Knotens .//kunde/*/auftrag[1] zu allen Kunden im Teilbaum des aktuellen Knotens das erste auftrag-Enkelelement kunde[@kundenTyp] kunde-Kind-Elemente mit „kundenTyp-“-Attribut kunde[@id="275"] kunde-Kind-Elemente mit „id-“-Attributwert 275 101 / 446 XML – Extensible Markup Language XSL XSL – XPath Ausgewählte XPath-Funktionen boolean ceiling concat contains count current document element-available false floor format-number function-available generate-id id key lang last Prädikat auswerten aufrunden Konkatenation Teilzeichenkette Anzahl Knoten aktueller Knoten Zugriff auf anderes XML-Dokument Prozessor-Support für Element testen „falsch“ abrunden Zahl → String Prozessor-Support für Funktion testen ID generieren Element zu ID Elemente zu Key Sprachcode Index des letzten Knotens 102 / 446 XML – Extensible Markup Language XSL XSL – XPath Ausgewählte XPath-Funktionen II local-name name namespace-uri normalize-space not number position round starts-with string string-length substring substring-after substring-before sum system-property translate true Name ohne Präfix Name Namensraum-URI Leerzeichen vorne/hinten entfernen Negation in Zahl umwandeln Index aktueller Knoten auf- oder abrunden Präfixtest in Zeichenkette umwandeln Länge Substring extrahieren Summe Systemeigenschaft (z.B. XSLT-Version) Suchen und Ersetzen „wahr“ 103 / 446 XML – Extensible Markup Language XSL XSLT Anwenden von Templates xsl:apply-templates veranlasst Regelanwendung für Kindknoten mit select: Anwendung nur für explizit selektierte Substrukturen Regelanwendung für explizit selektierte Kinder <xsl:template match="adressbuch"> <html><body> <h1> E-Mail-Verzeichnis </h1> <table border="4"> <tr><th>Vorname</th> <th>Nachname</th> <th>E-Mail</th> </tr> <xsl:apply-templates select="*[count(email)>0]"/> </table> </body></html> </xsl:template> 104 / 446 XML – Extensible Markup Language XSL XSLT Auf Inhalte zugreifen Auf Textinhalte und Attributwerte zugreifen: xsl:value-of Syntax: <xsl:value-of select="..." /> Ergebnis: bei Textknoten und Elementknoten: Text-Inhalt bei Attributknoten: Attributwert 105 / 446 XML – Extensible Markup Language XSL XSLT – Push- und Pull-Verarbeitung Entwurfsmuster für XSLT PUSH-Verarbeitung Ausgabe-Erzeugung mit elementspezifischen Regeln Regelanwendung durch <xsl:apply-templates> PULL-Verarbeitung Im Template eines Elements wird die Verarbeitung der Substrukturen explizit programmiert Extremfall: nur ein Template für das Wurzelement. Zugriff auf die Teilbäume mit <xsl:value-of select=...> und <xsl:foreach> Bessere Wartbarkeit ist i.A. bei PUSH-Stil gegeben. 106 / 446 XML – Extensible Markup Language XSL XSLT – Push- und Pull-Verarbeitung XSL-Stylesheet für Adressbuch – PUSH-Stil 5 Transformationsregeln <?xml version="1.0"?> <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:template match="adressbuch"> . . wie oben . </xsl:template> <xsl:template match="adresse"> <tr> <xsl:apply-templates /> </tr> </xsl:template> 107 / 446 XML – Extensible Markup Language XSL XSLT – Push- und Pull-Verarbeitung <xsl:template match="vorname"> <td><xsl:value-of select="." /></td> </xsl:template> <xsl:template match="nachname"> <td><xsl:value-of select="." /></td> </xsl:template> <xsl:template match="email"> <td><xsl:value-of select="." /></td> </xsl:template> </xsl:stylesheet> 108 / 446 XML – Extensible Markup Language XSL XSLT – Push- und Pull-Verarbeitung XSL-Stylesheet für Adressbuch – PULL-Stil <xsl:stylesheet xmlns:xsl="http://www.w3.org/..."> <xsl:template match="/"> <html> <body> <h1> E-Mail-Verzeichnis </h1> <table border="4"> <tr><th>Vorname</th> <th>Nachname</th> <th>E-Mail</th> </tr> <xsl:for-each select="*"> <tr> <td><xsl:value-of select="vorname" /></td> <td><xsl:value-of select="nachname" /></td> <td><xsl:value-of select="email" /></td> </tr> </xsl:for-each> </table> </body> </html> </xsl:template> 109 / 446 XML – Extensible Markup Language XSL XSLT – Textblöcke Textblöcke unverändert ausgeben: xsl:text Problem: Sonderzeichen im Ausgabetext <xsl:text> Sei x>0 und x<10. </xsl:text> Sonderzeichen-Ersatzdarstellung im Ausgabedokument <xsl:text disable-output-escaping="no"> Sei x>0 und x<10. </xsl:text> Ausgabe: Sei x&gt;0 und x&lt;10 110 / 446 XML – Extensible Markup Language XSL XSLT – Default-Aktionen Default-Aktionen Standardaktionen abhängig vom Knotentyp Knotentyp Element Text Komentar Verarbeitungsanweisung Attribut Namensraum Wurzel Standardaktion Templates für Kindknoten anwenden in den Ausgabebaum kopieren ignorieren ignorieren Wert in den Ausgabebaum kopieren ignorieren Templates für Kindknoten anwenden Beispiel: Stylesheet völlig ohne Templates kopiert alle Textinhalte (aber keine Attribute) 111 / 446 XML – Extensible Markup Language XSL XSLT – Kontrollstrukturen Bedingte Verarbeitung in XSLT xsl:if <xsl:if test="..."> ... </xsl:if> xsl:choose: mehrere Alternativen <xsl:choose> <xsl:when test="..."> . . . <xsl:when test="..."> <xsl:otherwise> </xsl:choose> ... </xsl:when> ... </xsl:when> ... </xsl:otherwise> 112 / 446 XML – Extensible Markup Language XSL XSLT – Kontrollstrukturen Listentrenner-Beispiel für xsl:if <xsl:template match="/"> <html><body> <h2>CD-Sammlung</h2> <p>Titel: <xsl:for-each select="cdkatalog/cd"> <xsl:value-of select="titel"/> <xsl:if test="position() < last()-1"> <xsl:text>, </xsl:text> </xsl:if> <xsl:if test="position()=last()-1"> <xsl:text> und </xsl:text> </xsl:if> <xsl:if test="position()=last()"> <xsl:text>!</xsl:text> </xsl:if> </xsl:for-each> </p> </body></html> </xsl:template> 113 / 446 XML – Extensible Markup Language XSL XSLT – Kontrollstrukturen Iterator für Knotenmengen xsl:for-each expliziter Iterator für Knotenmengen xsl:sort Sortierung einer Knotenmenge 114 / 446 XML – Extensible Markup Language XSL XSLT – Kontrollstrukturen Iteration und Sortieren einer Knotenmenge auftraege.xml <?xml version="1.0" encoding="UTF-8" ?> <?xml-stylesheet type="text/xsl" href="auftrag.xsl"?> <auftraege typ="tiefbau"> <auftrag datum="2008-04-11"> <kunde> Karl Dall </kunde> <auftragsposition> 10 Bagger </auftragsposition> <auftragsposition> 1 Bauzaun </auftragsposition> </auftrag> <auftrag datum="2007-09-21"> <kunde> Hubert Winzig </kunde> <auftragsposition> 7 Bagger </auftragsposition> <auftragsposition> 1 Kran </auftragsposition> </auftrag> </auftraege> 115 / 446 XML – Extensible Markup Language XSL XSLT – Kontrollstrukturen Stylesheet dazu auftraege.xsl (1/2) <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:template match="auftraege"> <html><body> <xsl:for-each select="auftrag"> <xsl:sort select="@datum" /> <hr/> <b> Auftrag vom <xsl:value-of select="@datum" />: </b><p> <xsl:apply-templates select="auftragsposition" /> <br /> Oben stehende Auftraege sind von <b> <xsl:apply-templates select="kunde" /> </b></p> </xsl:for-each> </body></html> </xsl:template> 116 / 446 XML – Extensible Markup Language XSL XSLT – Kontrollstrukturen Stylesheet II auftraege.xsl (2/2) <xsl:template match="auftragsposition"> Auftragsposition: <xsl:apply-templates /> <br/> </xsl:template> </xsl:stylesheet> 117 / 446 XML – Extensible Markup Language XSL XSLT – Kontrollstrukturen Ausgabe im Browser 118 / 446 XML – Extensible Markup Language XSL XSLT – Kopieren von Strukturen Kopieren von Baumknoten Flaches Kopieren eines Elements <xsl:copy> ... </xsl:copy> kopiert aktuellen Knoten ohne Inhalt und Attribute Inhalt des xsl:copy-Elements bestimmt den Inhalt des kopierten Knotens Attribute können mit xsl:attribute hinzugefügt werden Kopieren beliebiger Strukturen <xsl:copy-of select=" ... " /> kopiert alle mit select ausgewählten Daten 119 / 446 XML – Extensible Markup Language XSL XSLT – Kopieren von Strukturen Vergleich unterschiedlicher Kopieraktionen Adressbuch mit drei Adressen Adresse 1 wird mit xsl:copy-of kopiert Adresse 2 wird mit xsl:value-of kopiert Adresse 3 wird mit rekursivem xsl:copy kopiert Man achte auf die Attribute! 120 / 446 XML – Extensible Markup Language XSL XSLT – Kopieren von Strukturen <adressbuch stand="1.4.2010"> <adresse> <vorname>Hugo</vorname> <nachname>Meier</nachname> <strasse>Waldweg 7</strasse> <plz>35231</plz> <ort>Dinkelsdorf </ort> <email>[email protected]</email> <tel typ="mobil">0160/987654</tel> </adresse> <adresse> <titel art="adelstitel">Sir</titel> <vorname>Edward</vorname> <nachname>McDonerty</nachname> <strasse>Bergstrasse 13a</strasse> <plz>76522</plz> <ort>Burgstadt</ort> <privatkontakt/> <tel typ="zuhause">08945/23456</tel> </adresse> <adresse> <titel art="akademisch">Msc.</titel> <vorname>Alex</vorname> <nachname>Hacker</nachname> <strasse>xmlweg 17</strasse> <plz>98754</plz> <ort>webstadt</ort> <privatkontakt/> <tel typ="mobil">0151/223456</tel> <tel typ="zuhause">05432/9879995</tel> </adresse> </adressbuch> <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:template match="adresse[vorname=’Hugo’]"> --------- copy-of ----------<xsl:copy-of select="."/> </xsl:template> <xsl:template match="adresse[vorname=’Edward’]"> --------- value-of ---------<xsl:value-of select="."/> </xsl:template> <xsl:template match="adresse"> --------- deep-copy ---------<xsl:call-template name="deepCopy" /> </xsl:template> <xsl:template name="deepCopy" match="*"> <xsl:copy> <xsl:apply-templates /> </xsl:copy> </xsl:template> </xsl:stylesheet> 121 / 446 XML – Extensible Markup Language XSL XSLT – Kopieren von Strukturen Ausgabe dazu: --------- copy-of ----------<adresse> <vorname>Hugo</vorname> <nachname>Meier</nachname> <strasse>Waldweg 7</strasse> <plz>35231</plz> <ort>Dinkelsdorf </ort> <email>[email protected]</email> <tel typ="mobil">0160/987654</tel> </adresse> --------- value-of ---------Sir Edward McDonerty Bergstrasse 13a 76522 Burgstadt 08945/23456 --------- deep-copy ---------<adresse> <titel>Msc.</titel> <vorname>Alex</vorname> <nachname>Hacker</nachname> <strasse>xmlweg 17</strasse> <plz>98754</plz> <ort>webstadt</ort> <privatkontakt/> <tel>0151/223456</tel> <tel>05432/9879995</tel> </adresse> 122 / 446 XML – Extensible Markup Language XSL XSLT – Kopieren von Strukturen Beispiel: XML→XML, Selektion von Tabellenzeilen, xsl:copy <xsl:template match="/adressbuch"> <xsl:copy> <xsl:for-each select="//adresse[nachname=’Schmidt’]"> <xsl:copy> <xsl:apply-templates /> </xsl:copy> </xsl:for-each> </xsl:copy> </xsl:template> <xsl:template name="deepCopy" match="*"> <xsl:copy> <xsl:apply-templates /> </xsl:copy> </xsl:template> 123 / 446 XML – Extensible Markup Language XSL XSLT – Kopieren von Strukturen Beispiel: XML→XML, Selektion von Tabellenspalten <xsl:template match="/adressbuch"> <xsl:copy> <xsl:for-each select="//adresse[nachname=’Schmidt’]"> <xsl:copy> <xsl:apply-templates select="vorname"/> <xsl:apply-templates select="nachname"/> <xsl:apply-templates select="email"/> </xsl:copy> </xsl:for-each> </xsl:copy> </xsl:template> <xsl:template name="deepCopy" match="*"> <xsl:copy> <xsl:apply-templates /> </xsl:copy> </xsl:template> 124 / 446 XML – Extensible Markup Language XSL XSLT – Kopieren von Strukturen Expliziter Regelaufruf Problem: mehrere passende Regeln bei apply-templates Auswahl nach Prioritäten expliziter Regelaufruf Expliziter Regelaufruf: adresse-Knoten kopieren <xsl:template match="/adressbuch"> <xsl:copy> <xsl:for-each select="//adresse[nachname=’Schmidt’]"> <xsl:copy> <xsl:call-template name="deepCopy" /> </xsl:copy> </xsl:for-each> </xsl:copy> </xsl:template> 125 / 446 XML – Extensible Markup Language XML und Java Überblick XML-Verarbeitung in Java Optimale Unterstützung Mehrere stabile Standard-APIs (z.B. JAXP, JAXB) Mehrere ausgereifte Nonstandard-APIs (z.B. JDOM, StAX) Ausgereifte, performante Tools (z.B. validierende Parser, XSLT-Prozessoren) Frameworks für komplexe XML-Projekte (z.B. Cocoon) Hervorragende Dokumentation (Bücher und Internet) Problem eines Anwendungsentwicklers Überblick im „Dschungel der Möglichkeiten“? 126 / 446 XML – Extensible Markup Language XML und Java Überblick Alternative API-Frameworks: JAXP und JAXB JAXP – Java API for XML Processing API(s) zum Validieren, Parsen, Generieren und Transformieren DOM-API: Erstellung und Auswertung von DOM-Bäumen SAX: Ereignis-getriebener XML-Parser StaX: Streaming-Parser Transform-API: XSLT, Serialisierung, Deserialisierung und mehr JAXB – Java XML Binding Framework Standardisiertes Mapping zwischen Java und XML Programmierer arbeitet rein objektorientiert Umwandlung Java ↔ XML automatisch 127 / 446 XML – Extensible Markup Language XML und Java Überblick XML-Parser: DOM- und SAX-Parser DOM-Parser Parser liest XML-Text und konstruiert DOM-Baum dazu Dokument (Baum) komplett im Hauptspeicher Speicher- und Geschwindigkeitsprobleme bei großen Dokumenten SAX-Parser: Ereignis-getriebene Alternative erzeugen Ereignisse wie startElement anwendungsspezifische Callback-Methoden verarbeiten Ereignisse Vorteil: schnell, geringer Speicherbedarf, beliebig große Dokumente Nachteil: Knoten-Kontext steht der Callback-Methode nicht zur Verfügung. Anwendung muss Speicherung von Kontextinfo bei Bedarf selbst organisieren 128 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM DOM Standard des W3C Überblick Standard: W3C-Recommendation: http://www.w3.org/DOM Verwendung: XML, HTML, XHTML, Javascript, CSS u.a. Programmiersprachen- und Plattform-unabhängig Inhalt: Begriffsdefinitionen Dokument, Knoten, Knotentyp, Element, Attribut, . . . Baumstruktur: Wie sieht der Baum zu einem Dokument aus? Abstrakte Operationen (Knoten erzeugen/kopieren/löschen, Kindknoten anfügen, . . . ) 129 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM Merkmale Spezifikation in IDL (Interface Definition Language) 3 Versionen („Levels“) des Standards, aktuell: „Level 3“. modularisiert: DOM Core DOM HTML DOM Style and Formatting – Verarbeitung von Stylesheets DOM Events – Basis für Javascript-Eventmodell DOM Traversal and Range XPath ... Java-Implementierung DOM-API ist Teil von JAXP JavaSE (Java Platform Standard Edition) enthält JAXP 130 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM Wichtige W3C-DOM-Methoden für Knoten und Subklassen appendChild() appendData() cloneNode() deleteData() getAttribute() getAttributeNode() getElementsByTagName() hasChildNodes() insertBefore() insertData() removeAttribute() removeAttributeNode() removeChild() replaceChild() replaceData() setAttribute() setAttributeNode() Kindknoten hinzufügen Zeichendaten hinzufügen Knoten kopieren Zeichendaten löschen Wert eines Attributknotens ermitteln Attributknoten ermitteln Zugriff auf Kindelemente über den Elementnamen auf Kindknoten prüfen Knoten einfügen Zeichendaten einfügen Attribut löschen Attributknoten löschen Knoten löschen Kindknoten ersetzen Zeichendaten ersetzen Wert eines Attributknotens setzen Attributknoten erzeugen 131 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM DOM-Beispiel: Adressbuch Adressbuch-Beispiel: adressbuch.xml <adressbuch aktualisiert="1.4.2010"> <adresse> <vorname>Hugo</vorname> <nachname>Meier</nachname> <telefon typ="mobil"> 0160/987654 </telefon> </adresse> </adressbuch> 132 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM Baumaufbau mit W3C-DOM import org.w3c.dom.*; import javax.xml.parsers.*; public class XmlDocBeispiel { static public void main(String [] args ){ XmlDocBeispiel adressbuchDoc = new XmlDocBeispiel(); Document doc = adressbuchDoc.createAdressBuch(); } public Document createAdressBuch(){ DocumentBuilderFactory factory; DocumentBuilder domParser; Document doc = null; try { factory = DocumentBuilderFactory.newInstance(); domParser = factory.newDocumentBuilder(); doc = domParser.newDocument(); } catch( Exception e ){ System.out.println("Dokument konnte nicht erzeugt werden"); } 133 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM if (doc != null) { Element adressbuch = doc.createElement("adressbuch"); adressbuch.setAttribute("aktualisiert", "1.4.2010"); Element adresse = doc.createElement("adresse"); Element vorname = doc.createElement("vorname"); vorname.appendChild(doc.createTextNode("Hugo")); adresse.appendChild(vorname); Element nachname = doc.createElement("nachname"); nachname.appendChild(doc.createTextNode("Meier")); adresse.appendChild(nachname); Element telefon = doc.createElement("telefon"); telefon.setAttribute("typ", "mobil"); telefon.appendChild(doc.createTextNode("0160/987654")); adresse.appendChild(telefon); adressbuch.appendChild(adresse); doc.appendChild(adressbuch); } return doc; } } 134 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM Großes DOM-Beispiel: XML-Text → DOM → XML-Text Alle wichtigen DOM-API-Elemente in einem Beispiel: XML-Texte parsen und Baumaufbau mit dem DOM-Parser Traversierung von DOM-Bäumen mit der DOM-API Zentrale Methoden DOMBaumBeispiel.erzeugeDOM() konstruiert DOM-Baum zu XML-Text (URI) DOMBaumBeispiel.main() erzeugt DOM-Baum mit erzeugeDOM() serialisiert den Baum wieder mittels DOMSerializer-Instanz DOMSerializer.serialize() serialisiert den Baum DOMSerializer.serializeNode() serialisiert Teilbaum rekursiv 135 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM DOMBaumBeispiel – Analyse mit DOM-Parser DOMBaumBeispiel.erzeugeDOM import import import import org.w3c.dom.Document; javax.xml.parsers.DocumentBuilder; javax.xml.parsers.DocumentBuilderFactory; org.xml.sax.SAXParseException; public class DOMBaumBeispiel { private Document erzeugeDOM (String uri) { Document doc = null; DocumentBuilderFactory factory = DocumentBuilderFactory.newInstance(); DocumentBuilder domBuilder = factory.newDocumentBuilder(); try { Document doc = domBuilder.parse (uri); } catch (SAXParseException e) { ... } 136 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM DOMBaumBeispiel.main public static void main (String[] args) { if (args.length != 2) { System.out.println("usage: java DOMAusgabe [XML URI] OutputFilename"); System.exit (0); } /** Baum erzeugen */ DOMBaumBeispiel b = new DOMBaumBeispiel(); Document doc = b.erzeugeDOM(args[0]); /** Baum in Textform ausgeben */ try { BufferedWriter out = new BufferedWriter(new FileWriter(args[1])); DOMSerializer serializer = new DOMSerializer(); serializer.serialize(doc,out); } catch (IOException e) { e.printStackTrace(); } } 137 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM Die andere Richtung: DOMSerializer import java.io.*; import org.w3c.dom.*; public class DOMSerializer { public static void serialize(Document doc, BufferedWriter writer) throws IOException { // Rekursive Ausgabe ohne Einrückung starten. serializeNode(doc, writer, ""); writer.flush(); } private static void serializeNode(Node node, BufferedWriter writer, String indentLevel) throws IOException { // Fallunterscheidung über alle Knotentypen switch (node.getNodeType()) { case Node.DOCUMENT_NODE: writer.write("<?xml version=\"1.0\"?>"); writer.newLine(); // rekursiver Aufruf für jedes Kind NodeList nodes = node.getChildNodes(); for (int i = 0; i < nodes.getLength(); ++i) serializeNode(nodes.item(i), writer, ""); break; 138 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM case Node.DOCUMENT_TYPE_NODE: DocumentType docType = (DocumentType)node; writer.write("<!DOCTYPE " + docType.getName()); if (docType.getPublicId() != null) writer.write(" PUBLIC \"" + docType.getPublicId() + "\" "); else writer.write(" SYSTEM "); writer.write("\"" + docType.getSystemId() + "\">"); writer.newLine(); break; case Node.COMMENT_NODE: writer.write("<!-- " + node.getNodeValue() + " -->"); writer.newLine(); break; case Node.PROCESSING_INSTRUCTION_NODE: writer.write("<?" + node.getNodeName() + " " + node.getNodeValue() + "?>"); writer.newLine(); break; 139 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM case Node.ELEMENT_NODE: String name = node.getNodeName(); writer.write(indentLevel + "<" + name); NamedNodeMap attributes = node.getAttributes(); for (int i = 0; i < attributes.getLength(); ++i) { Node current = attributes.item(i); writer.write(" " + current.getNodeName() + "=\"" + current.getNodeValue() + "\""); } writer.write(">"); // rekursiver Aufruf für jedes Kind // für ELEMENT-Knoten -> Inhalt eingerückt auf Folgezeile(n) // für TEXT- oder CDATA-Knoten -> gleiche Zeile, hinter dem Start-Tag NodeList children = node.getChildNodes(); if (children.getLength() != 0 && children.item(0).getNodeType() == Node.ELEMENT_NODE) writer.newLine(); for (int i = 0; i < children.getLength(); ++i) serializeNode(children.item(i), writer, indentLevel + INDENT); if (children.getLength() != 0 && children.item(children.getLength()-1).getNodeType() == Node.ELEMENT_NODE) writer.write(indentLevel); writer.write("</" + name + ">"); writer.newLine(); break; 140 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM case Node.TEXT_NODE: writer.write(node.getNodeValue()); break; case Node.CDATA_SECTION_NODE: writer.write("<![CDATA[" + node.getNodeValue() + "]]>"); break; case Node.ENTITY_REFERENCE_NODE: writer.write("&" + node.getNodeName() + ";"); break; } } /** Einrückung. */ private static final String INDENT = " "; } 141 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM Validieren mit dem DOM-Parser Unterschiedliche Möglichkeiten, Konfiguration über DocumentBuilderFactory-Objekt Beispiele factory.setNamespaceAware(true); factory.setValidating(true); factory.setFeature("http://xml.org/sax/features/validation", true); factory.setFeature("http://xml.org/sax/features/namespaces", true); Weitere Features "http://apache.org/xml/features/validation/schema" "http://apache.org/xml/features/validation/schema-full-checking" "http://apache.org/xml/features/continue-after-fatal-error" "http://apache.org/xml/features/validation/dynamic" 142 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM Schema-Validierung mit/ohne schemaLocation mit schemaLocation im Dokument: DocumentBuilderFactory factory = DocumentBuilderFactory.newInstance(); factory.setNamespaceAware( true); factory.setValidating( true); factory.setProperty( "http://java.sun.com/xml/jaxp/properties/schemaLanguage", "http://www.w3.org/2001/XMLSchema"); DocumentBuilder builder = factory.newDocumentBuilder(); Document document = builder.parse( new Inputsource( "test.xml")); ohne schemaLocation factory.setProperty( "http://java.sun.com/xml/jaxp/properties/schemaSource", "file:adressen.xsd"); 143 / 446 XML – Extensible Markup Language XML und Java JAXP - DOM Alternative: Validieren mit javax.xml.validation import javax.xml.XMLConstants; import javax.xml.transform.* import javax.xml.validation.* import org.xml.sax.SAXParseException; ... try { SchemaFactory schemaFactory = SchemaFactory.newInstance(XMLConstants.W3C_XML_SCHEMA_NS_URI); Source schemaFile = new StreamSource( new File(schemaFileName) ); Schema schema = schemaFactory.newSchema( schemaFile ); Validator validator = schema.newValidator(); StreamSource streamSource = new StreamSource( xmlFile ); validator.validate( streamSource ); } catch (SAXParseException e ) { String errStr = e.getMessage() + "\nFile: " + e.getSystemId() + "\nLine: " + e.getLineNumber(); System.err.println( errStr ); ... 144 / 446 XML – Extensible Markup Language XML und Java JDOM und DOM4J DOM-Alternativen: JDOM und DOM4J JDOM-API für Java Open-Source API für XML-Verarbeitung in Java Funktionalität mit DOM vergleichbar, aber einfacher zu benutzen Standardisierungsprozess JSR-102 „steckengeblieben“ integriert beim Parser die DOM- und SAX-APIs Installation: Binär-Distribution herunterladen (www.jdom.org) und jdom.jar in den CLASSPATH aufnehmen DOM4J Weitere Open-Source API: siehe www.dom4j.org Funktionalität mit JDOM vergleichbar 145 / 446 XML – Extensible Markup Language XML und Java JDOM und DOM4J Baumaufbau mit JDOM import org.jdom.Element; import org.jdom.Document; Adressbuch-Beispiel public class CreateDocument { public static void main(String[] args) { <adressbuch aktualisiert="1.4.2008"> <adresse> <vorname>Hugo</vorname> <nachname>Meier</nachname> <telefon typ="mobil"> 0160/987654 </telefon> </adresse> </adressbuch> Element vorname = new Element("vorname"); vorname.addContent("Hugo"); Element nachname = new Element("nachname"); nachname.addContent("Meier"); Element telefon = new Element("telefon"); telefon.setAttribute("typ", "mobil"); telefon.addContent("0160/987654"); Element adresse = new Element("adresse"); adresse.addContent(vorname); adresse.addContent(nachname); adresse.addContent(telefon); Element adressbuch = new Element("adressbuch"); adressbuch.setAttribute("aktualisiert","1.4.2008"); adressbuch.addContent(adresse); Document doc = new Document(adressbuch); } } 146 / 446 XML – Extensible Markup Language XML und Java JDOM und DOM4J Chaining in JDOM Verkettung der Methodenaufrufe Methoden (addContent, setAttribute, setText usw.) liefern Referenz auf das Element zurück Mehrere Aufrufe der Methoden verkettbar („chaining“) Ohne Chaining Element adressbuch = new Element("adressbuch"); adressbuch.setAttribute("aktualisiert", "1.4.2008"); adressbuch.addContent(adresse); Mit Chaining Element adressbuch = new Element("adressbuch") .setAttribute("aktualisiert", "1.4.2008") .addContent(adresse); 147 / 446 XML – Extensible Markup Language XML und Java JDOM und DOM4J Kurzform des Beispiels public static void main(String[] args) { Document doc = new Document( new Element ("adressbuch") .setAttribute("aktualisiert", "1.4.2008") .addContent( (Element) new Element("adresse") .addContent( (Element) new Element("vorname") .addContent("Hugo")) .addContent( (Element) new Element("nachname") .addContent("Meier")) .addContent( (Element) new Element("telefon") .setAttribute("typ", "mobil") .addContent("0160/987654")))) } 148 / 446 XML – Extensible Markup Language XML und Java JAXP - SAX SAX – Simple API for XML SAX definiert Java-Schnittstellen XMLReader ContentHandler ErrorHandler Implementierung der Schnittstellen SAX-Parser implementiert: XMLReader Anwendung implementiert ContentHandler: Methoden für normale Ereignisse ErrorHandler: Methoden für Fehlerereignisse 149 / 446 XML – Extensible Markup Language XML und Java JAXP - SAX Verwendungsmuster XML-Analyse und Verarbeitung sind verzahnt: Anwendung erzeugt Parser-Instanz schaltet ggf. die Validierung ein registriert Content- und Fehler-Behandlungsmethoden beim Parser aktiviert Parser mit einem Dokument Parser analysiert Dokument ruft dabei die Behandlungsmethoden auf 150 / 446 XML – Extensible Markup Language XML und Java JAXP - SAX XML und SAX-Ereignisse <?xml version="1.0" encoding="ISO-8859-1"?> <wurzel> <kind alter="20">Hallo</kind> <?mark ACHTUNG ?> </wurzel> SAX-Ereignisse mit Parametern startDocument startElement ignorableWhitespace startElement characters endElement ignorableWhitespace processingInstruction ignorableWhitespace endElement endDocument (wurzel) (Zeilenumbruch und " ") ("kind", alter=20) ("Hallo") ("kind") (Zeilenumbruch und " ") ("mark","ACHTUNG ") (Zeilenumbruch) ("wurzel") 151 / 446 XML – Extensible Markup Language XML und Java JAXP - SAX SAX-Parser in Java Gesamtstruktur // allgemeine Java-Klassen import java.io.IOException; // SAX import import import import import import mit Hilfsklassen org.xml.sax.XMLReader; org.xml.sax.ContentHandler; org.xml.sax.ErrorHandler; org.xml.sax.SAXException; org.xml.sax.SAXParseException; org.xml.sax.InputSource; import org.xml.sax.helpers.XMLReaderFactory; // Content-Callback-Schnittstelle definieren: class MeinContentHandler implements ContentHandler {...} // Fehler-Callback-Schnittstelle implementieren: class MeinErrorHandler implements ErrorHandler {...} 152 / 446 XML – Extensible Markup Language XML und Java JAXP - SAX Der Kern der Verarbeitung: ContentHandler Pro Ereignisklasse eine Methode class MeinContentHandler implements ContentHandler { private Locator locator; public void setDocumentLocator (Locator locator) { /** locator enthaelt die aktuelle Position im Dokument */ this.locator = locator; } public void startDocument() throws SAXException { ... } public void endDocument() throws SAXException { ... } public void startElement (String namespaceURI, String localName, String rawName, Attributes atts) ... public void endElement (String namespaceURI, String localName, String rawName) ... public void processingInstruction (String target, String data) ... public void characters (char[] ch, int start, int length) ... . . jedes Ereignis muss behandelt werden . 153 / 446 XML – Extensible Markup Language XML und Java JAXP - SAX ErrorHandler: Drei Fehlerarten class MeinErrorHandler implements ErrorHandler { /** Warnung ausgeben */ public void warning(SAXParseException exception) { System.err.println("**Parsing Warning**\n" + " Line: " + exception.getLineNumber() + "\n" + " URI: " + exception.getSystemId() + "\n" + " Message: " + exception.getMessage()); } /** Fehlermeldung ausgeben: Dokument wohlgeformt, nicht gültig public void error(SAXParseException exception) { System.err.println(...); } */ /** Fehlermeldung bei fatalem Fehler ausgeben. Dokument unbrauchbar public void fatalError(SAXParseException exception) { System.err.println(...); } } */ 154 / 446 XML – Extensible Markup Language XML und Java JAXP - SAX Anwendungsunabhängig: Initialisierung public class MeinSAXParser { public void verarbeite (String uri) { try { XMLReader parser = XMLReaderFactory.createXMLReader(); parser.setContentHandler (new MeinContentHandler()); parser.setErrorHandler (new MeinErrorHandler()); // gegen Schema validieren: parser.setFeature("http://xml.org/sax/features/validation", true); parser.setFeature( "http://apache.org/xml/features/validation/schema",true); parser.parse(uri); } catch (IOException e) { System.out.println("Error reading uri: " + e.getMessage()); } catch (SAXException e) { System.out.println("Error parsing uri: " + e.getMessage()); } } 155 / 446 XML – Extensible Markup Language XML und Java JAXP - SAX public static void main (String[] args) { if (args.length != 1) { System.out.println("usage: java MeinSAXParser [XML URI]\n"); System.exit(0); } String uri = args[0]; MeinSAXParser meinSaxParser = new MeinSAXParser (); meinSaxParser.verarbeite (uri); } } 156 / 446 XML – Extensible Markup Language XML und Java JAXP - SAX ContentHandler einfacher: DefaultHandler beerben org.xml.sax.helpers.DefaultHandler implementiert ContentHandler ignoriert alle Ereignisse Verwendung: beerbe DefaultHandler implementiere nur die für die Anwendung wesentlichen Ereignisse DefaultHandler Verwendungsmuster import org.xml.sax.helpers.DefaultHandler; class MeinContentHandler extends DefaultHandler { ... } 157 / 446 XML – Extensible Markup Language XML und Java JAXP - SAX Ausblick: SAX-Filterketten Mit Filterketten lassen sich mehrere ContentHandler zu einer Pipeline verketten. Ein Filter-Modul implementiert die XMLFilter-Schnittstelle. Der Nachfolger in der Kette wird als Parent-Filter bezeichnet. Ein XMLFilter agiert wie ein XMLReader, als Eingabe-Schnittstelle wird aber eine Sequenz von SAX-Ereignissen erwartet Die Hilfsklasse XMLFilterImpl ist ein Default-Filter, der die Ereignisse einfach durchreicht (analog zu DefaultHandler ). XML XMLReader XMLFilter XMLFilter ContentHandler ContentHandler SAX−Ereignisse SAX−Ereignisse SAX−Ereignisse 158 / 446 XML – Extensible Markup Language XML und Java JAXP Transformationen Java Transformation API (TrAX): XSLT und mehr Der Clou dieser APIs: API unterstützt XSLT-Transformationen API unterstützt mehrere XML-Repräsentations-Formate: Text-Format (StreamSource, StreamResult) DOM-Baum (DOMSource, DOMResult) SAX-Ereignissequenz (SAXSource, SAXResult) Quellformat und Zielformat sind unabhängig voneinander API unterstützt Format-Transformationen XSLT und Format-Transformation beliebig kombinierbar Transformationen ohne Stylesheets als „Format-Adapter“: Serialisierung, W3C-DOM → JDOM, . . . 159 / 446 XML – Extensible Markup Language XML und Java JAXP Transformationen Beispiel: SAX-DOM-Adapter Document doc = domparser.parse(new File("data.xml")); // Quellformat: DOM source Source xmlsource = new DOMSource(doc); // SAX-ContentHandler instanzieren ContentHandler handler = new MyHandler(); // ContentHandler als Transformationsziel einbinden Result result = new SAXResult(handler); // Transformator erzeugen TransformerFactory xfactory = TransformerFactory.newInstance(); Transformer xformer = xfactory.newTransformer(); // Transformation: ruft die Callback-Methoden von MyHandler auf xformer.transform(xmlsource, result); 160 / 446 XML – Extensible Markup Language XML und Java JAXP Transformationen XSLT-Transformation XSLT-Stylesheet anwenden: transform007.xsl // XSLT-Stylesheet-Objekt aus Datei erzeugen Source xslsource = new StreamSource(new File("transform007.xsl")); // Transformator-Objekt mit XSLT-Transformation erzeugen Transformer xformer = xfactory.newTransformer(xslsource); ... ansonsten wie oben ... Verwendung eines im XML-Dokument referenzierten Stylesheet Source xslsource = xfactory.getAssociatedStylesheet(doc,null,null,null); 161 / 446 XML – Extensible Markup Language XML und Java JAXP Transformationen Komplettes Beispiel für XSLT import import import import import import import import java.io.File; javax.xml.transform.Source; javax.xml.transform.Result; javax.xml.transform.Transformer; javax.xml.transform.TransformerFactory; javax.xml.transform.TransformerException; javax.xml.transform.stream.StreamSource; javax.xml.transform.stream.StreamResult; public class SimpleTransformer { public static void main(String[] args) { SimpleTransformer xslTransformer = new SimpleTransformer(); xslTransformer.transform(); } 162 / 446 XML – Extensible Markup Language XML und Java JAXP Transformationen public void transform() { try { TransformerFactory tFactory TransformerFactory.newInstance(); Source stylesheet = new StreamSource(new File("xsl/simpleStyle.xsl")); Transformer transformer = tFactory.newTransformer(stylesheet); Source inputDoc = new StreamSource(new File("xml/book.xml")); Result outputDoc = new StreamResult(new File("result/book.html")); transformer.transform(inputDoc, outputDoc); } catch (TransformerException tex) { tex.printStackTrace(); } } } 163 / 446 XML – Extensible Markup Language XML und Java JAXP Transformationen StAX-Parser (Pull-Parser, Stream-Parser) Merkmale StAX = „Streaming API for XML“ Modernste XML-Parser-Technologie (vgl. JSR 173), ab Java 6 API zum Lesen und Erzeugen von XML Explizite Steuerung des Parsers durch die Anwendung („Pull“-Modell) Zwei Nutzungsmodelle, beides Iteratoren „Event“ (XMLEventReader): next liefert „Event“-Objekt „Cursor“ (XMLStreamReader): next liefert Ereignisklasse Info: http://www.xml.com/pub/a/2003/09/17/stax.html Referenzimplementierung: http://stax.codehaus.org 164 / 446 XML – Extensible Markup Language XML und Java JAXP Transformationen StAX-Anwendung mit „Event“-Modell import javax.xml.stream.*; import java.net.URL; import java.io.*; public class XHTMLOutliner { public static void main(String[] args) { if (args.length == 0) { System.err.println("Usage: java XHTMLOutliner url" ); return; } String input = args[0]; try { URL u = new URL(input); InputStream in = u.openStream(); XMLInputFactory factory = XMLInputFactory.newInstance(); XMLStreamReader parser = factory.createXMLStreamReader(in); 165 / 446 XML – Extensible Markup Language XML und Java JAXP Transformationen int inHeader = 0; for (int event = parser.next(); event != XMLStreamConstants.END_DOCUMENT; event = parser.next()) { switch (event) { case XMLStreamConstants.START_ELEMENT: if (isHeader(parser.getLocalName())) { inHeader++; } break; case XMLStreamConstants.END_ELEMENT: if (isHeader(parser.getLocalName())) { inHeader--; if (inHeader == 0) System.out.println(); } break; case XMLStreamConstants.CHARACTERS: if (inHeader > 0) System.out.print(parser.getText()); break; case XMLStreamConstants.CDATA: if (inHeader > 0) System.out.print(parser.getText()); break; } // end switch } // end while parser.close(); } catch (XMLStreamException ex) { System.out.println(ex); } catch (IOException ex) { System.out.println("IOException while parsing " + input); } } 166 / 446 WWW-Grundlagen Teil III WWW-Grundlagen 167 / 446 WWW-Grundlagen 7 Einführung HTTP, HTML, Browser 8 9 HTTP XHTML / HTML HTML – Block- und Inline-Elemente HTML – Universalattribute HTML – Anker und Hyperlinks HTML – Listen HTML – Bilder HTML – Tabellen HTML – Formulare HTML – Frames und iFrames 10 CSS – Cascading Stylesheets Überblick Formatdefinitionen Schriften Listen Klassen Vererbung und Konfliktauflösung Boxenmodell Tabellen Seitengestaltung Mozilla Firebug 11 Javascript Überblick Sprachelemente Prototypen Felder DOM Ereignisse Beispiele Ajax 12 Webserver 168 / 446 WWW-Grundlagen Einführung HTTP, HTML, Browser WWW-Grundlagen: HTTP, HTML, Browser Client-Server-Kommunikationsmuster im WWW WWW-Server reagiert auf Client-Requests (HTTP-Requests: GET, POST, . . . ) liefert beliebige Informationen: Hypertext-Dokumente, Bilder, Videos, Software usw. Hypertextdokumente sind meist HTML-Dokumente WWW-Client fordert Informationen per Request an nimmt die Informationen vom Server entgegen verarbeitet empfangene Informationen abhängig von deren Typ Client-Typen: WWW-Browser, Download-Manager, Crawler usw. 169 / 446 WWW-Grundlagen Einführung HTTP, HTML, Browser Begriffe: Webseite, Homepage, Portal, Website Webseite („web page“): ein einzelnes HTML-Dokument Website („Webangebot“, „Webpräsenz“, „Internetpräsenz“): Der komplette Internetauftritt einer Firma, Behörde, Kommune, Institution, . . . oder auch einer Privatperson Homepage: Einstiegsseite einer Website Einführungsseite: Eine der Homepage vorgelagerte Seite mit geringem Informationsgehalt (oft Flash-Spielereien) Webportal: Eine Webseite, die als Einstiegspunkt und Integrationsmechanismus für die Nutzung gebündelter Dienste dient 170 / 446 WWW-Grundlagen HTTP HTTP - Hypertext-Transfer-Protokoll Merkmale Kommunikationsmuster: Client-Request – Server-Response Zweck: Übertragung von „Multimedia-Inhalten“ (und sonstigen Informationen) HTTP-Server zustandslos: vergisst alle Anfrage-Daten nach Beantwortung Nachrichtenformat (Request- und Response-Nachrichten) Klartext-Nachrichten Nachricht besteht aus Kopf und Rumpf Kopf: Metainformationen (Attributname/Attributwert-Paare) Rumpf: Nutzlast oder leer 171 / 446 WWW-Grundlagen HTTP Kommunikation im WWW 172 / 446 WWW-Grundlagen HTTP HTTP im Protokollstack Transportprotokolle auf verschiedenen Ebenen HTTP nach ISO-OSI-Modell „Anwendungsschicht“, aber: HTTP ist ein „höheres“ Transportprotokoll benutzt selbst TCP als niedere Transportschicht dient für noch „höhere“ Transportprotokolle (z.B. SOAP) als Basis-Transport Kombination HTTP mit SSL/TLS (HTTPS) möglich: Verschlüsselung und Authentifizierung 173 / 446 WWW-Grundlagen HTTP HTTP mit und ohne SSL 174 / 446 WWW-Grundlagen HTTP HTTP und Erweiterungen Requesttypen Wichtige Requesttypen: GET, POST Sonstige Requesttypen: HEAD, PUT, DELETE, TRACE, OPTIONS, CONNECT Erweiterungen WebDAV (Web-based Distributed Authoring and Versioning) Standard zur Verwaltung von Dateien auf dem WWW-Server XMLHttpRequest Javascript-API zur Übertragung von XML-Daten über HTTP Ajax (Asynchronous JavaScript and XML) Dynamisches Nachladen von partiellen Webseiten per XMLHttpRequest 175 / 446 WWW-Grundlagen HTTP HTTP-Adressen: URL, URI und Co. URL – Uniform Resource Locator identifiziert eine Web-Ressource (Dokument, Dienst, . . . ) Speicherort der Ressource ergibt sich aus URL Mehrere Varianten: pro Transport ein URL-Schema (http, ftp, https usw.) URL-Beispiele http://www.example.org/praesentation.html http://www.google.com/search?hl=de&q=billiges+katzenfutter ftp://www.example.org/praesentation.pdf http://192.168.78.10:8082 https://www.studentenbank.de/homebanking mailto:[email protected] file:///home/hg52/docs 176 / 446 WWW-Grundlagen HTTP HTTP-URL und seine Bestandteile Aufbau eines URL am Beispiel Schema Rechnername Port serverseitiger Pfad http:// www.fh-giessen.de :80 /index.html URL mit Aufruf einer serverseitigen Funktion http://www.google.de/search?hl=de&q=URL+URI&client=iceweasel Funktion search Parameter ? hl=de Parameter & q=URL+URI Parameter & client=iceweasel 177 / 446 WWW-Grundlagen HTTP URN – Uniform Resource Name Ortsunabhängiger Name einer Ressource Als XML-Namespace gebräuchlich Bsp.: urn:oasis:names:tc:SAML:2.0:protocol URI – Uniform Resource Identifier Oberbegriff für URL und URN Oft keine Unterscheidung zwischen URI und URL IRI – Internationalized Resource Identifier Zeichensatzerweiterung auf den „Universal Character Set“ (entspricht etwa dem Unicode-Zeichensatz) 178 / 446 WWW-Grundlagen HTTP URLs und DNS Domain Name Service (DNS): weltweit verteilter Verzeichnisdienst. Bestimmung der Transportadressen aus URL mittels DNS Aus HTTP-Adresse (URL) muss Transportadresse bestimmt werden, z.B. IP-Nummer + TCP-Portnummer URLs mit Rechnernamen (www2.meinedomain.de): DNS-Verzeichnisdienst liefert IP-Nummer mailto-URLs: DNS liefert Adresse der zuständigen Mailserver URL enthält Portnummer, falls nicht Standardport des Schemas (http: 80, https: 443, mailto: 25, usw.) 179 / 446 WWW-Grundlagen HTTP URLs und DNS 180 / 446 WWW-Grundlagen HTTP HTTP-GET: Google-Suchanfrage nach „XML parser“ Anfrage-Header GET /search?q=XML+parser HTTP/1.0 User-Agent: keinBesonderer Host: www.google.de Antwort-Header HTTP/1.0 200 OK Cache-Control: private Content-Type: text/html; charset=ISO-8859-1 Set-Cookie: PREF=ID=f4000a82f78b4425:TM=1208976322:LM=1208976322 expires=Fri, 23-Apr-2010 18:45:22 GMT; path=/; domain=.google.de Set-Cookie: SS=Q0=eGVyY2VzIGRvd25sb2Fk; path=/search Date: Wed, 23 Apr 2008 18:45:22 GMT Server: gws Connection: Close 181 / 446 WWW-Grundlagen HTTP Anfrage-Rumpf: bei GET leer! Antwort-Rumpf: HTML-Dokument <html> <head> <meta http-equiv=content-type content="text/html;charset=ISO-8859-1"> <title>XML parser - Google-Suche</title> </head> <body> ... </body> <html> 182 / 446 WWW-Grundlagen HTTP GET-Request versus POST-Request GET-Variante: Parameter im URL Kopf: GET /wiki/Spezial:Search?search=Katzen&go=Artikel HTTP/1.0 Host: de.wikipedia.org POST-Variante: Parameter im Rumpf Kopf: POST /wiki/Spezial:Search HTTP/1.0 Host: de.wikipedia.org Content-Type: application/x-www-form-urlencoded Content-Length: 24 Rumpf: search=Katzen&go=Artikel 183 / 446 WWW-Grundlagen HTTP HTTP-Analyse mit „Firebug“ 184 / 446 WWW-Grundlagen HTTP Statuscodes in der HTTP-Antwort Server liefert in jeder Antwort Statuscode 1xx Informationen Bearbeitung der Anfrage läuft noch 2xx Erfolgreiche Operation Bearbeitung der Anfrage normal ausgeführt 3xx Umleitung weitere Schritte des Clients erforderlich 4xx Client-Fehler Fehler im Verantwortungsbereich des Clients 5xx Server-Fehler Fehler im Verantwortungsbereich des Servers 185 / 446 WWW-Grundlagen HTTP Cookies: Request-übergreifende Info für den Server Problem: HTTP-Server braucht Request-Zuordnung zu einer Sitzung (Konversation mit mehreren HTTP-Nachrichten) zu einem Benutzerkonto (Benutzerdaten-Zuordnung ohne Login) zu einem Warenkorb (Onlineshop) Lösung: Identifizierende Cookies hin- und herschicken Server generiert Cookie (z.B. eindeutige Sitzungsnummer) schickt Cookie im Kopf der HTTP-Antwort Browser speichert Cookie permanent (Dateisystem) schickt Cookie bei jedem Folgerequest wieder an den Server zurück Server kann anhand des Cookies den Request zuordnen (z.B. zu einer aktiven Sitzung) 186 / 446 WWW-Grundlagen HTTP Aufbau von Cookies Cookie = Name + Wert + Attribute Wert: beliebige Zeichenkette (bis zu 4 KB Länge) Optionale Attribute (Auswahl): Verfallszeit: Max-Age, expires Gültigkeits-Domäne: Domain Gültigkeits-Pfad: Path Beispiel einer HTTP-Antwort mit Cookie HTTP/1.0 200 OK Set-Cookie: SessionID="19878906646543"; expires=Tue, 29-Mar-2010 19:30:42 GMT; Max-Age=2471000; Path=/servlet/warenkorb; Version="1" 187 / 446 WWW-Grundlagen HTTP WWW-Kommunikation mit Umleitung und Nachladen 188 / 446 WWW-Grundlagen HTTP Abwicklung eines HTTP-Request durch Webbrowser „Einfacher“ Abruf eines HTML-Dokuments Cache prüfen, ob Dokument schon vorhanden Ziel-URL parsen und Cookie-Datenbasis durchsuchen: Welche Cookies passen bzgl. Domäne und Pfad zum Ziel-URL? Verfalldatum der Cookies beachten Kopf-Daten mit Cookies zusammenstellen Kopf-Daten und ggf. Anfrage-Rumpf an Server verschicken Antwort lesen, ggf. Fehlerbehandlung abhängig vom Antwort-Status Bei Status „URL-Umleitung“: erneute Anfrage 189 / 446 WWW-Grundlagen HTTP nach Empfang des HTML-Dokuments: HTML-Dokument parsen benötigte weitere Daten nachladen (jeweils Cache und Cookies prüfen): CSS-Formatvorlagen integrierte Bilder separate JavaScript-Dateien ... Javascript onload-Aktionen ausführen, dabei Benutzereinstellungen wie URL- oder Domänen-spezifische Popup-Verbote berücksichtigen Formatvorlagen parsen und interpretieren, Konflikte auflösen Inhalt rendern 190 / 446 WWW-Grundlagen HTTP Zusätzliche Komplexität möglich: SSL-gesicherte Verbindungen: Zertifikatsprüfung, Sperrlistenprüfung Login-Vorgang bei beschränkt zugänglichen Ressourcen abwickeln asynchrone Aktivitäten (AJAX) Client-seitige DOM-Modifikationen: XSLT-Transformationen, Javascript Applet-Ausführung ... Ein HTML-Download ist in der Regel keine einfache Aktion! 191 / 446 WWW-Grundlagen XHTML / HTML XHTML/HTML – Hypertext Markup Language XHTML und HTML sind W3C-Standards XHTML XML-Sprache striktere Syntaxanforderungen als HTML Versionen und Varianten HTML 4: sehr weit verbreitet, seit 1997, derzeit Version 4.01 XHTML 1: verbreitet, Weiterentwicklung von HTML 4.01, derzeit Version 1.1 XHTML 2: Entwicklung 2009 eingestellt HTML 5: zukünftiger Standard, nicht fertig, soll Unterschiede zwischen HTML und XHTML verringern 192 / 446 WWW-Grundlagen XHTML / HTML XHTML-Beispiel <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Meine Homepage</title> </head> <body> <h1> Überschrift </h1> <p> Ein Text-Abschnitt. </p> <p> Ein weiterer Text-Abschnitt. </p> <ul> <li> Ein Listenelement. </li> <li> Und noch eines. </li> </ul> </body> </html> 193 / 446 WWW-Grundlagen XHTML / HTML Unterschiede XHTML / HTML (1/2) MIME-Typen für korrekte Interpretation: HTML: text/html XHTML: application/xhtml+xml XML-Deklaration am Anfang: <?xml version="1.0" encoding="..." ?> DTD-Referenz für XHTML 1.0: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> Namensraum für html-Element zwingend: <html xmlns="http://www.w3.org/1999/xhtml"> ... </html> 194 / 446 WWW-Grundlagen XHTML / HTML Unterschiede XHTML / HTML (2/2) bei XHTML Kleinschreibung von Element- und Attributnamen head- und body-Elemente zwingend Bei allen Elementen Abschluss-Tags erforderlich (z.B. img, br, li, p, body) Attributwerte immer in Anführungszeichen Bei Verweisen statt name-Attribut id-Attribut verwenden 195 / 446 WWW-Grundlagen XHTML / HTML XHTML oder HTML ? Vorteile durch XML-Konformität Verarbeitung mit XML-Software möglich Einbettung in andere XML-Daten möglich („Dateninsel“, siehe nachfolgendes Beispiel) Nachteile von XHTML Mehr Schreibaufwand durch striktere Syntax Kompatibilität mit HTML 5 noch unklar 196 / 446 WWW-Grundlagen XHTML / HTML Beispiel: XHTML-Dateninsel in einem XML-Dokument <?xml version="1.0" encoding="ISO-8859-1" ?> <buch xmlns="http://www.meinserver.de/XML/buch"> <kapitel nummer="1"> <html xmlns="http://www.w3.org/1999/xhtml"> <head><title>Einleitung</title></head> <body> <h1>Einleitung</h1> <p>Das Buch beginnt mit diesem Text...</p> </body> </html> </kapitel> </buch> 197 / 446 WWW-Grundlagen XHTML / HTML HTML-Dokumentstruktur DOCTYPE-Deklaration (optional) Angabe zur verwendeten HTML-Version (zur Validierung gegen die Versions-spezifische DTD) Kopf (<head>) Titel des Dokuments (<title>) z.B. vom Browser genutzt als Fenstertitel/Reiterbeschriftung/Lesezeichen von Suchmaschinen für Index-Eintrag genutzt Dokumentenbasis-URL (<base>) Meta-Informationen (<meta>) Information für Suchmaschinen HTTP-Konfiguration Rumpf (body) Inhalt: Text mit eingebetteten Bildern und Hyperlinks 198 / 446 WWW-Grundlagen XHTML / HTML Meta-Tags im HTML-Kopf <meta ... /> – Suchmaschinen-Info, HTTP-Konfiguration <head> <title> Johannes Brahms Homepage </title> <base href="http://www.brahms.de" /> <meta name="keywords" content="Johannes Brahms,Komponist,Biographie" /> <meta name="title" content="Johannes Brahms Homepage" /> <meta name="author" content="Johannes Brahms" /> <meta name="description" content="Lebensdaten von Johannes Brahms. " /> <meta name="robots" content="index,nofollow" /> <meta name="revisit" content="after 7 days" /> <meta http-equiv="expires" content="86400" /> <meta http-equiv="pragma" content="no-cache" /> <meta http-equiv="refresh" content="5; url=brahms-homepage.html" /> </head> (mehr dazu: http://de.selfhtml.org/html/kopfdaten/meta.htm) 199 / 446 WWW-Grundlagen XHTML / HTML HTML – Block- und Inline-Elemente HTML-Rumpf: Block- und Inline-Elemente Blockelement zur Strukturierung des Inhalts erstreckt sich immer über komplette Zeilen Beispiele: Überschrift, Paragraph, Liste, Listenlement, Tabelle, Formular Inline-Element Auszeichnung von Bereichen innerhalb eines Blocks bzw. einer Zeile Beispiele: Fettschrift, Hyperlink 200 / 446 WWW-Grundlagen XHTML / HTML HTML – Block- und Inline-Elemente Wichtige Block-Elemente Überschriften <h1>, . . . , <h6> h=heading Zeilenumbruch <br/> br=break Paragraph <p>...</p> p=paragraph Vorformatierter Text <pre> ... </pre> pre=preformatted text Trennlinie <hr/> hr=horizontal rule Zitatblock <blockquote> CSS-Container <div> Gruppierungselement für Zuordnung von CSS-Attributen <div>-Beispiel <div style="background:red; font-size:10px;"> ... </div> 201 / 446 WWW-Grundlagen XHTML / HTML HTML – Block- und Inline-Elemente Wichtige Inline-Elemente stark betont <strong> früher <b> (boldface) betont <em> emphasized, früher <i> (italic) Teletype <tt> nicht proportionale Schrift hochgestellt <sup> superscripted tiefgestellt <sub> subscripted Inline-Zitat <cite> CSS-Container <span> „Inline-Version“ von <div> 202 / 446 WWW-Grundlagen XHTML / HTML HTML – Universalattribute Universalattribute Ein Universalattribut ist für (fast) alle Elemente definiert class CSS-Klasse für Präsentationsattribute id Eindeutiger Bezeichner für Referenzen style Inline-CSS-Stil-Definition title Tooltip-Text (Anzeige im Browser, wenn der Mauszeiger auf Element zeigt) Element mit Universalattributen <div class="addressContent" title="Lageplan und Anfahrt"> Gebäude I, Raum 122 <br/> Wiesenstraße 14 <br/> 35390 Gießen </div> 203 / 446 WWW-Grundlagen XHTML / HTML HTML – Anker und Hyperlinks Anker-Element und Hyperlinks Anker-Element <a> definiert auswählbaren Verweis (Hyperlink) und/oder ein Verweisziel Inhalt: Text oder Bild Hyperlink verweist auf eine durch einen URL adressierte WWW-Ressource wird als „href“-Attribut des Anker-Elements angegeben (href=hyper reference) Beispiel: Anker mit Hyperlink <a href="http://www.mni.fh-giessen.de"> Fachbereich MNI </a> 204 / 446 WWW-Grundlagen XHTML / HTML HTML – Anker und Hyperlinks Hyperlinks Hyperlink-Auswahl (z.B. Mausklick) löst Aktion aus: bei HTTP-URL: HTTP GET-Request bei Datei-URL (file:///home/hg52): Dateianzeige mailto-URL: Aufruf eines Mailprogramms ftp-URL: Aufbau einer FTP-Verbindung Relative Pfade als URL (href="bilder/bild1.png") beziehen sich auf die Dokumentenbasis Basis wird aus URL des aktuellen HTML-Dokuments bestimmt Basis kann mit <base> im Kopf explizit gesetzt werden 205 / 446 WWW-Grundlagen XHTML / HTML HTML – Anker und Hyperlinks Beispiel: Anker und Dokumentenbasis Datei: ibs/index.html <head> ... <base href="http://m-jaeger.de/lv/ibs" /> </head> <body> ... Hier finden Sie das <a href="skript/skript.pdf" title="Skript als PDF">Skript</a> ... Aktionen Falls Maus auf Anker: Tooltip-Popup „Skript als PDF“ Bei Mausklick auf Anker: HTTP GET-Request mit URL http://m-jaeger.de/lv/ibs/skript/skript.pdf 206 / 446 WWW-Grundlagen XHTML / HTML HTML – Anker und Hyperlinks Anker als Verweisziel Verweisziel-Anker und Hyperlink-Anker <h1> <a id="kapitel_01"> Kapitel 1 - Übersicht </a> </h1> ... <h1> <a id="kapitel_02"> Kapitel 2 - Einleitung </a> </h1> ... <a href="#kapitel_01"> zurück zur Übersicht </a> ... jedes Kapitel durch „id“ direkt auswählbar URL-Syntax: Dokument-URL#Anker-ID Anker gleichzeitig als Verweis und Verweisziel nutzbar 207 / 446 WWW-Grundlagen XHTML / HTML HTML – Listen Aufzählungen / Listen Verschiedene Layout-Varianten: ul, ol, dl Element Bedeutung englisch Erläuterung <ul> unnummerierte Liste unordered list <ol> nummerierte Liste ordered list Elemente ab 1 nummeriert <li> Listenelement list item Element von ul- ond ol-Liste <dl> Definitionsliste definition list Listenelemente jeweils: Begriff und Erklärung <dt> Begriff defined term <dd> Erklärung definition data 208 / 446 WWW-Grundlagen XHTML / HTML HTML – Bilder Bilder im HTML-Dokument Verwendung von Bildern in HTML im normalen Textfluss als anklickbare Hyperlinks als Aufzählungspunkt für unnummerierte Listen Bild-Einbettung mit <img> <img src="bilder/landschaft.jpg" width="300px" height="200px" alt="Landschaftsbild" title="Toskana im Sommer"/> Unbedingt Alternativ-Text („alt“-Attr.) angeben! (Textbrowser, Screenreader, keine Bilder wegen geringer Bandbreite, . . . ) 209 / 446 WWW-Grundlagen XHTML / HTML HTML – Tabellen HTML-Tabellen Tabellen, Zeilen und Zellen Eine Tabelle ist eine Liste von Tabellenzeilen Eine Tabellenzeile ist eine Liste von Zellen Tabelle: <table>-Element Zeile: <tr>-Elementen (tr=table row) Zelle: <td>-Element (table data) Spaltenüberschrift: <th>-Element (table heading) statt <td> 210 / 446 WWW-Grundlagen XHTML / HTML HTML – Tabellen Mehrzeilige und mehrspaltige Zellen Zelle kann sich über beliebig viele Zeilen und/oder Spalten erstrecken Zelle über 3 Zeilen: <td rowspan="3"> Zelle über 4 Spalten: <td colspan="4"> Tabellen-Layout HTML-Attribute für Layout: width, border, cellspacing usw. Bei CSS-Verwendung sind diese Attribute unnötig! 211 / 446 WWW-Grundlagen XHTML / HTML HTML – Tabellen Beispiel: Einfache Tabelle HTML-Quelltext <table border="1"> <tr> <th colspan="2"> Die Menschheit besteht aus </th> </tr> <tr> <td>Eseln</td> <td>Affen</td> </tr> </table> Anzeige im Browser Die Menschheit besteht aus Eseln Affen 212 / 446 WWW-Grundlagen XHTML / HTML HTML – Formulare HTML-Formulare Ein HTML-Formular erfasst Daten für den Webserver Übermittlung durch GET- oder POST-Requests möglich Datenübermittlung: Liste mit „Name=Wert“-Paaren Formular-Beispiel <form method="GET" action="http://www.google.de/search"> <input type="hidden" name="hl" value="de" /> <input type="text" name="q" value="" size="40" maxlength="256" /> <input type="submit" name="btnG" value="Suchen" /> </form> HTTP-Request bei Eingabe „Katze“ und Klick auf „Suchen“: GET http://www.google.de/search?hl=de&q=Katze&btnG=Suchen 213 / 446 WWW-Grundlagen XHTML / HTML HTML – Formulare Eingabefelder in Formularen Texteingaben kurze Texteingaben: <input type="text"> <input type="text" name="Land" value="Deutschland" size="40" /> Passworteingaben: <input type="password" ...> größere Textbereiche: <textarea>-Element <textarea name="Anmerkungen" cols="50" rows="6" /> Versteckte Felder z.B. zur Übertragung von Sitzungsinformation (statt Cookies): <input type="hidden" ...> 214 / 446 WWW-Grundlagen XHTML / HTML HTML – Formulare Formular-Schaltflächen Schaltflächen für Formular-Aktionen Versenden des Formulars: <input type="submit" ...> Rücksetzen des Formulars: <input type="reset" ...> Javascript-Aktion: <input type="button" ...> 215 / 446 WWW-Grundlagen XHTML / HTML HTML – Formulare Auswahl-Elemente Auswahllisten: <select> Auswahl von einem oder mehreren Werten aus Liste Vorselektion möglich Problem: Benutzer kennt sich oft nicht mit Mehrfachselektion aus Beispiel mit Mehrfachselektion <select name="Lieblingsgerichte" size="3" multiple="multiple"> <option value="pizza">Pizza</option> <option selected="selected">Linseneintopf</option> <option selected="selected">Erbseneintopf</option> </select> 216 / 446 WWW-Grundlagen XHTML / HTML HTML – Formulare Auswahl mit Radiobuttons und Checkboxen Radiobutton (Einfachauswahl): <input type="radio"> <input type="radio" name="Zahlung" value="Visa" />Visa<br/> <input type="radio" name="Zahlung" value="Paypal" />Paypal<br/> <input type="radio" name="Zahlung" value="Lastschrift" />Lastschrift<br/> Checkbox (Mehrfachauswahl): <input type="checkbox"> <input type="checkbox" name="check1" value="Milch">Milch<br> <input type="checkbox" name="check2" value="Butter" checked>Butter<br> <input type="checkbox" name="check3" value="Käse">Käse<br> 217 / 446 WWW-Grundlagen XHTML / HTML HTML – Formulare Beispiel-Formular mit allerlei Eingabefeldern <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>Formulartest</title> </head> <body> <form method="GET"> <strong>Textfeld </strong><br/> <input type="text" name="textfeld" value="Anfangstext" size="20" /> <p><strong>Text-Area </strong><br/> <textarea name="Bereich" cols="20" rows="3"> Anfangstext 2 </textarea> <p><strong>Select mit Mehrfachauswahl </strong><br/> <select name="Lieblingsgerichte" size="4" multiple="multiple"> <option>Pizza</option> <option>Nudeln</option> <option selected="selected">Linseneintopf </option> <option selected="selected">Erbseneintopf </option> </select> <div style="position:relative"> <strong>3 Radio-Buttons</strong><br/> <input type="radio" name="Zahlung" value="Visa"/>Visa<br/> <input type="radio" name="Zahlung" value="Paypal" />Paypal<br/> <input type="radio" name="Zahlung" value="Lastschrift" />Lastschrift<br/> <div style= "position:absolute;left:50mm;width:40mm;"> <strong>3 Checkboxen</strong><br/> <input type="checkbox" name="check1" value="Milch">Milch<br> <input type="checkbox" name="check2" value="Butter" checked>Butter<br> <input type="checkbox" name="check3" value="Käse">Käse<br> </div> </div> <p> <input type="submit" name="submit" value="Submit-Schaltfläche" /> <input type="reset" name="reset" value="Reset-Schaltfläche" /> </form> </body> </html> 218 / 446 WWW-Grundlagen XHTML / HTML HTML – Formulare Beispiel-Formular in der Browseransicht 219 / 446 WWW-Grundlagen XHTML / HTML HTML – Frames und iFrames HTML-Frames Frames: Aufteilung des Browserfensters Frameset teilt Fenster in mehrere Teilbereiche z.B Kopfbereich, Navigationsbereich, Informationsbereich Browser verarbeiten Frames nebenläufig Verwendung verletzt Prinzip der Trennung von Inhalt und Form Manche Browser unterstützen Frames nicht (Smartphones) Verweise funktionieren oft nicht richtig (Problem: Verweis auf Frameset oder auf Einzel-Inhalt?) Fazit: Problematisch, besser nicht verwenden! Alternativen: <iframe>- und <div>-Elemente/CSS 220 / 446 WWW-Grundlagen XHTML / HTML HTML – Frames und iFrames Eingebette Frames (iframe-Element) Eingebettete Frames ermöglichen wie Frames die integrierte Darstellung mehrerer HTML-Seiten im selben Browserfenster Im Gegensatz zu Frames keine starre Fensteraufteilung, sondern Integration in den Textfluss wie bei eingebetteten Grafiken Typische Nutzung: Integration von Inhalten anderer Anbieter in das Webangebot (mehr http://de.selfhtml.org/html/frames/eingebettete.htm) 221 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Überblick Cascading Stylesheets (CSS): HTML-Formatvorlagen Motivation: Trennung von Inhalt und Präsentation Inhalt + Struktur Präsentationseigenschaften → HTML-Datei → CSS-Formatvorlage CSS: Layout-Vorschriften für HTML-Elemente Schriftart /-größe/-farbe Hintergrundgestaltung Positionierung von Elementen Textfluss Tabellen-Layout Listengestaltung usw. 222 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Überblick Separate und eingebettete CSS-Definitionen Wo stehen CSS-“Stylesheets“? style-Element im HTML-Kopf (für Dokument-Layout) style-Attribut eines Elements (Element-Layout) separate CSS-Datei (Website-Layout) Verwendung der selben CSS-Datei(en) für alle HTML-Dokumente Für ein Webangebot können alternative Stylesheets angeboten werden, z.B. für Geräte mit niedriger Auflösung wie Smartphones 223 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Überblick Beispiel: CSS-Definitionen im HTML-Kopf und im Element Schriftfarbe und Zeichengröße für Überschriften <html ...> <head> <title> ... </title> <style type="text/css"> h1 { color:red; font-size:48px; } </style> </head> <body> ... <h1> Rote Schrift </h1> <h2 style="color:blue; font-size:32px;" > Blaue Schrift </h2> ... </body> </html> 224 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Überblick CSS-Definitionen in separater Datei: <link>-Element CSS-Datei: meinformat.css h1 { color:red; font-size:48px; } HTML-Datei <html ...> <head> <title> ... </title> <link rel="stylesheet" type="text/css" href="meinformat.css" /> </head> <body> ... <h1> Rote Schrift </h1> ... </body> </html> 225 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Formatdefinitionen CSS-Formatdefinition: Selektor + Deklaration Selektor bestimmt Anwendungsbereich Einfache Auswahlkriterien Elementtyp Element-ID Klasse Pseudo-Klasse h1, div, * #einleitung .kapitel :first-child, :hover, :visited Einfache Selektoren z.B. div.kapitel, a:visited, h1#einleitung:hover. Komplexe Selektoren mit Operatoren z.B. ul li, td+td, p.kapitel[align="left"] 226 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Formatdefinitionen Deklarationen Deklarationen bestehen aus Paaren der Form Attributname:Attributwert Beispiele: { color:red; font-size:48px; } Deklarationen können für den Fall von Konflikten als wichtig gekennzeichnet werden, z.B. { font-size:1em !important; } Mehrere Selektoren können, durch Komma getrennt, an eine Deklaration gebunden werden Beispiel: h1, h2 { color:red; font-size:48px; } 227 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Formatdefinitionen CSS-Beispiel <html ...> <head> <title> ... </title> <!-- einbinden externer Formatdefinitionen --> <link rel="stylesheet" type="text/css" href="formate.css"> <!-- zusätzlich dokumentenspezifische Formatdefinitionen --> <style type="text/css"> body { background-color:#FFFFCC; margin-left:100px; } * { color:blue; } h1 { font-size:300%; color:#FF0000; font-style:italic; border-bottom:solid thin black; } p,li { font-size:110%; line-height:140%; font-family:Helvetica,Arial,sans-serif; letter-spacing:0.1em; word-spacing:0.3em; } </style> </head> <body> ... </body> </html> 228 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Formatdefinitionen Selektoren-Beispiele Selektor selektierte Elemente div p div > p div + p div>*>*>p p[align] p[align=center] body:first-child td:first-child + td #myid form#myid td[abbr~=Berlin] *[lang|=en] .kapitel div.kapitel :hover p-Element im Teilbaum unterhalb von div-Element p-Element als Kind eines div-Elements p-Element direkt hinter div-Element p-Element drei Ebenen unterhalb von div-Element p-Element mit align-Attribut p-Element mit align=center erstes Kind-Element eines body-Elements td-Elemente in der 2. Spalte einer Tabelle jedes Element mit der ID myid form-Element mit der ID myid td-Element, Berlin kommt im abbr-Attribut vor beliebiges Element, Attribut lang beginnt mit „en“ alle Elemente der benutzerdefinierten Klasse kapitel alle div-Elemente der benutzerdefinierten Klasse kapitel Pseudo-Klasse für alle Elemente unter Mauszeiger 229 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Schriften Gestaltungselemente: Schriften Serifenschriften haben unten rechts an den Buchstaben kleine Häkchen sind für hohe Auflösung (Bücher, Zeitungen) gut geeignet Beispiele: „Times“, „Times New Roman“, „Georgia“ Serifenlose Schriften sind auf Bildschirmen mit niedriger Auflösung besser lesbar Beispiele: „Helvetica“, „Arial“, „Verdana“ Monospace-Schriften (im Gegensatz zu Proportionalschriften) haben für jedes Zeichen die gleiche Breite werden z.B. für Programmtexte gerne verwendet Beispiel: „Courier“ 230 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Schriften Schriften in CSS Attribut Bedeutung Beispiele font-family font-size font-weight font-style color Schriftfamilie, -art Größe Gewicht („Fettigkeit“) Neigung Farbe sans-serif, helvetica xx-large, smaller, 120%, 11pt bold, lighter, 200 italic, oblique, normal blue, #c33b00 Angabe von Alternativ-Schriften möglich, z.B. font-family: verdana, helvetica, arial, sans-serif; (mehr dazu: http://de.selfhtml.org/css/eigenschaften/schrift.htm) 231 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Schriften Beispiel: Paragraphen in Verdana p { font-size: font-family: font-weight: font-style: } small; Verdana, sans-serif; bolder; italic; Kurzschreibweise (festgelegte Reihenfolge der Attribute) p { font: italic bolder small Verdana, sans-serif; } 232 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Listen Gestaltungselemente: <ul>-Listen Listentrenner Standard: gefüllte schwarze Kreise Andere Symbole: list-style-type: circle, disc, square, none Grafik: list-style-image (Symbol als Ersatzdarstellung möglich) Beispiel ul { list-style-image:url("bilder/kleines-herz.gif"); list-style-type:square; } Kurzform ul { list-style:url("bilder/kleines-herz.gif") square; } 233 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Klassen Benutzerdefinierte CSS-Klassen Universalattribut „class“ <style type="text/css"> .NeueSeite { ... } h1.Hinweis { ... } ... </style> ... <h1 class="NeueSeite Hinweis"> CSS-Klassen des <h1>-Elements: NeueSeite globale Klasse für alle Elemente h1.Hinweis Unterklasse für <h1>-Elemente 234 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Vererbung und Konfliktauflösung Vererbung von Attributen CSS-Attribute eines Elements werden prinzipiell an die Nachfolger im Dokumentenbaum vererbt Ein Element kann geerbte Attribute aber überschreiben: <div style="color:red;"> <ul> <li> Schriftfarbe rot, vom div-Element geerbt</li> <li style="color:green;"> Schriftfarbe grün </li> </ul> </div> Die genauen Vererbungsregeln sind recht komplex (mehr dazu: http://www.thestyleworks.de/basics/inheritance.shtml) 235 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Vererbung und Konfliktauflösung Konfliktauflösung / Kaskadenmodell Neben serversseitigen CSS-Definitionen des Web-Autors (Autoren-Stylesheet) berücksichtigt ein Browser Benutzer-Stylesheets (z.B. Firefox: userChrome.css) Benutzer-Voreinstellungen, sogenannte Browser-Stylesheets Falls auf ein Element mehrere Selektoren zutreffen, kann es zu widersprüchlichen Attribut-Deklarationen kommen. Der Algorithmus zur Konfliktauflösung heißt „Kaskade“. 236 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Vererbung und Konfliktauflösung Prinzipien des Kaskade-Algorithmus Quelle der Deklaration und „important“-Kennzeichnung Priorität höchste geringste Quelle der Deklaration Benutzer-Stylesheet Autoren-Stylesheet Autoren-Stylesheet Benutzer-Stylesheet Browser-Stylesheet Art der Deklaration !important !important normal normal – Spezifischer Selektor vor einem allgemeineren h1.kapitel ist spezifischer als h1 oder .kapitel h1#kapitel1 ist wegen der ID spezifischer als h1.kapitel (mehr dazu in http://de.selfhtml.org/css/formate/kaskade.htm) 237 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Boxenmodell Boxenmodell für Blockelemente Jedes Blockelement belegt Rechteck im Browserfenster besteht aus Rahmen und Inhaltsbereich. Größe des Inhaltsbereichs: width und height Innenabstand (padding): Abstand zwischen Rahmen und Inhaltsbereich. Außenabstand (margin): Abstand des Blockelements zu seiner Umgebung Abstände und Rahmenbreite für jede Seite separat spezifizierbar (border-left, margin-bottom, padding-top usw.) Bei angrenzenden Blöcken wird der jeweils größere Außenabstand verwendet 238 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Boxenmodell Beispiel Gelb unterlegte Paragraphen mit blauen Rahmen p { border:5px dotted blue; padding: 10px; margin: 10px; background: yellow; width: 150mm; } Rahmendefinition ist Kurzform von border-size:5px; border-style:dotted; border-color:blue; 239 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Tabellen Tabellen-Gestaltung CSS-Attribute für <table>-Element Rahmen, Breite, Zellabstand (border-spacing) table-layout bestimmt Spaltenbreite fixed feste Größe auto Anpassung an Zellinhalt caption-side: Position der Tabellenbeschriftung CSS-Attribute für die Zellen Rahmen, Innenabstand, Textausrichtung text-align – horizontale Ausrichtung vertical-align – vertikale Ausrichtung (mehr dazu: http://de.selfhtml.org/css/eigenschaften/tabellen.htm) 240 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Seitengestaltung Seitengestaltung mit CSS Basis für Seitengestaltung: <div>-Element Beispiel: Seitenaufteilung in Navigationsbereich, Kopfbereich, Fußbereich und Inhaltsbereich: 4 entsprechende <div>-Blöcke Positionierung: position-Attribut gemäß normalem Textfluss (position:static, Normalfall) relativ zueinander, mit festgelegter (horizontaler und vertikaler) Distanz: position:relative relativ zum Container-Element und unabhängig von den anderen Bereichen position:absolute absolut im Browserfenster: position:fixed Bei Überschneidungen lassen sich Sichtbarkeitsebenen definieren (z-index-Attribut) 241 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Seitengestaltung Positionierungsattribute position top left bottom right width min-width max-width height min-height max-height overflow direction float clear z-index display visibility clip Positionsart Startposition von oben Startposition von links Startposition von unten Startposition von rechts Breite Mindestbreite Maximalbreite Höhe Mindesthöhe Maximalhöhe Elementbereich mit übergroßem Inhalt Richtung Textumfluss Fortsetzung bei Textumfluss Schichtposition bei Überlappung Anzeigeart bzw. Nichtanzeige ohne Platzhalter Anzeige bzw. Nichtanzeige mit Platzhalter Anzeigebereich eingrenzen 242 / 446 WWW-Grundlagen CSS – Cascading Stylesheets Mozilla Firebug Entwicklungstool: Mozilla Firebug Firebug: Browser-Plugin für Mozilla-Browser HTTP-Debugger HTML-Debugger DOM-Analyse CSS-Entwicklungswerkzeug: berechnete Style-Attribute, Konflikte und Quellen Box-Layout an Stylesheet-Debugger Javascript-Debugger 243 / 446 WWW-Grundlagen Javascript Überblick Javascript Vom WWW-Browser interpretierte Scriptsprache Typische Verwendung: Erweiterung der GUI-Möglichkeiten: dynamische Elemente Prüfung von Formulareingaben vor der Übermittlung Name/Geschichte Entwicklung durch Netscape Standardisierung als ECMA-Script (durch ECMA International) Javascript ist eine Marke von Sun Microsystems Microsoft nennt die Sprache JScript wenig Bezug zu Java 244 / 446 WWW-Grundlagen Javascript Überblick Javascript Grundkonzepte „Sandbox“-Konzept: Kein Zugriff auf lokale Ressourcen Interpretation im Browser abschaltbar prozedurale und objektorientierte Elemente Verarbeitung von XML- und HTML-Dokumenten mit verschiedenen DOM-APIs Vordefinierte Objekte und Operationen für Erfragen von Umgebungsinformaionen (Browser, Uhrzeit usw.) Ein-/Ausgabe Fensterverwaltung 245 / 446 WWW-Grundlagen Javascript Überblick Einbettung von Javascript in HTML In HTML eingebettete Anweisungen <script type="text/javascript"> ... Anweisungen ... </script> Einbindung separater Skriptdateien in HTM <script type="text/javascript" src="meinscript.js" /> Alternativer Text für nicht interpretierende Browser <noscript> ... alternativer Text ... </noscript> 246 / 446 WWW-Grundlagen Javascript Überblick Ausführungszeitpunkt Ausführung ohne Ereignis-Bindung Im HTML-Kopf oder -Rumpf eingebetteter Code wird vor dem Anzeigen der Seite ausgeführt. Ausführung bei Browser- oder GUI-Ereignissen Beim Laden der Seite: <body onload="... Script-Code ..."> Selektion eines Links: <a href="javascript:history.back();">zurück</a> Absenden eines Formulars <form onsubmit="CheckInput();"> ... Mausklick auf ein Element <img src="bild-klein.jpg" onclick="ZeigeVolleGroesse();"> 247 / 446 WWW-Grundlagen Javascript Überblick Javascript-Beispiel Funktionsdefinition im HTML-Kopf: zeigeDatum Aufruf durch im Rumpf eingebettetes script-Element verändert Dokument („dynamisches“ HTML) angezeigte Seite besteht aus dynamisch document.write(...) erzeugter Überschrift statischen Teil <p>Aktuelle Nachrichten ...</p> 248 / 446 WWW-Grundlagen Javascript Überblick <html> <head> <title> Datum-Beispiel </title> <script type="text/javascript"> function zeigeDatum () { var datum = new Date(); var tag = datum.getDate(); var monat = datum.getMonth() + 1; var jahr = datum.getFullYear(); var nullVorTag = ((tag < 10) ? "0" : ""); var nullVorMonat = ((monat < 10) ? ".0" : "."); var datumString = nullVorTag + tag + nullVorMonat + monat + "." + jahr; document.write("<h1>" + datumString + "<\/h1>") } </script> </head> <body> <script type="text/javascript"> <p>Aktuelle Nachrichten ...</p> </body></html> zeigeDatum(); </script> 249 / 446 WWW-Grundlagen Javascript Sprachelemente Javascript-Sprachelemente kein strenges Typsystem prozedurale Elemente: Funktionen lokale und globale Variablen Operatoren, Anweisungen, Kontrollstrukturen ähnlich Java OO-Elemente vordefinierte und benutzerdefinierte Objekte vordefiniert: DOM-Klassen und Objekte (z.B. document, Node) sonstige vordefinierte Klassen (z.B. Object, String, Date, Array ) keine benutzerdefinierbaren Klassen Vererbung mit „unüblichen“ Methoden („Prototypes“, Closures) 250 / 446 WWW-Grundlagen Javascript Sprachelemente Funktionen in Javascript Funktionen haben Parameter (Objekte sind Referenzparameter, ansonsten Wertparameter) einen Resultatswert lokale Variablen (mit var deklariert) einen ausführbaren Rumpf Es gibt anonyme Funktionen, z.B. function (n) { n++; } Funktionsdefinitionen sind schachtelbar 251 / 446 WWW-Grundlagen Javascript Sprachelemente Objekte in Javascript Objekt = assoziative Liste von Attributen (Name/Wert) Attributname ist String, Wert von beliebigem Typ Falls Attributwert Funktion, heißt das Attribut auch „Methode“ Objekte können mit dem new -Operator erzeugt werden, z.B. var zaehler = new Object(); zaehler.wert zaehler.setze zaehler.erhoehe zaehler.zeige = = = = 0; function (i) { this.wert = i; }; function () { this.wert++; }; function () { alert(this.wert); }; Das Objekt zaehler hat das Attribut wert und Methoden: setze, erhoehe, zeige 252 / 446 WWW-Grundlagen Javascript Sprachelemente Konstruktoren new erzeugt ein neues Objekt Funktionen können in Verbindung mit new als Konstruktoren für benutzerdefinierte Objekte genutzt werden, z.B. function Zaehler this.wert = this.setze = this.erhoehe = this.zeige = } (initWert) { initWert; function (i) { this.wert = i; }; function () { this.wert++; }; function () { alert(this.wert); }; var zaehler = new Zaehler(0); zaehler.erhoehe(); zaehler.zeige(); 253 / 446 WWW-Grundlagen Javascript Sprachelemente Objekte sind assoziative Listen Objektdefinition mit der Schreibweise assoziativer Listen var zaehler = { wert setze erhoehe zeige : : : : 0, function (i) { this.wert = i; }, function () { this.wert++; }, function () { alert(this.wert); } }; Attribut-Zugriff (Methodenzugriff) Assoziativ-Listen-Notation: Standard-Notation: zaehler["setze"](14) zaehler.setze(14) Objektverarbeitung mit dem Iterator für assoziative Listen for (attr in zaehler) { alert("Name: " + attr + " Wert: " + zaehler[attr] + " Typ: " + typeof(attr)); } Beachte: Mit der klassischen Schreibweise geht das nicht! 254 / 446 WWW-Grundlagen Javascript Prototypen Prototypen: „Vererbung“ in Javascript Jedes Objekt obj hat ein Attribut obj.prototype Der Wert des Prototypen ist selbst ein beliebiges, frei zuweisbares Objekt obj.prototype „vererbt“ seine Attribute an obj, d.h. Wenn obj.attr undefiniert ist, wird stattdessen obj.prototype.attr ausgewertet 255 / 446 WWW-Grundlagen Javascript Prototypen Prototypen: Beispiel Zwei Zähler-Objekte mit individuellen wert-Attributen var zaehlerPrototype = { setze : function (i) { this.wert = i; }, erhoehe : function () { this.wert++; }, zeige : function () { alert(this.wert); } }; var z1 = { wert : 0, prototype : zaehlerPrototype }; var z2 = { wert : 0, prototype : zaehlerPrototype }; Vorteil: Speicherplatz für die Prototype-Attribute wird gemeinsam benutzt 256 / 446 WWW-Grundlagen Javascript Felder Felder in Javascript Felder sind Objekte der Klasse Array Sie bestehen aus einer dynamisch veränderbaren Anzahl von Elementen Die einzelnen Elemente können unterschiedliche Typen haben Die Elemente werden durch Index selektiert (ab 0 aufwärts) Die Deklaration erfolgt mit dem new -Operator oder durch ein Literal, z.B. feld1 = new Array(3); feld2 = new Array(); feld3 = ["rot", "gruen", 127]; uninitialisierte Feldelemente haben den Wert undefined 257 / 446 WWW-Grundlagen Javascript DOM Javascript-DOM Mit Javascript kann man u.a. Browserfenster öffnen und schließen Web-Seiten laden beliebige Teile von HTML-Dokumenten selektieren HTML-Dokumente verändern Grundlage ist das Javascript-DOM-Modell mit den Objekten window, window.document, window.navigator HTML-Dokumente lassen manipulieren: auf der Baum-Ebene durch Methodenaufrufe, z.B. element.appendChild(...) durch Wertzuweisungen an die DOM-Objekte, z.B. document.body.firstChild = neuerParagraph durch Schreiben von HTML-Text mit document.write(...) 258 / 446 WWW-Grundlagen Javascript DOM Problemfall: Verschiedene DOM-Modelle und DOM-Versionen mehrere DOM-Varianten aus historischen Gründen, dadurch alternative Codierungsmöglichkeiten Das W3C-DOM für XML modernstes DOM einheitliche Verarbeitung von HTML und XML wird von alten Browsern nicht unterstützt Das einfachere HTML-DOM (ebenfalls ein W3C-Standard) stark verbreitet und von den meisten Browsern unterstützt eingeschränkte Baumknoten-Selektion erlaubt oft etwas kürzeren Code Die Microsoft-DOM-API erlaubt oft etwas kürzeren Code ist nicht standardisiert wird nicht von allen Browsern implementiert 259 / 446 WWW-Grundlagen Javascript DOM Das aktuelle DOM: XML-W3C-DOM level 3 in Javascript Attribute von Node-Objekten childNodes data firstChild lastChild nextSibling nodeName nodeType nodeValue parentNode previousSibling Kindknoten Zeichendaten erster Kindknoten letzter Kindknoten nächster Knoten auf derselben Ebene Name des Knotens Knotentyp Wert/Inhalt des Knotens Elternknoten vorheriger Knoten auf derselben Ebene 260 / 446 WWW-Grundlagen Javascript DOM DOM-Mix in Javascript: problematisch, aber üblich Beispiel: alert(window.document.body.firstChild.innerHTML); Die Objekte window und window.document sind Javascript-Standardobjekte Das body-Attribut gehört zum HTML-DOM. Das firstChild-Attribut gehört zum XML-DOM Die XML-DOM-Notation für document.body ist document.getElementsByTagName("body")[0] Das innerHTML-Attribut ist eine nicht standardisierte Microsoft-Erweiterung Ein standardisiertes direktes Äquivalent gibt es nicht! Fazit: Komplexer Javascript-Code erfordert Browser-abhängige Varianten 261 / 446 WWW-Grundlagen Javascript DOM Wurzel der DOM-Hierarchie: globales Objekt „window“ repräsentiert Browser-Fenster Attribute: name, outerHeight, status, . . . Methoden (Auswahl): open alert confirm home moveTo neues Fenster öffnen Meldung anzeigen Bestätigung holen zur Startseite verschieben Unterobjekte (Auswahl): document navigator history event location DOM-Baum der aktuellen Seite Browser-Objekt Liste besuchter Seiten Details zu Tastatur- oder Mausereignis URI des Dokuments 262 / 446 WWW-Grundlagen Javascript DOM Beispiel: window-Objekt <html> <head> <title> Test </title> <script type="text/javascript"> function FensterOeffnen (URL) { MeinFenster = window.open(URL, "Zweitfenster", "width=300,height=200,scrollbars=yes"); MeinFenster.focus(); } </script> </head> <body> <a href="datei2.htm" onclick="FensterOeffnen(this.href); return false"> Neues Fenster </a> </body> </html> 263 / 446 WWW-Grundlagen Javascript DOM DOM-Objekt „window.document“ document repräsentiert die aktuelle HTML-Seite Mit vordefinierten Methoden können Knoten im DOM-Baum selektiert und der Baum verändert werden <html> <head> <title>Test</title> </head> <body> <div id="Bereich" style="border:1px black solid; padding:10px"></div> <script type="text/javascript"> var ueberschrift = document.createElement("h1"); var text = document.createTextNode("dynamische Seite"); ueberschrift.appendChild(text); var ausgabebereich = document.getElementById("Bereich"); ausgabebereich.appendChild(ueberschrift); </script> </body> </html> 264 / 446 WWW-Grundlagen Javascript DOM DOM-Beispiel: HTML-Tabelle aufbauen function start() { var body = document.getElementsByTagName("body")[0]; var tbl = document.createElement("table"); for (var j = 0; j < 2; j++) { var row = document.createElement("tr"); for (var i = 0; i < 2; i++) { var cell = document.createElement("td"); var cellText = document.createTextNode("Zelle["+j+", "+i+"]"); cell.appendChild(cellText); row.appendChild(cell); } tbl.appendChild(row); } body.appendChild(tbl); tbl.setAttribute("border", "2"); } 265 / 446 WWW-Grundlagen Javascript DOM Wichtige Methoden von window.document document.write Anstatt mit den Baumfunktionen dynamischen Inhalt zu erzeugen, kann man mit dieser Methode HTML-Code dynamisch einfügen document.writeln("<ul><li> dynamisch eingefuegte Liste </li></ul>"); document.getElementById Element über eindeutiges ID-Attribut selektieren document.getElementsByTagName Element über Elementtyp selektieren, liefert ein Feld 266 / 446 WWW-Grundlagen Javascript DOM Beispiel zur Elementselektion <html> <head> ... </head> <body> <div id="einleitung" title="Einleitung"> Dies ist die Einleitung </div> </body> Folgende Ausdrücke sind austauschbare Selektionen dieses div-Elements: document.getElementById("einleitung") document.getElementsByTagName("div")[0] document.getElementsByTagName("body")[0].firstChild 267 / 446 WWW-Grundlagen Javascript DOM HTML-DOM: HTML-Element-Objekte HTML-DOM ist HTML-spezifisch, lässt sich also nicht für XML verwenden Methoden/Attribute dieses DOM erkennt man an HTML-spezifischen Namen Ein HTML-Elementobjekt hat universelle und Element-spezifische Attribute und/oder Methoden 268 / 446 WWW-Grundlagen Javascript DOM Beispiele für HTML-DOM Elementtyp alle html h1 img input form a Attribut-Beispiele id, title, className version align height, border, src value, form, type method, action href Methoden-Beispiele select, click submit, reset focus 269 / 446 WWW-Grundlagen Javascript DOM Selektion von HTML-Elementobjekte über Elementtyp oder name-Attribut Elemente werden oft gemäß HTML-DOM mit dem Elementtyp selektiert, z.B. document.body Achtung: Dies geht nur bei einigen Elementtypen Elemente werden oft gemäß HTML-DOM mit dem Wert des name-Attributs selektiert, z.B. formular.vorname Achtung: das Name-Attribut muss nicht eindeutig sein seine Verwendung wird ab XHTML 1.1 sehr eingeschränkt besser: formular.getElementsByName("vorname")[0] noch besser: id verwenden 270 / 446 WWW-Grundlagen Javascript DOM Beispiel für Attributzugriff: Tooltip-Text (title-Attribut) HTML-DOM function aendereTooltip (element, neuerText) { var alterText = element.title; element.title = neuerText; return alterText; } W3C-XML-DOM function aendereTooltip (element, neuerText) { var alterText = element.getAttribute("title"); element.setAttributeNode("title",neuerText); return alterText; } 271 / 446 WWW-Grundlagen Javascript Ereignisse Ereignisse zur Anbindung von Javascript-Aktionen onabort onblur onchange onclick ondblclick onerror onfocus onkeydown onkeypress onkeyup onload onmousedown onmousemove onmouseout onmouseover onmouseup onreset onselect onsubmit onunload bei Abbruch des Ladevorgangs beim Verlassen des aktiven Elements bei erfolgter Änderung eines Formularfelds beim Anklicken eines Elements bei doppeltem Anklicken im Fehlerfall (beim Laden von Bildern) beim Aktivieren (Formularfelder, Links) beim Herunterdrücken einer Taste bei Drücken einer Taste bei Loslassen einer Taste beim Laden einer Datei bei gedrückter Maustaste bei weiterbewegter Maus beim Verlassen des Elements mit der Maus beim Überfahren des Elements mit der Maus bei losgelassener Maustaste beim Zurücksetzen des Formulars beim Selektieren von Text beim Absenden des Formulars beim Verlassen der Datei 272 / 446 WWW-Grundlagen Javascript Beispiele Beispiel: CSS-Stil dynamisch ändern <html> <head> <title>Test</title> <style type="text/css"> .hinterlegt { background-color:green } </style> <script type="text/javascript"> function stilAendern () { var elemente = document.getElementsByTagName("li"); for (var i = 0; i < elemente.length; i++) if (i % 2 != 0) { elemente[i].className = "hinterlegt"; elemente[i].type = "I"; // römische Ziffern } } </script> </head> 273 / 446 WWW-Grundlagen Javascript Beispiele <body> <ol> <li>Ein <li>Ein <li>Ein <li>Ein <li>Ein <li>Ein </ol> ungerader Listenpunkt</li> gerader Listenpunkt</li> ungerader Listenpunkt</li> gerader Listenpunkt</li> ungerader Listenpunkt</li> gerader Listenpunkt</li> <a href="javascript:stilAendern()">gerade Listenpunkte hinterlegen!</a> </body> </html> 274 / 446 WWW-Grundlagen Javascript Beispiele Beispiel: Dynamische Längenanpassung eines Eingabefelds <html> <head> <title>Test</title> <script type="text/javascript"> var Breite = 3; function erweitern () { Breite += 1; document.getElementById("Eingabe").size = Breite; } </script> </head> <body> <form id="Formular"> Geben Sie Text ein:<br> <input type="text" size="3" id="Eingabe" onkeypress="erweitern();"> </form> </body> </html> 275 / 446 WWW-Grundlagen Javascript Beispiele Beispiel: Formular-Validierung <html><head> <title>Formulareingaben überprüfen</title> <script type="text/javascript"> function pruefe (form) { if (form.Name.value == "") { alert("Bitte Ihren Namen eingeben!"); form.Name.focus(); return false; } if (form.Mail.value.indexOf("@") == -1) { alert("Keine E-Mail-Adresse!"); form.Mail.focus(); return false; } var alter=form.Alter.value; if (parseInt(alter) != alter ) { alert("Altersangabe fehlt oder ist keine Zahl!"); form.Alter.focus(); return false; } } </script> </head> 276 / 446 WWW-Grundlagen Javascript Beispiele <body> <h1>Formular</h1> <form id="Formular" action="http://de.selfhtml.org/cgi-bin/formview.pl" method="post" onsubmit="return pruefe(this)" > <pre> Name: <input type="text" size="40" name="Name"> E-Mail: <input type="text" size="40" name="Mail"> Alter: <input type="text" size="40" name="Alter"> Formular: <input type="submit" value="Absenden"> <input type="reset" value="Abbrechen"> </pre> </form> </body> </html> 277 / 446 WWW-Grundlagen Javascript Beispiele Javascript-Beispiel mit Objektdefinition <html><head><title>Test</title> <script type="text/javascript"> function Farbe (rot, gruen, blau) { this.r = rot; this.g = gruen; this.b = blau; this.toString = function (){ return "#"+this.r+this.g+this.b; } } function farbeWechseln () { var hellgruen = new Farbe("E0", "FF", "E0"); document.bgColor = hellgruen.toString(); } </script></head> <body bgcolor="#FFFFFF"> <h1>Das eigene Farb-Objekt mit JavaScript</h1> <a href="javascript:farbeWechseln()">Hintergrundfarbe wechseln</a> </body> </html> 278 / 446 WWW-Grundlagen Javascript Beispiele Cookies in Javascript vordefiniertes document-Attribut: cookie <script type="text/javascript"> var ablauf = new Date(); var infuenfTagen = ablauf.getTime() + (5 * 24 * 60 * 60 * 1000); ablauf.setTime(infuenfTagen); if (navigator.cookieEnabled){ document.cookie = "name=SELFHTML; expires=" + ablauf.toGMTString(); alert(document.cookie); } </script> 279 / 446 WWW-Grundlagen Javascript Ajax Ajax „Asynchroneous Javascript + CSS + DOM + XMLHttpRequest“ Sammlung von Techniken, um WWW-GUI agiler zu gestalten übliches WWW-Kommunikationsschema: Formular abschicken neue HTML-Dokument empfangen Bildschirm neu aufbauen WWW-Interaktion mit Ajax feinkörniges Laden von Daten im Hintergrund (typisch: einzelne HTML-Elemente als XML-DOM-Baum) partielle Seitenaktualiserung nach Empfang (mit den Javascript-DOM-Operationen) Bekannte Anwendungen: Google Suggest/Maps/Mail/Calendar 280 / 446 WWW-Grundlagen Javascript Ajax Beispiel: Online-Landkarten Szenario Webanwendung zeigt Kartenausschnitt: Bilddatei Benutzer verschiebt Karte Neuer Ausschnitt muss angezeigt werden Klassische WWW-Interaktion Mit einem GET-Request neue Koordinaten an Server übertragen neuen Kartenausschnitt (Bilddatei) laden und anzeigen (Beispiel: Wanderwege Tirol, http://gis2.tirol.gv.at/scripts/esrimap.dll?Name=wander&Cmd=Start) 281 / 446 WWW-Grundlagen Javascript Ajax Ajax: Kartenbild ist in kleine Kacheln zerlegen Beim Verschieben benötigte Kacheln im Hintergrund nachladen. Die CSS-Positionsattribute aller Teilbilder werden angepasst und damit das Boxmodell des neuen Kartenausschnitt konstruiert. Nach Empfang eines Teilbilds wird es in den DOM-Baum eingefügt und per CSS sichtbar gemacht. Dies hat keine Auswirkungen auf den Rest des Browserfensters. 282 / 446 WWW-Grundlagen Javascript Ajax XMLHttpRequest Javascript-Objekt zum Laden von Daten im Hintergrund Übertragungsvorgang hat 4 Zustände (request.readyState) Zustandsänderung: Aufruf einer vorher zu registrierenden Callback-Funktion (request.onreadystatechange) Callback-Funktion kann nach Erhalt der Daten den DOM-Baum modifizieren Serverdaten als Text und als XML-DOM-Baum verfügbar (request.responseText, request.responseXML) 283 / 446 WWW-Grundlagen Javascript Ajax Beispiel für XMLHttpRequest <script type="text/javascript" language="javascript"> function sendeRequest(url) { if (window.XMLHttpRequest) { // Mozilla, Safari,... http_request = new XMLHttpRequest(); http_request.onreadystatechange = reagiere; http_request.open(’GET’, url, true); http_request.send(null); else if (window.ActiveXObject) { ... Code für Internet Explorer ... } } 284 / 446 WWW-Grundlagen Javascript Ajax function reagiere () { if (http_request.readyState == 4) { if (http_request.status == 200) { alert(http_request.responseText); } else { alert(’Bei dem Request ist ein Problem aufgetreten.’); } } } </script> <span style="cursor: pointer; text-decoration: underline; color: blue" onclick="sendeRequest(’test.html’)">Einen Request absetzen </span> Codierung teilweise Browser-abhängig Nachladen nur vom Server, der die aktuelle Seite geliefert hat 285 / 446 WWW-Grundlagen Javascript Ajax Attribute und Methoden des XMLHttpRequest Methoden open(HTTP-Methode, URL, asyncFlag) send( requestAttribute ) abort() setRequestHeader( key, value ) getResponseHeader( key ) getAllResponseHeaders() initialisieren absenden, Parameter bei GET-Request: null Bricht eine aktuell laufende Anfrage ab Attribute onreadystatechange readyState status, statusText responseText responseXML Handler-Callback-Methode 0=uninitialized, 1=loading, 2=loaded, 4=complete HTTP-Status Serverantwort als Text-String Serverantwort XML-Dokument 3=interactive, 286 / 446 WWW-Grundlagen Javascript Ajax Javascript-/Ajax-Frameworks Viele Web-Anwendungen sind „rich clients“ Benutzeroberfläche / Interaktionsverhalten ähnelt klassischer GUI Ajax für inkrementelle Aktualisierung der Benutzersicht Problem Javascript-Code wegen vieler Browser-Fallunterscheidungen unhandlich Javascript-/Ajax-Framework ist eine Sammlung wiederverwendbarer Javascript-Definitionen versteckt Browser-Fallunterscheidungen erleichtert DOM-Operationen erleichtert Ajax-Requests definiert ggf. GUI-Bausteine („widget sets“) Beispiele: prototype, dojo, jquery, extjs, Google Web Toolkit (GWT) 287 / 446 WWW-Grundlagen Webserver Webserver Merkmale Webserver kann ein sehr einfaches, kleines Programm sein Oft in netzwerkfähigen Geräten vorhanden (Drucker, Router, Telefonanlage), ermöglicht dann Konfiguration per Browser Grundfunktion: HTTP Requests beantworten Statische Ressourcen (HTML-Dokumente, Bilder, . . . ) aus dem Dateisystem verschicken externe Programme aufrufen, die HTTP-Antwort dynamisch erzeugen (CGI-Schnittstelle) 288 / 446 WWW-Grundlagen Webserver Erweiterte Funktionen eines Webservers Zuordnung zwischen logischen und realen Pfaden verwalten Zugriffsrechte verwalten/prüfen Zugriffsprotokoll führen Scripting direkt unterstützen (z.B. PHP-Plugin) 289 / 446 WWW-Grundlagen Webserver CGI – Common Gateway Interface CGI - Common Gateway Interface CGI: einfache serverseitige Technik zur Beantwortung von HTTP-Requests. Prinzip Webserver assoziiert mit einem URL ein Programm oder Script Programmiersprache: beliebig Standardeingabe: HTTP-Request-Rumpf Sonstige Request-Daten: Umgebungsvariablen Standardausgabe: HTTP-Antwortrumpf 290 / 446 WWW-Grundlagen Webserver CGI – Common Gateway Interface CGI Umgebungsvariablen Umgebungsvariablen für CGI (Auswahl) QUERY_STRING CONTENT_LENGTH REQUEST_METHOD HTTP_HOST HTTP_COOKIE HTTP_REFERER HTTP_USER_AGENT PATH_INFO SERVER_NAME SERVER_PORT SCRIPT_NAME kompletter URL Größe des Request-Rumpfs in Byte HTTP-Methode Adresse des HTTP-Client HTTP-Cookies URL des ursprünglichen HTML-Dokuments Name und Version des Browsers Pfad-Anteil des URL hinter CGI-Adresse Name und IP des Webservers Request TCP Port Pfadanteil von Server-Root zum Script weitere Variablen: http://de.selfhtml.org/servercgi/cgi/umgebungsvariablen.htm 291 / 446 WWW-Grundlagen Webserver CGI – Common Gateway Interface Umgebungsvariablen („Environment“) Was sind Umgebungsvariablen? Betriebssystemkonzept: Jeder Prozess hat einen Speicherbereich für Umgebungsvariablen Übergabemöglichkeiten von Informationen bei Programmaufruf: Parameterübergabe Umgebungsvariablen Umgebungsvariablen sind Zeichenketten der Form NAME=WERT Zugriff auf Umgebungsvariablen abhängig von Programmiersprache 292 / 446 WWW-Grundlagen Webserver CGI – Common Gateway Interface Zugriff auf Betriebssystem-Umgebungsvariablen in Java Umgebungszugriff mit System.getenv() import java.util.*; public class Umgebung { public static void liste () { Map systemUmgebung = System.getenv(); Set namen = systemUmgebung.keySet(); for (Iterator i=namen.iterator(); i.hasNext(); ) { Object name = i.next(); Object wert = systemUmgebung.get(name); System.out.println(String.format("%s = %s", name, wert)); } } } 293 / 446 JEE Teil IV JEE – Java Enterprise Technologie 294 / 446 JEE 13 Überblick APIs Architekturmodelle Komponentenmodell 14 Java Server Pages Scriptlets JSP-Ausdrücke Deklarationen Vordefinierte Objekte Sitzungen Scope und Lebensdauer Direktiven JSP und Beans JSPX Eliminierung von Java-Code Expression Language Tags JSTL 15 16 Servlets 17 18 JNDI Java-Frameworks für Webapplikationen Model View Controller Struts und JSF Java Server Faces Enterprise Java Beans Fallbeispiel Applikationsserver Persistenz Session Bean Message Driven Bean EJB-Schnittstellen EJB-Alternativen 295 / 446 JEE Überblick Java Enterprise Merkmale Framework zur Entwicklung der Serverseite von Web-Anwendungen Entwicklungsplattform „Java Platform Enterprise Edition“ (JEE) vor allem für größere Projekte mit hohen Anforderungen an Sicherheit, Performanz und Stabilität umfangreich und komplex! 296 / 446 JEE Überblick Wie sieht JEE konkret aus? Architekturmodelle (3-tier, 4-tier) Spezielle Entwurfsmuster (z.B. „front controller“) APIs (z.B. JDBC, EJB, JNDI) Bibliotheken (z.B. JSTL, Klassenbibliotheken für die APIs) Entwicklungswerkzeuge (z.B. Eclipse-Plugins) Spezielle Laufzeitumgebungen (z.B. Tomcat, JBOSS, Glassfish) Frameworks (z.B. Struts, Java Server Faces) 297 / 446 JEE Überblick Grundlegende JEE-Begriffe und Techniken Servlet universell einsetzbare Komponente zur dynamischen HTML-Erzeugung zur Interaktionssteuerung zur Kapselung von Geschäftslogik JSP (Java Server Page): dynamische HTML-Erzeugung JSP-Tag-Bibliothek: Tags zum Verstecken von Code Daten-Bean: Container für Anwendungsdaten EJBs (Enterprise Java Bean): kapselt Sitzungslogik, Daten, Nachrichten Servlet-Container: Ausführung von Servlets und JSPs JEE-Applikationsserver: Ausführung von EJBs 298 / 446 JEE Überblick APIs Wichtige JEE-APIs JDBC (Java Database Connectivity) Datenbankzugriff per SQL JNDI (Java Naming and Directory Interface) Zugriff auf Verzeichnisdienste JPA (Java Persistence API) Speicherung von Java-Objekten in SQL-Datenbanken JAX-WS Implementierung und Nutzung von Webservices JMS (Java Messaging Service) Zugriff auf MOM-Nachrichten-Server JAXP (Java API for XML Processing) JAXB (Java XML Binding) 299 / 446 JEE Überblick Architekturmodelle JEE-Architekturmodell mit 4 Ebenen („tiers“) Quelle: http://java.sun.com/javaee/5/docs/tutorial 300 / 446 JEE Überblick Architekturmodelle Kommunikationsmodell für Java- und Web-Applikationen Quelle: http://java.sun.com/javaee/5/docs/tutorial 301 / 446 JEE Überblick Architekturmodelle JEE-Architekturmodell mit EJBs in der Geschäftsebene Quelle: http://java.sun.com/javaee/5/docs/tutorial 302 / 446 JEE Überblick Architekturmodelle APIs im JEE-Architekturmodell Quelle: http://java.sun.com/javaee/5/docs/tutorial 303 / 446 JEE Überblick Komponentenmodell Komponenten und Container JEE-Komponente enthält fachliche Funktionen („Geschäftslogik“) ist kein für sich alleine lauffähiges Programm benötigt einen Container als Laufzeitumgebung Container liefert anwendungsunabhängige „technische“ Funktionen (z.B. Transaktionssteuerung, Lastverteilung, Verzeichnisdienst) Containertypen: Servlet-Container für Servlets und JSPs Applikationsserver (für EJBs und alle anderen Arten) Integration einer Komponente in den Container: „Deployment“ („Bereitstellung“) 304 / 446 JEE Java Server Pages Java Server Pages – JSP Eine JSP ist ein HTML-Dokument mit dynamischen Anteilen. Wie sehen die „dynamischen Anteile“ aus? früher: beliebiger Java-Code (problematisch!) moderne Variante: JSP-Tags + „Unified Expression Language“ JSP-Tag: XML-Tag, hinter dem sich Java-Code verbirgt Unified EL: Repräsentation von Werten, für JSP und JSF Konstruktion des HTML-Dokuments JSP wird in ein Servlet übersetzt Servlet wird bei HTTP-Request aufgerufen Servlet erzeugt HTML-Dokument Kontrolle des Prozesses: Servlet-Container 305 / 446 JEE Java Server Pages Grundlagen der JSP- und Servlet-Verarbeitung Servlet-Klasse und service-Methode Servlet definiert eine Servlet-Klasse mit einem Objekt service-Methode der Servlet-Klasse bearbeitet HTTP-Request Deployment JSP wird vom JSP-Compiler in ein Servlet transformiert Administrator vergibt für das Servlet einen URL Laufzeit: HTTP-Request Container lädt Servlet-Klasse bei erstem Zugriff Container ruft bei Request service-Methode auf, übergibt Request-Objekt für die Request-Daten Response-Objekt für die Antwort-Daten 306 / 446 JEE Java Server Pages Einfaches JSP-Beispiel: datum.jsp <html> <title> JSP-Beispiel </title> <body> Dies ist eine dynamische JavaServer Page. <br/> Datum und Uhrzeit: <%= new java.util.Date() %> </body> </html> service-Methode des daraus generierten Servlets ... out.println out.println ... out.println out.println ... ("<html>"); (" <title> JSP-Beispiel </title>"); (" Datum und Uhrzeit: "); (new java.util.Date()); 307 / 446 JEE Java Server Pages Scriptlets JSP-Scriptlets Java-Fragment mit Variablendefinitionen und Anweisungen Syntax: <% . . . Java-Code . . . %> Code wird in den Rumpf der service-Methode eingebettet Variablen sind lokale Variablen der service-Methode (nicht Request-übergreifend verfügbar) Ausgaben des Scriptlets: keine automatische HTML-Erzeugung für HTML-Antwort: vordefiniertes PrintWriter -Objekt out System.out: Protokolldatei oder Konsole des Containers 308 / 446 JEE Java Server Pages JSP-Ausdrücke JSP-Ausdrücke: Werte berechnen und ausgeben Java-Fragment für einen Wert, automatische Ausgabe Syntax: <%= . . . Java-Ausdruck . . . %> Jeder JSP-Ausdruck beinhaltet einen Java-Ausdruck. Ausdruck wird bei Request-Bearbeitung ausgewertet Wert wird anstelle des JSP-Ausdrucks in HTML-Ausgabe geschrieben 309 / 446 JEE Java Server Pages JSP-Ausdrücke Beispiel: BMI-Rechner <%-- hier kommt ein Scriptlet: <% --%> float gewicht=83.5, groesse=1.81, bmi; bmi = gewicht / (groesse * groesse); %> <html> <title> BMI-Berechnung mit festen Werten </title> <body> <p> Bei einem Gewicht von <%= gewicht %> kg und einer Größe von <%= groesse %> cm ist der BMI <%= bmi %>. </p> <p> Wenn dein BMI über 24 liegt, bist du zu schwer! </p> </body> </html> 310 / 446 JEE Java Server Pages Deklarationen JSP-Deklarationen Eine JSP-Deklaration erweitert die Servlet-Klasse Syntax: <%! . . . Java-Deklarationen . . . %> Variablen und Methoden kommen in die Servlet-Klassendefinition Variablen Request-übergreifend und von Clients gemeinsam benutzt Beispiel: Webseite mit Zugriffszähler <%! int zaehler = 1; %> <html> <head><title> Zugriffszähler </title></head> <body> Sie sind der <%= zaehler++ %>. Besucher dieser JSP. </body> </html> 311 / 446 JEE Java Server Pages Vordefinierte Objekte Vordefinierte JSP-Objekte Objekt out Typ und Verwendung javax.servlet.jsp.JSPWriter request zum Schreiben des Inhalts der HTTP-Antwort javax.servlet.http.ServletRequest response zum Auslesen aller Request-Daten javax.servlet.http.ServletResponse session zum Erzeugen der Antwort javax.servlet.http.HttpSession application zur Sitzungsverwaltung javax.servlet.ServletContext config Anwendungskontext (z.B. Version der Servlet-API) javax.servlet.http.ServletConfig pageContext Zugriff auf Container-Konfiguration javax.servlet.jsp.PageContext Zugriff auf die anderen vordefinierten Objekte 312 / 446 JEE Java Server Pages Vordefinierte Objekte Requestdaten auslesen Methoden des vordefinierten Objekts „request“ getParameterNames() getParameter(name) getHeaderNames() getHeader(name) getMethod() getRequestURI() getContentType() getCookies() getLocales() Namen aller Parameter Wert eines Parameters Namen aller HTTP-Header Wert eines HTTP-Headers Requesttyp Request-URI MIME-Typ des Requestrumpfs Namen der Cookies bevorzugte Sprachen 313 / 446 JEE Java Server Pages Vordefinierte Objekte Beispiel: Schema zur Verarbeitung der Parameter Auslesen aller Request-Parameter <% java.util.Enumeration paramNamen = request.getParameterNames(); while (paramNamen.hasMoreElements()) { String name = (String) paramNamen.nextElement(); String wert = request.getParameter(name); // Verarbeitung von name und wert ... } %> HTTP-Header und Cookies werden in gleicher Weise verarbeitet Expression Language bietet kürzere Notationen, z.B. ${param} statt request.getParameterNames() 314 / 446 JEE Java Server Pages Vordefinierte Objekte Beispiel: Schema für Browser-spezifische Antwort Browsertyp und -version im HTTP-Header „User-Agent“ <% String userAgent = request.getHeader("User-Agent"); if (userAgent != null) if (userAgent.indexOf("MSIE") != -1) .... else if (userAgent.indexOf("Safari") != -1) ... %> 315 / 446 JEE Java Server Pages Sitzungen Web-Sitzungen Problem Bei Webanwendungen häufig Dialoge über mehrere Requests HTTP hat kein Sitzungskonzept Technische Realisierungsmöglichkeiten Server erzeugt Sitzungsnummer für ersten (sitzungslosen) Request Die Nummer wird so an den Browser übermittelt, dass dieser sie bei allen Folge-Requests wieder zurückschickt: als Cookie (Standardverfahren, nur wenn Browser Cookies akzeptiert) im URL codiert („URL-Rewriting“) als verstecktes Formularfeld SSL-Sitzungen: SSL-Sitzungskonzept verwendbar 316 / 446 JEE Java Server Pages Sitzungen Sitzungsdaten speichern mit dem JSP Session-Objekt JSP-Objekt session Sitzungsnummern auf der Basis von Cookies oder URL-Rewriting automatisierter Cookie-Mechanismus mit Sitzungsnummer-Cookie „JSESSIONID“ URL-Rewriting erfordert explizite Programmierung mit response.encodeURL( String ) Schnittstelle für die Sitzungsattribute: setAttribute (Name, Wert) getAttribute (Name) removeAttribute (Name) 317 / 446 JEE Java Server Pages Scope und Lebensdauer Scope und Lebensdauer benutzerdefinierter JSP-Attribute Page Scope Attribute existieren nur für die Dauer der Request-Bearbeitung nur innerhalb einer JSP-Seite verwendbar technisch: lokale Objekte der service-Methode Request Scope Attribute existieren nur für die Dauer der Request-Bearbeitung verwendbar in allen JSPs und Servlets, die an der Request-Bearbeitung beteiligt sind Session Scope Request-übergreifend innerhalb einer Sitzung verwendbar Application Scope Request-übergreifend von allen Clients gemeinsam benutzbar 318 / 446 JEE Java Server Pages Scope und Lebensdauer JSP-Scopes und Attribute Vordefinierte Scope-Objekte page, request, session, application „Anheften“ von Attributen void setAttribute(String name, Object wert) Object getAttribute(String name) void removeAttribute(String name) Objekt-spezifische sonstige Möglichkeiten z.B. request.getParameter Das page-Objekt ist technisch einfach nur eine Referenz auf die aktuelle Servlet-Instanz (also this) 319 / 446 JEE Java Server Pages Direktiven JSP-Direktiven: Instruktionen für JSP-Compiler include-Direktive zum Einbinden gemeinsam benutzbarer JSP-Fragmente Syntax: <%@ include file=" ... Pfad ..." %> taglib-Direktive Tag-Bibliothek: Sammlung benutzerdefinierter Aktionen Syntax: <%@ taglib uri="..." prefix="..." %> Standardbibliothek: JSTL – Java Standard Tag Library 320 / 446 JEE Java Server Pages Direktiven page-Direktive verschiedene Verwendungsaspekte über Attribute konfigurierbar Beispiel: <%@ page contentType="text/html" session="false" import="java.util.*, java.io.*" %> Attribute Attribut Default import session isThreadSafe errorPage contentType pageEncoding true true Verwendung Import von Klassen und Paketen Wird eine Sitzungsverwaltung gebraucht? Ist nebenläufiger Zugriff möglich? Verweis auf Fehlerbehandlungs-JSP MIME-Typ der Antwort Zeichencodierung 321 / 446 JEE Java Server Pages Direktiven Beispiel: BMI-Rechner, Version 2 Beispiel für Nutzung der Direktiven: page und include Auslesen der Request-Parameter unübersichtliche Mischung aus HTML und Script-Code bmiBerechnung.jsp <%! float bmiBerechnung (float gewicht, float groesse) { return gewicht / (groesse*groesse); } %> 322 / 446 JEE Java Server Pages Direktiven bmi.jsp <%@ contentType="text/html" pageEncoding="UTF-8" %> <%@ include file="bmiBerechnung.jsp" %> <% float gewicht, groesse, bmi; boolean gueltigeParams = true; try { gewicht = Float.parseFloat(request.getParameter("gewicht")); groesse = Float.parseFloat(request.getParameter("groesse")); } catch (Exception e) { gueltigeParams = false; } 323 / 446 JEE Java Server Pages Direktiven if (gueltigeParams) { bmi = bmiBerechnung (gewicht, groesse); %> <html> <title> Ergebnis der BMI-Berechnung </title> <body> <p> Bei einem Gewicht von <%= gewicht %> kg und einer Größe von <%= groesse %> cm ist der BMI <%= bmi %>. </p> </body> </html> <% } else { %> <html> <title> Fehler bei BMI-Berechnung </title> <body> <p> Sie müssen in beiden Feldern Zahlen eingeben <p> <p> <a href="..."> Zurück zum Formular </a> </p> </body> </html> <% } %> 324 / 446 JEE Java Server Pages JSP und Beans Java Beans: Datencontainer Merkmale einer Bean-Klasse parameterloser Konstruktor Attribute („properties“) mit get- und/oder set-Methoden Für ein Attribut xxx heißen die Methoden: getXxx bzw. setXxx Beispiel public class Bmi { private float groesse; private float gewicht; public Bmi() {} public float getGroesse() { return groesse; } public void setGroesse(float neueGroesse) { groesse=neueGroesse; } ... 325 / 446 JEE Java Server Pages JSP und Beans JSP und Java Beans: Kapselung von Formulardaten Bean gehört zu einem JSP-Scope automatische Übertragung von Formulardaten (inkl. Typkonversion) Standardaktionen Bean-Deklaration Attribut setzen Attribut lesen <jsp:useBean ... /> <jsp:setProperty ... /> <jsp:getProperty ... /> Beispiel <jsp:useBean id="bmiFormular" class="bmi" scope="session" /> <jsp:setProperty name="bmiFormular" property="gewicht" value="<% request.getParameter("gewicht") %>" /> 326 / 446 JEE Java Server Pages JSP und Beans Vorteile der Bean-Nutzung in JSPs Gleiche Attributnamen in Formular und Bean: automatisierte Übertragung <jsp:useBean id="bmiFormular" class="bmi" scope="session" /> <jsp:setProperty name="bmiFormular" property="*" /> automatisierte Typkonversionen String ↔ Attributtyp Die JSP wird von Java-Code befreit 327 / 446 JEE Java Server Pages JSPX JSPX: XML-Notation für JSP Vegleich: Traditionelle und XML-Syntax traditionell <% ... %> <%= ... %> <%! ... %> freier Text XML <jsp:scriptlet> <jsp:expression> <jsp:declaration> <jsp:text> ... ... ... ... </jsp:scriptlet> </jsp:expression> </jsp:declaration> </jsp:text> JSP auf XHTML-Basis: wohlgeformtes XML-Dokument Container erlauben Mischung der Notationen 328 / 446 JEE Java Server Pages JSPX Beispiel für JSPX-Syntax <?xml version="1.0" encoding="utf-8"?> <jsp:root xmlns="http://www.w3.org/1999/xhtml" xmlns:jsp="http://java.sun.com/JSP/Page" version="2.0"> <jsp:output doctype-root-element="html" doctype-public="-//W3C//DTD XHTML 1.1//EN" doctype-system="http://www.w3c.org/TR/xhtml11/DTD/xhtml11.dtd" /> <jsp:directive.page contentType="text/html; charset=utf-8" language="java" /> <html xmlns="http://www.w3.org/1999/xhtml"> ... </html> </jsp:root> 329 / 446 JEE Java Server Pages Eliminierung von Java-Code JSP 2: Eliminierung von Java-Code Aktionen: JSP-Tags statt Scriptlets JSTL-Tags oder in JSP definierte Anwender-Tags bei Verwendung eines Frameworks: Tags des Frameworks Werte: Expression Language statt JSP-Expressions mit dem JSF-Framework (Java Server Faces) gemeinsam benutzte „Unified Expression Language“ Container unterstützen eine Mischung aus klassischer und neuer Syntax 330 / 446 JEE Java Server Pages Expression Language Unified Expression Language (EL) Wozu EL-Ausdrücke? Auslesen und Ändern von Daten Request-Header Formulardaten Bean-Attribute implizite Objekte Methodenaufrufe, viele vordefinierte Operationen, benutzerdefinierte Funktionen Verwendung JSP-Tags im statischen Text 331 / 446 JEE Java Server Pages Expression Language Beispiele Verwendung im statischen Text <irgendein:tag> irgendein text ${expr} irgendein text </irgendein:tag> Verwendung in einem Tag-Attributwert <irgendein:tag value="${expr}" /> Ausdrucks-Beispiele ${header["User-Agent"]} ${param["vorname"]}, ${param[’vorname’]}, ${param.vorname} ${!empty param.nachname} ${param.alter + 100} ${warenkorb.summe > 100} ${zahlung == "vorkasse"} ${sessionScope.warenkorb.betragSumme} ${meineFunktionen:istEmailAdresse(param.email)} 332 / 446 JEE Java Server Pages Expression Language Weitere Merkmale der „Unified Expression Language“ verzögerte Auswertung von Ausdrücken ( Syntax: #{...} ) Erweiterung durch benutzerdefinierte Funktionen Ausdrücke, die Referenzen repräsentieren („lvalue“-Expression) Benutzerdefinierte Auswertungsalgorithmen („pluggable resolver“) 333 / 446 JEE Java Server Pages Tags JSP-Tags: XML-Tags für Aktionen JSP-Tags sind syntaktisch XML-Elemente repräsentieren externen Java-Code ersetzen Scriptlets Vorteile: Bessere Lesbarkeit der JSP-Seiten Vereinfachte Wiederverwendbarkeit des Java-Codes Tag-Definitionen Standardbibliothek JSTL: Java Standard Tag Library Framework-Bibliotheken (z.B. Struts-Tags) Benutzer-definierte Tags 334 / 446 JEE Java Server Pages Tags Tag-Definitionen: Tag-Bibliotheken oder Tag-Dateien Unterschiede Tag-Bibliotheken werden in Java implementiert, unterstützen beliebig komplexe Tags Tag-Dateien sind eher einfache JSP-“Makros“ In der Regel wird der Anwendungsprogrammierer vordefinierte Bibliotheken mit selbstdefinierten Tag-Dateien kombinieren Tag-Bibliotheken Bestandteile: XML-Beschreibungsdatei („tag library descriptor“) Java-Implementierung: Tag-Handler-Klassen JSP-Einbindung: taglib-Direktive Deklaration in der Containerkonfigurationsdatei 335 / 446 JEE Java Server Pages Tags Tag-Dateien für einfache Tags Einfache Tags repräsentieren wiederverwendbaren JSP-Code sind mit Attributen parameterisierbar werden i.d.R. ohne Java-Codierung in JSP definiert erlauben Java-Scripting in den Attributen und im Rumpf Deployment Pro Tag wird eine Datei mit der Definition erstellt (.tag) Container-Konfiguration ist nicht nötig Der Tag-Handler wird vom JSP-Compiler automatisch erzeugt 336 / 446 JEE Java Server Pages Tags Vorteile Tag-Definition wird stark vereinfacht Entwickler sind motiviert, eigene Tags statt Scriptlets zu schreiben Standardbibliotheken und einfache Tags reichen meist aus 337 / 446 JEE Java Server Pages JSTL Die JSTL Die JSTL definiert JSP-Tags für häufig benötigte Funktionen, z.B. Iteratoren und bedingte Anweisungen String-Funktionen URL-Verwaltung Verarbeitung von XML-Dokumenten (Parser, XSLT, XPath) Internationalisierung von Web-Seiten (I18N) Datenbankzugriff mit SQL 338 / 446 JEE Java Server Pages JSTL JSTL-Module und Tag-Präfixe c x fmt sql fn (core) (XML) (I18N) (SQL) (functions) Grundfunktionalität XML Internationalisierung DBMS-Zugriff Hilfsfunktionen (vor allem String-Funktionen) 339 / 446 JEE Java Server Pages JSTL JSTL-Beispiele: Variablen Variable definieren und verwenden <c:set var="farbe" value="rot" /> ... <irgendein:tag irgendeinAttribut="${farbe}" /> ... <tr> <td> Farbe: </td> <td> ${farbe} </td> </tr> Über Variablen können Tags Daten austauschen Variablen können in JSP-Scopes gespeichert werden <c:set var="userid" scope="session" value="${param.user}" /> 340 / 446 JEE Java Server Pages JSTL JSP-Beispiele Bedingte Anweisung <c:if test="${param.kaufen}"> <strong> Danke für Ihren Auftrag! </strong><br> </c:if> Schleife: HTTP-Header anzeigen <table ... > <tr><th> Name </th> <th> Wert </th></tr> <c:forEach var="hname" items="${pageContext.request.headerNames}"> <c:forEach var="hvalue" items="${headerValues[hname]}"> <tr><td> <c:out value="${hname}" /> </td> <td> <c:out value="${hvalue}" /> </td> </tr> </c:forEach> </c:forEach> 341 / 446 JEE Java Server Pages JSTL JSP-Beispiele: XML-Verarbeitung Eine XML-Bücherliste (booklist) wird in die JSP importiert. (URL ist ein Init-Parameter, die XML-Datei wird ggf. mit GET-Request geladen) Der XML-Parser erzeugt einen DOM-Baum als Application-Objekt. Mit dem Request-Parameter bookId wird ein dynamischer XPath-Ausdruck zur Selektion des Buchs konstruiert, der Buchtitel serialisiert, und in die Antwort geschrieben. 342 / 446 JEE Java Server Pages JSTL <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <%@ taglib uri="http://java.sun.com/jsp/jstl/XML" prefix="x" %> <c:if test="${applicationScope:booklist == null}" > <c:import url="${initParam.booksURL}" var="xml" /> <x:parse doc="${xml}" var="booklist" scope="application" /> </c:if> <x:set var="selectedbook" select="${applicationScope.booklist/books/book[@id=$param:bookId]}" /> <h2><x:out select="$selectedbook/title"/></h2> 343 / 446 JEE Java Server Pages JSTL Eigene JSP-Tags Ein JSP-Tag ist syntaktisch ein XML-Element und besteht insofern aus Start-Tag (ggf. mit Attributen), Inhalt und Ende-Tag JSP-Tags sind flexibel verwendbar: Parameterisierbarkeit durch Attribute Werte können an die aufrufende JSP zurückschickt werden Datenaustausch der Tags untereinander möglich Tag sind verschachtelbar uneingeschränkter Zugrif auf implizite JSP-Objekte (request, session, usw.) 344 / 446 JEE Java Server Pages JSTL Tag-Handler Ein Java-Tag-Handler ist eine Klasse mit mehreren Methoden, deren Aufrufzeitpunkt an die syntaktische Struktur des Tags gebunden ist: Handler-Methode Aufrufzeitpunkt beim Parsen doStartTag() Start-Tag doInitBody() vor Bearbeitung des Rumpfs doAfterBody() nach Bearbeitung des Rumpfs doEndTag() Ende-Tag Die Klasse javax.servlet.jsp.tagext.TagSupport definiert leere Handler-Methoden und ist als Basisklasse für Tag-Handler gedacht 345 / 446 JEE Java Server Pages JSTL Beispiel: Java-Handler für ein <datum />-Tag package ibs; import java.io.IOException; import javax.servlet.jsp.JspWriter; import javax.servlet.jsp.tagext.Tag; import javax.servlet.jsp.tagext.TagSupport; public class DatumTag extends TagSupport implements Tag { public int doStartTag() { try { JspWriter out = pageContext.getOut(); out.print(new java.util.Date()); } catch (IOException e) { e.printStackTrace(); } // keine Verarbeitung des Rumpfs return SKIP_BODY; } } 346 / 446 JEE Java Server Pages JSTL Taglib-Deskriptor Taglib-Deskriptor: .tld-Datei enthält die verwendete Taglib-Version enthält die Tag-Definitionen (Name, Attribute) ordnet jedem Tag den zuständigen Java-Tag-Handler zu Beispiel <taglib xmlns="http://java.sun.com/xml/ns/javaee" ... <tlib-version>1.0</tlib-version> <short-name>mt</short-name> <uri>/BeispielTags</uri> <tag> <name>datum</name> <tag-class>ibs.DatumTag</tag-class> <body-content>empty</body-content> </tag> </taglib> 347 / 446 JEE Java Server Pages JSTL Einbindung und Nutzung Einbinden in eine JSP durch: <%@ taglib uri="/meineTags" prefix="mt" %> Nutzung in der JSP durch: <mt:datum /> 348 / 446 JEE Java Server Pages JSTL Beispiel: Tag-Datei für einfaches Tag mit Attributen Definition in der Tag-Datei hallo.tag <%@ attribute name="halloText" required="true" %> <%@ attribute name="name" required="true" %> <h2 style="color:red"> ${halloText}, ${name}! </h2> Verwendung Der Tag-Name ergibt sich aus dem Dateinamen: hallo Einbinden in die JSP: alle Tag-Dateien sind im selben Verzeichnis (tagdir) <%@ taglib tagdir="/WEB-INF/tags" prefix="meinetags" %> keine Container-Konfiguration nötig! 349 / 446 JEE Java Server Pages JSTL Verwendung des hallo-Tags in einer JSP <%@ taglib tagdir="/WEB-INF/tags" prefix="meinetags" %> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %> <html> <head><title>Willkommen</title></head> <body> <c:set var="text" value="Guten Tag" /> <h1> ${text}, wie ist dein Name? </h1> <form method="get"> <input type="text" name="username" size="25"> <input type="submit" value="Submit"> <input type="reset" value="Reset"> </form> <c:if test="${fn:length(param.username) > 0}" > <meinetags:hallo halloText="${text}" name="${param.username}" /> </c:if> </body> </html> 350 / 446 JEE Servlets Servlets: Interface und Klassen << interface >> Servlet Servlets implementieren Interface javax.servlet.Servlet Servlet-Methoden sind u.a. init() service() destroy() ... GenericServlet init - Initialisierung service - Request bearbeiten destroy - beenden GenericServlet: Basisklasse für protokollspezifische Servlets Subklasse HttpServlet: HTTP-Requests { abstract } ... HttpServlet { abstract } doGet() doPost() ... DatumServlet 351 / 446 JEE Servlets Servlets: Methoden und Objekte service-Methode bearbeitet Web-Request Delegation an: doGet, doPost, . . . Servletobjekt bearbeitet mehrere Requests Lastverteilung möglich: mehrere Instanzen Parameter von „service“: Request, Response Request-unabhängige Informationen: PageContext ServletConfig-Objekt Session-Objekt Application-Objekt 352 / 446 JEE Servlets Beispiel für ein einfaches Servlet package IBSBeispiele; import java.io.*; import javax.servlet.*; import javax.servlet.http.*; public class DatumServlet extends HttpServlet { public void service(ServletRequest request, ServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out = response.getWriter(); try { out.println("<html><head><title> DatumServlet </title></head>"); out.println("<body>"); out.println("Datum: " + new java.util.Date()); out.println("</body></html>"); } finally { out.close(); } } 353 / 446 JEE Servlets public String getServletInfo() { return "zeigt Datum und Uhrzeit"; } } Beispiel für ein aus JSP generiertes Servlet package org.apache.jsp; import javax.servlet.*; import javax.servlet.http.*; import javax.servlet.jsp.*; import java.util.*; public final class Beispiel1_jsp extends org.apache.jasper.runtime.HttpJspBase ... private static final JspFactory _jspxFactory = JspFactory.getDefaultFactory(); ... public void _jspService(HttpServletRequest request, HttpServletResponse response) throws ... { PageContext pageContext = null; // Zugriff auf die anderen Objekte HttpSession session = null; // Sitzungsdaten ServletContext application = null; // Servlet-übergreifende Daten ServletConfig config = null; // Konfigurationsdaten JspWriter out = null; // zum Schreiben der Antwortseite Object page = this; ... 354 / 446 JEE Servlets try { response.setContentType("text/html;charset=UTF-8"); pageContext = _jspxFactory.getPageContext(...); application = pageContext.getServletContext(); config = pageContext.getServletConfig(); session = pageContext.getSession(); out = pageContext.getOut(); ... out.write("<html>\n"); out.write(" <head>\n"); out.write(" <title>JSP Page</title>\n"); out.write(" </head>\n"); out.write(" <body>\n"); out.write(" Dynamische JavaServer Page. <br/>\n"); out.write(" Datum und Uhrzeit: "); out.print( new Date()); out.write(" \n"); out.write(" </body>\n"); out.write("</html>\n"); } catch (Throwable t) { ... 355 / 446 JEE Servlets Die Initialisierungsmethode des Servlets: init Schnittstellen public void init() throws ServletException public void init(ServletConfig config) throws ServletException Aufrufzeitpunkt: Nach Erzeugung des Servlet-Objekts Typische Initialisierungsaktionen Kontextinformation vom Container erfragen Datenbankverbindung aufbauen config bietet Zugriff auf die Servlet-Konfiguration, z.B. Initialisierungsparameter aus dem Deployment-Deskriptor Attribute im ServletContext speichern Zugriff auf die Protokolldatei 356 / 446 JEE Servlets Verwendungsschema für init public class BeispielServlet extends HttpServlet { // ServletContext protected ServletContext application = null; public void init(ServletConfig conf) throws ServletException { super.init(conf); // Beispiel für Zugriff auf Initialisierungsparameter: String p = conf.getInitParameter("param1"); // Kontext merken application = conf.getServletContext(); // Attribut im Kontext speichern: application.setAttribute("initzeit", new java.util.Date()); ... } 357 / 446 JEE Servlets Die Destroy-Methode des Servlets wird vom Container bei Beendigung des Dienstes aufgerufen bietet die Möglichkeit, Ressourcen des Servlet freizugeben Beispiel: in der Init-Methode erzeugte Datenbankverbindung wieder schließen 358 / 446 JEE Servlets Servlet-Beispiel: Simple Online-Bank package Bank; import java.io.*; import javax.servlet.*; import javax.servlet.http.*; public class KontoServlet extends HttpServlet { public class Konto { private int betrag = 0; void setBetrag(int neu) { betrag = neu; } int getBetrag() { return betrag; } } Konto kto; public void init(ServletConfig conf) throws ServletException { super.init(conf); kto = new Konto(); } 359 / 446 JEE Servlets public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html"); PrintWriter out = response.getWriter(); out.println("<html><body>"); out.println("<h2> Servlet-Bank - Wir schreiben SERVICE groß</h2>"); out.println("Kontostand: <b>" + kto.getBetrag() + "</b><br>"); out.println("<form method=\"post\" action=\"" + request.getRequestURI() + "\">"); out.println("Betrag: <input type=\"text\" name=\"betrag\"><br>"); out.println("<input type=\"submit\" name=\"abheben\" value=\"abheben\">"); out.println("<input type=\"submit\" name=\"einzahlen\" value=\"einzahlen\">"); out.println("</form>"); out.println("</body></html>"); out.close(); } 360 / 446 JEE Servlets public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { int betrag = 0, kontostand = kto.getBetrag(); try { betrag = Integer.parseInt(request.getParameter("betrag")); } catch (NullPointerException e) { } catch (NumberFormatException e) { } if (request.getParameter("abheben") != null && betrag <= kontostand) kontostand -= betrag; else if (request.getParameter("einzahlen") != null && betrag > 0) kontostand += betrag; synchronized (kto) { kto.setBetrag(kontostand); } doGet(request, response); } public String getServletInfo() { return "Konto-Beispiel"; } } 361 / 446 JEE Servlets Beispiel: Sitzungsmanagement mit Servlets package shop; import java.io.*; import javax.servlet.*; import javax.servlet.http.*; public class Onlineshop extends HttpServlet { public String getServletInfo() { return "OnlineShop Servlet Beispiel"; } protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html"); PrintWriter out = response.getWriter(); out.print("<html><head><title>Online Obstladen</title>" + "</head><body><h1>Obstladen</h1><form method=\"post\">" + "<input type=\"submit\" name=\"apfel\" value=" + "\"Packe einen Apfel in den Korb\"><br />" + "<input type=\"submit\" name=\"birne\" value=" + "\"Packe eine Birne in den Korb\"><br />" + "<input type=\"submit\" name=\"zeige\" value=" + "\"Zeige den Einkaufskorb\"><br />" + "<input type=\"submit\" name=\"kaufe\" value=" + "\"Kaufe den Korbinhalt\">" + "</form></body></html>"); out.close(); } 362 / 446 JEE Servlets protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String msg; HttpSession session = request.getSession(true); if (session.isNew()) { session.setAttribute("apfel", new Integer(0)); session.setAttribute("birne", new Integer(0)); } int apfelAnzahl = (Integer) session.getAttribute("apfel"); int birneAnzahl = (Integer) session.getAttribute("birne"); if (request.getParameter("apfel") != null) { apfelAnzahl++; session.setAttribute("apfel", apfelAnzahl); msg = "Apfel hinzugefügt! Du hast jetzt " + apfelAnzahl + "."; } else if (request.getParameter("birne") != null) { birneAnzahl++; session.setAttribute("birne", birneAnzahl); msg = "Birne hinzugefügt! Du hast jetzt " + birneAnzahl + "."; } else if (request.getParameter("kaufe") != null) { session.invalidate(); msg = "Dein Auftrag " + apfelAnzahl + " Äpfel und " + birneAnzahl + " Birnen wurde ausgeführt. Der Korb ist wieder leer."; } else { msg = "Du hast " + apfelAnzahl + " Äpfel und " + birneAnzahl + " Birnen im Einkaufskorb."; } 363 / 446 JEE Servlets response.setContentType("text/html"); response.setHeader("pragma", "no-cache"); PrintWriter out = response.getWriter(); out.print("<html><head><title>Obstkorb</title></head><body>"); out.print(msg); out.print("<hr><a href=\""); out.print(request.getRequestURI()); out.print("\">Zurück zum Obstladen</a></body></html>"); out.close(); } } 364 / 446 JEE Servlets Servlet-Filter Filterketten mit Servlets Jeder Filter bearbeitet Request- und Response-Objekt Beispiele: Request-Protokollierung, Benutzerauthentifizierung Filterketten-Spezifikation in der Container-Konfiguration Servlet-Filter implementiert javax.servlet.filter Request Servlet− Filter Client Servlet− Filter Servlet− Filter Servlet Antwort 365 / 446 JEE Java-Frameworks für Webapplikationen Struts und Java Server Faces: Frameworks für die Web-Ebene Vereinfachte Programmierung der Serverseite Regel-basierte Spezifikation der Navigationslogik vereinfachte Konstruktion von HTML-Benutzerschnittstellen Validierung von Eingabewerten Vereinfachte Fehlerbehandlung Automatisierte Bean-Verwaltung („managed beans“) Ereignisbehandlung Internationalisierung des Webauftritts 366 / 446 JEE Java-Frameworks für Webapplikationen Model View Controller MVC – Das Entwurfsmuster „Model View Controller“ Generisches Entwurfsmuster für Web-Systeme View: Präsentationsebene, Benutzerschnittstelle Model: Systemmodell mit Geschäftsdaten und Geschäftslogik Controller: Interaktionsssteuerung reagiert auf GUI-Ereignisse sorgt für Aufrufe der zuständigen Model-Operationen vermittelt Eingabedaten an das Model wählt neue Benutzersicht aus überträgt aktualisierte Geschäftsdaten in die Benutzersicht aktualisiert die Benutzersicht 367 / 446 JEE Java-Frameworks für Webapplikationen Model View Controller MVC – Folie von Sun 368 / 446 JEE Java-Frameworks für Webapplikationen Model View Controller Umsetzungsbeispiel für MVC Client (WWW−Browser) 1 Controller (Servlet) 4 2 Model (Web−unabhängig) 3 View (JSP) Ein Front-Controller ist ein Controller, der zwischen einem Web-basierten Frontend und einer Web-unabhängigen Geschäftslogik („back end“) vermittelt. 369 / 446 JEE Java-Frameworks für Webapplikationen Struts und JSF Gemeinsame Merkmale von Struts und JSF Die Anwendungen benutzen das MVC-Muster Ein Servlet agiert als Front-Controller Die Navigation wird über XML-Deskriptoren konfiguriert: Festlegung der Einstiegsseite Zuordnung einer Model-Aktion zum Request anhand von Request-Parametern Auswahl der nächsten Benutzersicht (JSP) abhängig vom Resultat der Model-Aktion HTML-Formulardaten werden mit Formular-Beans synchronisiert Für die GUI-Konstruktion gibt es JSP-Tagbibliotheken Für die Internationalisierung gibt es Ressourcenbündel 370 / 446 JEE Java-Frameworks für Webapplikationen Struts und JSF Struts Historie Apache Open-Source Projekt, seit 2000 ständig weiterentwickelt, stabil, weit verbreitet aktuelle Version: 2.0 Struts-Varianten gibt es auch für PHP und C# Merkmale einer Struts-Anwendung: Action-Servlet und Request-Dispatcher als Front-Controller Anwendungsprogrammierer entwickelt JSPs (für jede HTML-Ansicht) Pro Formular eine ActionForm-Bean zur Datenrepräsentation Pro Formular eine Action-Klasse zur Bearbeitung XML-Deskriptor für die Navigationslogik 371 / 446 JEE Java-Frameworks für Webapplikationen Struts und JSF Kontrollfluss im Struts-Modell 372 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Java Server Faces JSF-Merkmale mehrere Implementierungen (jar-Archive): Sun, Apache, IBM, . . . vordefinierte GUI-Komponenten + benutzerdefinierte GUI-Bausteine serverseitiges Ereignismodell Request-übergreifende Verwaltung von Komponentenzuständen Formulardaten und Request-Behandlung in einer POJO-Bean POJO = „plain old java object“: normale, vom Framework unabhängige Klasse 373 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces JSF-Lebenszyklus Request Sicht wiederhestellen Requestdaten dekodieren Ereignisse behandeln Cancel−Button Validierung Phasen der Bearbeitung von Faces−Requests Ereignisse behandeln Validierungsfehler Model−Daten aktualisieren Ereignisse behandeln Konvertierungsfehler Geschäftslogik ausführen Ereignisse behandeln Antwort Model−Ereignisse Antwortsicht berechnen 374 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces JSF-Bausteine: Verwaltete Beans („managed beans“) „Managed Bean“: Container verwaltet Lebenszyklus für Datenspeicherung und Request-Bearbeitung zuständig Deklaration in der Container-Konfiguration Verarbeitung der Bean-Attribute mit EL, z.B.: (verzögerte Auswertung!) #{person.name} Container kann Bean-Attribute initialisieren Vordefinierte Java-Klassen als Beans verwendbar 375 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Deklaration von Managed Beans /WEB_INF/faces-config.xml <managed-bean> <managed-bean-name>person</managed-bean-name> <managed-bean-class> jsfBeispiel.PersonBean </managed-bean-class> <managed-bean-scope>request</managed-bean-scope> </managed-bean> 376 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Normale Java-Klassen für Managed Beans möglich <managed-bean> <managed-bean-name>aufgabenliste</managed-bean-name> <managed-bean-class>java.util.ArrayList</managed-bean-class> <managed-bean-scope>session</managed-bean-scope> <list-entries> <value>Einkaufen</value> <value>Sitzung planen</value> <value>Flug buchen</value> </list-entries> </managed-bean> 377 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Verwendung von Managed Beans in einer JSP 3. Listenelement der Aufgabenliste #{aufgabenliste[2]} Einspaltige HTML-Tabelle mit dataTable-Iterator <h:dataTable value="#{aufgabenliste}" var="eintrag" border="1"> <h:column> <h:outputText value="#{eintrag}"/> </h:column> </h:dataTable> 378 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces JSF-Bausteine: Navigationsregeln Beispiel für JSF-Navigationsregel (faces-config.xml) <navigation-rule> <from-view-id>/index.jsp</from-view-id> <navigation-case> <from-outcome>hallo</from-outcome> <to-view-id>/hallo.jsp</to-view-id> </navigation-case> <navigation-case> <from-outcome>tschuess</from-outcome> <to-view-id>/tschuess.jsp</to-view-id> </navigation-case> </navigation-rule> 379 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces JSF-Bausteine: Navigationsregeln Basiselemente der Regeln navigation-rule navigation-case from-view-id to-view-id from-outcome from-action Regel Teilregel aktuelle Sicht nächste Sicht Resultat Aktion aktuelle Sicht −→ nächste Sicht abhängig von Bedingung JSP JSP Resultatswert der Aktion Name der gewählten Aktion Muster in Regeln verwendbar <from-view-id>/hilfe/*</from-view-id> 380 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces JSF-Navigation: from-action und from-outcome Wert ergibt sich aus action-Attribut einer JSF-Schaltfläche Zwei Formen von action-Attributen: action ist ein String from-action: undefiniert from-outcome: Wert von action Beispiel: <h:commandButton action="loginHelp" value="Login-Hilfe"> action ist Bean-Methodenaufruf from-action: aufgerufene Methode from-outcome: Resultat des Methodenaufrufs Beispiel: <h:commandButton action="#{loginBean.help}" value="Login-Hilfe"> 381 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Beispiele zu from-action und from-outcome Eine Regel für alle Aktionen, die „help“ zurückliefern, benutzt: <from-outcome>help</from-outcome> Eine Regel für die Aktion „abmelden“ benutzt: <from-action>abmelden</from-action> Aktion „bestellungAbschicken“ liefert „abbruch“ als Ergebnis: <from-action>bestellungAbschicken</from-action> <from-outcome>abbruch</from-outcome> 382 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Ressourcenbündel für die Internationalisierung Ein Ressourcenbündel enthält alle Strings einer Sprache wird in Container-Konfigurationsdatei deklariert wird mit loadBundle in die JSP eingebunden, z.B. <f:loadBundle basename="ibg.messages" var="msg" /> Verwendungs-Beispiel: msg-Attribute <h:outputLabel for="name" value="#{msg.userName}:" /> <h:panelGroup> <h:inputText id="name" required="true" value="#{loginBean.loginName}"/> <h:message for="name" /> </h:panelGroup> <h:outputLabel for="passwort" value="#{msg.loginPassword}:" / > <h:panelGroup> <h:inputSecret id="passwort" required="true" value="#{loginBean.passwort}" /> <h:message for= "passwort" /> </h:panelGroup> 383 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Validierung von Formularfeldern Vordefinierte Validierer, z.B. validateLength Beispiel <h:inputText id="plz" required="true" value="#{adresse.plz}"> <f:validateLength minimum="5" maximum="5"/> </h:inputText> <h:message for="plz" /> Benutzer-definierte Validierer Java-Klasse mit einer validate-Methode, die bei Fehlschlag eine ValidatorException erzeugt Fehlermeldungen Das <h:message>-Tag erzeugt eine Fehler-Nachricht bei ValidatorException 384 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Simples JSF-Beispiel: Einstiegsseite+Hallo+Tschuess Funktion In einem Formular der Einstiegsseite wird der Name erfragt und dann eine der Aktionen hallo oder tschuess gewählt Bean für die Formulardaten: PersonBean.java public class PersonBean { private String name; public void setName(String name) { this.name = name; } public String getName() { return this.name; } } Verwendung mit verzögerter Auswertung: #{person.name} Semantik abhängig von Verarbeitungsphase ein setName-Aufruf in der Phase „Model-Daten aktualisieren“ ein getName-Aufruf in der Phase „Antwortsicht berechnen“ 385 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Einstiegsseite: JSP mit JSF-Tags Einstiegsseite: index.jsp <html> <%@taglib uri="http://java.sun.com/jsf/core" prefix= "f"%> <%@taglib uri="http://java.sun.com/jsf/html" prefix="h"%> <f:view> <head><title>Willkommen mit JSF</title></head> <body> <h:form id="halloFormular"> <h:outputLabel for="erfrageName" value="Wie heisst du?" /> <h:panelGrid columns="2"> <h:outputLabel for ="name" value="Name:"/> <h:inputTextid ="name" value="#{person.name}"/> <h:commandButton value="hallo" action="hallo"/> <h:commandButton value="tschuess" action="tschuess"/> </h:panelGrid> </h:form> </body> </f:view> </html> 386 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Hallo-Seite mit Abbruch-Button: hallo.jsp <%@ taglib uri="http://java.sun.com/jsf/html"prefix="h"%> <%@ taglib uri="http://java.sun.com/jsf/core"prefix="f"%> <html> <f:view> <head><title>Willkommen</title></head> <body> <h:form> <h1>Hallo,<h:outputText value="#{person.name}" /></h1> <h:commandLink id="Abbruch" action="index" immediate="true"> <h:outputText value="Abbruch"/> </h:commandLink> </h:form> </body> </f:view> </html> immediate-Attribut: erzeugt in der Phase „Requestdaten dekodieren“ ein Ereignis, das zum Überspringen der nachfolgenden Phasen führt. 387 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Konfigurationsdatei: faces-config.xml (1/2) <?xml version="1.0"?> <faces-config xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd" version="1.2"> <navigation-rule> <from-view-id>/index.jsp</from-view-id> <navigation-case> <from-outcome>hallo</from-outcome> <to-view-id>/hallo.jsp</to-view-id> </navigation-case> <navigation-case> <from-outcome>tschuess</from-outcome> <to-view-id>/tschuess.jsp</to-view-id> </navigation-case> </navigation-rule> 388 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Konfigurationsdatei: faces-config.xml (2/2) <managed-bean> <managed-bean-name>person</managed-bean-name> <managed-bean-class> jsfBeispiel.PersonBean </managed-bean-class> <managed-bean-scope>request</managed-bean-scope> </managed-bean> <navigation-rule> <from-view-id>*</from-view-id> <navigation-case> <from-outcome>index</from-outcome> <to-view-id>/index.jsp</to-view-id> </navigation-case> </navigation-rule> </faces-config> 389 / 446 JEE Java-Frameworks für Webapplikationen Java Server Faces Web-Container-Konfiguration: /WEB_INF/web.xml <web-app xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee ... " version="2.5"> <servlet> <servlet-name>Faces Servlet</servlet-name> <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> <load-on-startup>1</load-on-startup> </servlet> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>*.faces</url-pattern> </servlet-mapping> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> </web-app> 390 / 446 JEE JNDI Namens- und Verzeichnisdienste Namensdienst Anwendungen benötigen Transportadressen entfernter Ressourcen Prinzip der Ortstransparenz verbietet „hart kodierte“ Adressen Ressourcen werden über „logische“ Adressen angesprochen Namensdienst bildet logische Adressen ab auf Transportadressen Verlagerung und Replikation von Ressourcen ohne Änderung der Anwendung möglich Verzeichnisdienst Erweiterung des Namensdienst-Konzepts verwaltet ein Verzeichnis von im Netz nutzbaren Objekten/Diensten Verzeichnis-Eintrag kann beliebige Attribute enthalten 391 / 446 JEE JNDI Ressourcen-Beispiele Pool von Datenbankverbindungen („data source“) Web-Service Enterprise Java Bean 392 / 446 JEE JNDI Namensdienst mit Lastverteilung durch Replikation Namensdienst Instanz von Dienst X suche Dienst X Adresse einer Instanz von Dienst X Registrierung Instanz von Dienst X Instanz von Dienst X Client nutze Dienst X 393 / 446 JEE JNDI JNDI – Java Naming and Directory Interface API – Application Programming Interface JNDI beinhaltet ein Java-API für Nutzer von Namens- und Verzeichnisdiensten API ermöglicht einheitlichen Zugriff auf verschiedene Dienste SPI – Service Provider Interface JNDI beinhaltet ein SPI für Implementierer von Verzeichnisdiensten Diensteanbieter stellt die Funktionalität seines Dienstes durch Implementierung der SPI-Operationen zur Verfügung. Beispiele für Namensdienste DNS, LDAP, NDS (Novell Directory Service), RMI, COS (CORBA Naming Service), Dateisysteme 394 / 446 JEE JNDI JNDI-Merkmale Objekte werden in hierarchisch aufgebauten Kontexten verwaltet. Kontext Operationen entspricht einem „Ordner“ (z.B. in einem Dateisystem) enthält primitive Objekte und/oder Subkontexte (Unterordner) Ein „initialer Kontext“ ist die Wurzel der Hierarchie bind - neuen Eintrag einfügen rebind - Eintrag einfügen/ersetzen unbind - Eintrag löschen lookup - Eintrag suchen list - Kontextinhalt auflisten rename - Objekt umbenennen createSubcontext Unterordner erzeugen 395 / 446 JEE JNDI Aufbau von Namen Ein atomarer Name (atomic name) ist eine nicht weiter strukturierte Zeichenkette Ein Verbundname (compound name) ist eine Sequenz atomarer Namen Die konkrete Syntax ist vom Namensdienst abhängig, z.B. java.sun.com, /produktkatalog/hilfe/index.jsp Ein zusammengesetzter Name (composite name) ist aus mehreren Verbundnamen gebildet, für die unterschiedliche SPIs zuständig sind, z.B. www.mni.fh-giessen.de/studium/master/index.html Der erste Teil ist ein DNS-Verbundname der zweite ein Dateipfad 396 / 446 JEE JNDI JNDI-Verwendungs-Beispiel: neuer Eintrag für DataSource Eine MySQL-Datenquelle wird im Verzeichnis per JNDI eingetragen (rebind-Methode) Die Kontext-Variable INITIAL_CONTEXT_FACTORY liefert Konstruktor für Root-Verzeichnis INITIAL_CONTEXT_FACTORY ist abhängig vom Namensdienst, hier: Dateisystem, Sun Referenzimplementierung „com.sun.jndi.fscontext.RefFSContextFactory“ 397 / 446 JEE JNDI import import import import import javax.naming.Context; javax.naming.InitialContext; javax.naming.NamingException; java.util.Hashtable; javax.sql.DataSource; import com.mysql.jdbc.jdbc2.optional.MysqlDataSource; public class BindDataSource { 398 / 446 JEE JNDI public static void main(String[] args) { try { MysqlDataSource ds = new MysqlDataSource(); // Datenbank-Verbindung konfigurieren ds.setServerName("localhost"); ds.setDatabaseName("shopdb"); ds.setPortNumber(3306); ds.setUser("hans"); ds.setPassword("geheim!"); Hashtable<String, String> env = new Hashtable<String, String>(); env.put(Context.INITIAL_CONTEXT_FACTORY, "com.sun.jndi.fscontext.RefFSContextFactory"); Context ctx = new InitialContext(env); ctx.rebind("comp/env/jdbc/mysql/dataSource", dataSource); ctx.close(); } catch (NamingException e) { e.printStackTrace(); }}} 399 / 446 JEE JNDI Beispiel: Benutzung des DataSource-Objekts ... Hashtable<String, String> env = new Hashtable<String, String>(); env.put(Context.INITIAL_CONTEXT_FACTORY, "com.sun.jndi.fscontext.RefFSContextFactory"); Context ctx = new InitialContext(env); DataSource ds = (DataSource) ctx.lookup("comp/env/jdbc/mysql/dataSource"); ctx.close(); Connection conn = ds.getConnection(); ... 400 / 446 JEE Enterprise Java Beans Wozu 4-Tier-Systeme für komplexe Web-Anwendungen? Entkopplung von Geschäftslogik und Interaktionssteuerung z.B. zur Unterstützung alternativer Front-End-Systeme Verteilte Transaktionen, langlebige Transaktionen Persistenzdienst für Objekte erforderlich Hohe Skalierbarkeit: Ressourcen-Pooling (z.B. für Datenbankverbindungen) Lastverteilung durch Dienst-Replikation Caching Fehlertoleranz (z.B. automatischer Dienst-Neustart) bedarfsorientierte Dienstaktivierung Multiprotokoll-Kommunikation Einbindung von Message-Servern (MOM) 401 / 446 JEE Enterprise Java Beans EJB - Enterprise Java Bean Java-Standard zur Implementierung von Tier 3 in einer verteilten 4-Tier-Architektur: Geschäftslogik Merkmale serverseitige Backend-Komponenten kapseln Geschäftslogik und/oder Daten bestehen aus mehreren Java-Klassen implementieren mehrere Schnittstellen brauchen zur Ausführung einen EJB-Container kommunizieren mit CORBA/IIOP aktueller EJB-Standard: Version 3.0 402 / 446 JEE Enterprise Java Beans Beispiel-Szenario für den Einsatz der EJB-Technologie Szenario (frei nach „Enterprise Java in a Nutshell“, O’Reilly) Die Münchener Traditionsfirma „Weißbier- und Weißwurst-Warenhaus AG“, kurz WWW-AG, möchte mit ihren Produkten ins lukrative Internetgeschäft einsteigen. Der Online-Einkauf wird als 3-Tier-Architektur realisiert. Geschäftslogik und Architektur Ein Kunde besucht die Webseite der Firma um im Produktkatalog zu stöbern und einzukaufen. Der Webserver benutzt ein Servlet zur Warenkorb- und Sitzungsverwaltung, der Warenkorb wird in einer Datenbank gespeichert Zum Bestellen verwendet der Webserver ein weiteres Servlet, das über JDBC auf den Warenkorb zugreift Das Bestellservlet erfragt Kundeninformationen wie Lieferadresse und Rechnungsadresse und speichert diese in der Kundendatenbank 403 / 446 JEE Enterprise Java Beans Fallbeispiel Integration einer proprietären Anwendung („legacy software“: spezielle, keinem Standard entsprechende Schnittstelle): Das Bestellservlet sendet Rechnungsadresse und Gesamtpreis zum Rechnungsschreibungs-Server. Dieser wurde vor 22 Jahren in COBOL programmiert und hat eine nicht standardisierte Schnittstelle. Er wird daher über einen Webservice-Adapter benutzt. Verwendung eines LDAP-Servers: Die Firma betreibt 67 Filialen in Bayern und dem Rest der Welt. Die Filialliste wird von einem LDAP-Verzeichnisdienst verwaltet. Das Bestellservlet verwendet JNDI zum Zugriff auf das Filialverzeichnis, um die dem Kunden nächstgelegene Filiale zu ermitteln. Verwendung eines MOM-Servers: Das Bestellservlet benutzt JMS, um einen Lieferauftrag über das Messagingsystem an den Lieferauftragsserver der Filiale zu senden 404 / 446 JEE Enterprise Java Beans Fallbeispiel Modell des Online-Shops 405 / 446 JEE Enterprise Java Beans Fallbeispiel Einige Probleme Rechnung, aber keine Lieferung Manchmal wird eine Rechnung an den Rechnungsschreibungs-Server übermittelt aber wegen eines System- oder Netzwerkfehlers wird keine Lieferung veranlaßt. Hier fehlt ein Transaktionskonzept! Überlastete Server Nach einigen Monaten steigt die Kundenzahl auf 1000 pro Tag. In den Spitzenzeiten sind einzelne Server (Web- und Persistenzschicht) so überlastet, dass Kunden-Requests zeitweise nicht mehr bedient werden können. System bleibt bei Fehlern hängen Wegen Wartungsarbeiten und vereinzelter technischer Probleme bei den Datenhaltungs-Servern ist der Onlineshop öfter nicht verfügbar. Resultat: Verzweifelte Kunden drohen schon mit dem Umstieg auf hessischen Handkäse und Apfelwein. Eine Katastrophe! 406 / 446 JEE Enterprise Java Beans Fallbeispiel Was kann JEE zur Problemlösung beitragen? Einbindung aller Bestell-Aktivitäten in verteilte Transaktion bessere Performanz durch Ressourcen-Pooling und Caching bessere Fehlertoleranz durch „Failover“-Mechanismen (Dienste-Überwachung, automatischer Neustart von Diensten nach Fehlern) 407 / 446 JEE Enterprise Java Beans Fallbeispiel Konsequenzen aus dem Einsatz einer 4-Tier-Architektur Investition in die Server-Infrastruktur Ein Applikationsserver muss angeschafft, installiert, betreut werden Architekturumstellung erfordert Aufwand Angesichts der Komplexität des Systems und der Lastabschätzung hätte man besser von vorneherein das 4-Tier-Modell gewählt Komplexität des Anwendungs-Code Der Java-Code der 4-Tier-Anwendung ist einfacher: Programmierung entfällt für: Transaktionssteuerung Persistenz der Objekte Ressourcenverwaltung EJB-Komponenten werden durch Annotationen eingebunden 408 / 446 JEE Enterprise Java Beans Applikationsserver JEE-Applikationsserver Ein JEE-Applikationsserver beinhaltet einen Servlet-Container (Unterstützung von Servlets und JSPs) einen EJB-Container (Unterstützung von Enterprise Java Beans) Der EJB-Container verwaltet Session Beans - Bausteine der Geschäftslogik Entity Beans - Datenobjekte, Schnittstelle zur Persistenzschicht Message Beans - Nachrichtenschnittstelle zu MOM-Systemen Beispiele für Applikationsserver: JBoss (Open Source) BEA Weblogic (BEA/Oracle) IBM Websphere Sun Glassfish (in Netbeans 6.x bereits integriert) SAP Netweaver 409 / 446 JEE Enterprise Java Beans Applikationsserver Mehrschicht-Architektur mit EJBs Browser WS−Clients HTTP Get/Post JSPs JEE− Applikations− server "Dicke" Clients RMI/IIOP SOAP Servlets RMI/IIOP Web Services RMI/IIOP RMI/IIOP EJBs Konnektor JDBC DBMS SOAP Proprietäre Systeme Web Services JMS MOM−Server 410 / 446 JEE Enterprise Java Beans Persistenz Persistenz von Objekten Problem: dauerhafte Speicherung von Geschäftsdaten (in fast allen nicht-trivialen Web-Anwendungen) Geschäftsdaten werden unterschiedlich repräsentiert: Java-Komponente: Objekte, Objekt-Beziehungen, Klassen Datenbank: Relationen, SQL-Datentypen ORM („object relational mapping“) definiert den Bezug zwischen Java- und Datenbank-Repräsentation Speicherung von (Java-)Objekten in relationalen Datenbanken Abbildung von Objekten und Objekt-Beziehungen auf Relationen Objekt-Beziehungen: Vererbung, Aggregation, Komposition usw. Persistenz-Frameworks implementieren ORM 411 / 446 JEE Enterprise Java Beans Persistenz Historisches zu EJB und Persistenz EJB 1.x (1997): Persistenz ist Problem des Anwendungsprogrammierers EJB 2.x (2001): „Container Managed Persistence“ (CMP) 2001: JDO („Java Data Objects“) 2006: JPA („Java Persistence API“) nicht auf JEE beschränkt persistente Objekte sind POJOs EJB 3.0 (2006): basiert auf JPA mehrere JPA-Implementierungen: JBoss Hibernate, Open Source, (sehr weit verbreitet) Oracle Toplink, Open Source, (in Netbeans integriert) BEA Kodo / Apache OpenJPA 412 / 446 JEE Enterprise Java Beans Persistenz Kommunikation mit EJBs EJB EJB−Client Geschäftslogik EJB−Adresse Container−Methoden: JNDI Interceptor RMI Verzeichnis− dienst Skeleton Stub Parameter serialisieren versenden Transaktionslogik Persistenz Lebenszyklus Ergebnis empfangen deserialisieren Parameter empfangen deserialisieren Container− Konfiguration Ergebnis serialisieren versenden ORB / IIOP EJB−Container 413 / 446 JEE Enterprise Java Beans Session Bean EJB-Typen: Session Bean Merkmale: implementiert Workflow transient, kurzlebig Client-gebunden kann in Transaktionen eingebunden werden modifiziert Datenbank Anwendungs-Beispiele: Bankautomat-Steuerung Warenkorb im Online-Shop (nicht-persistent) Fabrik-Objekt Suche in einem Auktionsportal 414 / 446 JEE Enterprise Java Beans Session Bean Session-Bean-Kategorien Zustandslos („stateless“) kein „Gedächtnis“ über den Methodenaufruf hinweg kann nacheinander für unterschiedliche Clients verwendet werden Poolbildung möglich Zustandsvoll („stateful“) Bean mit „Konversationsgedächtnis“ Nutzung vergleichbar mit dem Session-Objekt eines Servlets modelliert typischerweise Sitzung eines Client nur eine zustandsvolle Session-Bean pro Client kein Pooling möglich, ineffizienter als stateless Beans 415 / 446 JEE Enterprise Java Beans Message Driven Bean MOM – „Message-Oriented Middleware“ Merkmale asynchrone Client-Server-Kommunikation „message queue“ zur Zwischenspeicherung lose Kopplung zwischen Client und Server (gegenüber RMI) Nachrichtenaustausch-Muster Auftrag - Antwort Publisher-Subscriber Multicast Einsatz im kommerziellen Backend-Bereich Beispiel: IBM Websphere MQ (früher MQSeries) JMS – „Java Message Service“ Java API zur Verwendung von MOM-Systemen 416 / 446 JEE Enterprise Java Beans Message Driven Bean EJB-Typen: Message Bean Merkmale: kapselt den Zugriff auf MOM-Server bearbeitet JMS-Nachrichten Beispiele: nachrichtenorientierte Auftragserstellung 417 / 446 JEE Enterprise Java Beans EJB-Schnittstellen Schnittstellen von EJBs Remote Interface: Geschäftslogik-Schnittstelle enthält die applikationsspezifischen „Geschäftsmethoden“ Aufrufe indirekt über den EJB-Container Local Interface: effizienter Aufruf für Clients in gleicher JVM lokale Methodenaufrufe statt RMI → bessere Performanz Verletzung des Ortstransparenz-Prinzips Schnittstellen zwischen Bean und Bean-Container Methoden zur Lebenszykluskontrolle durch EJB-Container 418 / 446 JEE Enterprise Java Beans EJB-Schnittstellen Beispiel: „Hallo Welt“-Stateless Session Bean Remote Interface HalloWelt.java public interface HalloWelt { public String getBegruessungsText(); } Remote-Interface ist POJO! Vergleich EJB-Version 2: public interface HalloWelt extends EJBObject { ... } 419 / 446 JEE Enterprise Java Beans EJB-Schnittstellen Beispiel: Implementierung des Remote-Interface Implementierung: HalloWeltImpl.java import import import import javax.ejb.Remote; javax.ejb.Stateless; java.rmi.RemoteException; java.util.*; @Stateless @Remote(HalloWelt.class) public class HalloWeltImpl implements HalloWelt, Serializable { public String getBegruessungsText() throws RemoteException { return "Hallo Welt!"; } } 420 / 446 JEE Enterprise Java Beans EJB-Schnittstellen Beispiel: „Hallo Welt“-Stateful Session Bean Remote Interface HalloWeltStateful.java public interface HalloWeltStateful { public String getBegruessungsText(); public void setBegruessungsText(String text); } 421 / 446 JEE Enterprise Java Beans EJB-Schnittstellen Implementierung: HalloWeltStatefulImpl.java import import import import javax.ejb.Remote; javax.ejb.Stateful; java.rmi.RemoteException; java.util.*; @Stateful @Remote(HalloWeltStateful.class) public class HalloWeltStatefulImpl implements HalloWeltStateful, Serializable { private String begruessungsText: public String getBegruessungsText() throws RemoteException { return begruessungsText; } public void setBegruessungsText(String text) throws RemoteException { begruessungsText = text; } } 422 / 446 JEE Enterprise Java Beans EJB-Schnittstellen EJB-Aufruf im Servlet import javax.naming.* import javax.servlet.http.* public class HalloWeltClientServlet extend HttpServlet { public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html"); PrintWriter out = response.getWriter(); Context ctx = new InitialContext(); HalloWelt hwEJB = (HalloWelt) ctx.lookup("HalloWelt"); String begruessungsText = hwEJB.getBegruessungsText(); ctx.close(); ... 423 / 446 JEE Enterprise Java Beans EJB-Alternativen Alternative Java-Frameworks Spring meist als die „schlankere“ Haupt-Konkurrenz zu JEE angesehen wird neuerdings auch mit JEE kombiniert verwendet (z.B. in BEA Weblogic) mehr: http://www.springframework.org JBOSS Seam Versuch, diverse Techniken zu verbinden Front-End: Ajax, JSF, Portlets u.a. Backend: Hibernate, EJB 3.0, BPM („Business Process Management“) mehr: http://www.seamframework.org 424 / 446 Webservices Teil V Webservices 425 / 446 Webservices 19 Serviceorientierte Architektur 20 Webservices ESB 426 / 446 Webservices Serviceorientierte Architektur SOA – Serviceorientierte Architektur SOA ist ein IT-Paradigma, das eine geschäftsprozessorientierte, anwendungsübergreifende Sicht auf die IT-Landschaft eines Unternehmens favorisiert. SOA modelliert Prozesse als Komposition von Diensten. SOA unterstützt in besonderer Weise die Integration heterogener, dezentral verwalteter Anwendungen auf der Basis plattformunabhängiger Standards. 427 / 446 Webservices Serviceorientierte Architektur SOA Komponentenmodell für verteilte Anwendungen Komponenten sind Dienste („Services“) Rollen: Dienstanbieter Dienstnutzer („Service Provider“) („Service Requester“) formal definierte Dienste-Schnittstelle asynchrone Kommunikation, MOM Service-Verzeichnisse Kommunikationsbasis: plattformunabhängige Standards (meist Webservices) HTTP, XML, XML-RPC, SOAP, WSDL, UDDI, . . . 428 / 446 Webservices Serviceorientierte Architektur Typische Probleme größerer Unternehmen Flexibles Geschäftsprozessmanagement (BPM - Business Process Management) Geschäftsprozesse im Unternehmen ändern sich schneller als früher Anforderung: Änderung und Neudefinition von Geschäftsprozessen mit geringem Aufwand Lösungsansatz: Geschäftsprozesse aus Diensten baukastenmäßig zusammenstellen Idealbild: graphischer „Prozessdesigner“ mit automatischer Code-Erzeugung statt Refactoring von 5000 Zeilen Java-Code 429 / 446 Webservices Serviceorientierte Architektur Integration heterogener Anwendungen (EAI - Enterprise Application Integration) Anwendungen berechnen und verwalten Daten, die in anderen Anwendungen benötigt werden Datenaustausch über gemeinsam benutzte Datenbanken oft nicht realisierbar Lösungsansatz: Dienste-orientierte Middleware als einheitliche Schnittstelle zur Kommunikation zwischen vorhandenen Anwendungen 430 / 446 Webservices Serviceorientierte Architektur Integration externer Anwendungen zunehmende Anzahl unternehmensübergreifender Anwendungen Anwendungen als allgemein im Web verfügbare Dienstleistung Kollaboration zwischen zwei Unternehmen Lösungsansatz: externe und interne Anwendungen über Dienste-Schnittstellen koppeln 431 / 446 Webservices Serviceorientierte Architektur SOA – Architekturmerkmale lose Kopplung der Komponenten Asynchroner Nachrichtenaustausch als Kommunikationsbasis komplexes Nachrichten-Konzept offene Standards Dienst als einheitliches Abstraktionskonzept Prozesslogik (z.B. kompletten Geschäftsprozess) Daten/Entitäten (z.B. Kunde, Auftrag) technische Funktionen (Authentifizierung, Lastverteilung, . . . ) Schnittstelle zu einer Anwendung („Wrapper“) 432 / 446 Webservices Webservices Webservices Auf offenen Standards basierende Middleware Kernkomponenten Nachrichten-System: SOAP, Nutzlast sind XML-Dokumente Schnittstellenspezifikation: XML Schema und WSDL (Webservice Description Language) Erweiterungen: WS-* (Security, Transaction, ...) Diensteorchestrierung mit WS-BPEL 433 / 446 Webservices Webservices Verantwortung für Standards und Spezifikationen W3C XML, XML Schema, XSLT, SOAP, WSDL, . . . OASIS – Organization for the Advantage of Structured Information Standards ebXML, WS-BPEL, WS-Security, UDDI, SAML, XACML, . . . Web Services Interoperability Organization (WS-I) „Basic Profile“: Empfehlung für eine Zusammenstellung der WS-Technologien und ihrer Versionen Anwendungsmuster Beispiel-Implementierungen 434 / 446 Webservices Webservices SOAP SOAP-Nachrichten SOAP-Envelope: enthält Header und Body SOAP-Header: Metainformationen zur Nachricht SOAP-Body: Nutzlast, XML-Dokument 435 / 446 Webservices Webservices Beispiel: Reisebuchung als SOAP-Nachricht <?xml version=’1.0’ ?> <env:Envelope xmlns:env="http://www.w3.org/2003/05/soap-envelope"> <env:Header> <m:reservation xmlns:m="http://travelcompany.example.org/reservation" env:role="http://www.w3.org/2003/05/soap-envelope/role/next" env:mustUnderstand="true"> <m:reference>uuid:093a2da1-q345-739r-ba5d-pqff98fe8j7d</m:reference> <m:dateAndTime>2009-11-29T13:20:00.000-05:00</m:dateAndTime> </m:reservation> <n:passenger xmlns:n="http://mycompany.example.com/employees" env:role="http://www.w3.org/2003/05/soap-envelope/role/next" env:mustUnderstand="true"> <n:name>Karl Dall</n:name> </n:passenger> </env:Header> 436 / 446 Webservices Webservices <env:Body> <p:itinerary xmlns:p="http://travelcompany.example.org/reservation/travel"> <p:departure> <p:departing>New York</p:departing> <p:arriving>Los Angeles</p:arriving> <p:departureDate>2009-12-14</p:departureDate> <p:departureTime>late afternoon</p:departureTime> </p:departure> <p:return> <p:departing>Los Angeles</p:departing> <p:arriving>New York</p:arriving> <p:departureDate>2009-12-20</p:departureDate> <p:departureTime>mid-morning</p:departureTime> </p:return> </p:itinerary> <q:lodging xmlns:q="http://travelcompany.example.org/reservation/hotels"> <q:preference>none</q:preference> </q:lodging> </env:Body> </env:Envelope> 437 / 446 Webservices Webservices WSDL – Webservice Description Language XML-Sprache zur Schnittstellenbeschreibung eines Dienstes Ein Webservice hat eine Schnittstelle Die Schnittstelle besteht aus beliebig vielen Operationen Eine Operation definiert eine Eingabe- und/oder eine Ausgabe-Nachricht benötigte Datentypen sind i.d.R. separate Schema-Definitionen Aufteilung der Schnittstellenbeschreibung in abstrakte Beschreibung (portType oder interface) konkrete Beschreibung (Transport-Endpunkte) 438 / 446 Webservices Webservices WS-Erweiterungen Viele zusätzliche Leistungsmerkmale der Kommunikations-Infrastruktur sind als WS-Erweiterungen (WS-*) standardisiert, z.B. WS-Transaction: verteilte Transaktionen WS-ReliableMessaging: zuverlässige Nachrichtenübermittlung WS-Security: Verschlüsselung, Authentifizierung u.a. Sicherheitsfunktionen Die Nutzung dieser Leistungsmerkmale erfolgt über SOAP-Header SOAP ist dadurch vergleichweise leicht erweiterbar 439 / 446 Webservices Webservices Webservice Baukastensystem 440 / 446 Webservices Webservices Beispiel für WS-Erweiterungen: Digital signierte Dokumente Der XML-Standard XML-Signature ermöglicht die elektronische Signatur von XML-Dokumenten (oder einzelnen XML-Elementen) WS-Security nutzt diesen XML-Standard für SOAP: XML-Nutzlast der SOAP-Nachricht wird digital signiert Signatur und Angaben zur Auswertung werden als SOAP-Header in die Nachricht integriert. 441 / 446 Webservices Webservices Web-Services Orchestrierung BPEL WS−Reliable Messaging WS−Transaction Dienst− Qualität WS−Coordination WSDL WS−Security WS−Policy SOAP UDDI Beschreibung Entdeckung Nachrichten− Format XML Transportdienste: HTTP, E−Mail, TCP, ... Transport 442 / 446 Webservices Webservices Web-Services und Java Java enthält mehrere APIs für die Web-Service-Entwicklung. Webservices und WS-Clients lassen sich auch ohne Befassung mit der XML-Ebene (SOAP, WSDL) entwickeln. JAXB (Java Architecture for XML Binding) ist eine API zur Erzeugung von Java-Klassen aus WSDL-Schnittstellen und umgekehrt SAAJ (SOAP with Attachments API for Java) ist eine API zur einfachen Verarbeitung von SOAP-Nachrichten JAX-WS (Java API for XML - Web Services) ist eine API, die zur Erzeugung von Webservices aus Java-Code mit Annotationen dient und weitere (JAXM, JAXR, . . . ) 443 / 446 Webservices Webservices Java WS-APIs WS−Erweiterungen Security Transaction Reliable Messaging JAX−WS WSDL Java JAXB WS−Anwendung XML−freie WS−Programmierung SAAJ JAXP SOAP−Nachrichten XML Verarbeiten 444 / 446 Webservices Webservices Beispiel für JAX-WS package helloservice.endpoint; import javax.jws.WebService; @WebService() public class Hello { private String message = new String("Hello, "); public void Hello() {} @WebMethod() public String sayHello(String name) { return message + name + "."; } } 445 / 446 Webservices Webservices ESB ESB - Enterprise Service Bus intelligenter Nachrichtenvermittler Aufgaben: Nachrichtenaustausch mit API-/Protokoll-Transformation, Orchestrierungs-Engine, dynamisches content-abhängiges Routing (z.B. für Lastverteilung), Dienstverzeichnis, Sicherheitsdienste Anwendung wird als Service an den ESB angebunden Vorteil: weniger Schnittstellen gegenüber Punkt-zu-Punkt-Kommunikation JBI (Java Business Integration) ist ein Java-Standard für ESBs JCA (Java Connector Architecture) ist ein Standard für EAI-Adapter Produkt-Beispiele: IBM Websphere ESB, JBoss ESB, Microsoft BizTalk, Mule In Netbeans ist der JBI-konforme OpenESB integriert 446 / 446