docJava Server Faces
download 
Report Transcription
Java Server Faces
JavaServer Faces,
Web-Entwicklung mit GUI-Komponenten
Markus Heinisch
markus.heinisch
@trivadis.com
DOAG Regio Stuttgart
Juli 2006
Why do I need it?
Ed Burns, 27.4.2004 „About Faces: The JavaServer™ Faces API
and how it relates to Struts“
© 2006
Agenda
Einleitung
JSF Architektur
JSF Implementierungen
Fazit
Daten sind
immer im Spiel.
Referenzen
© 2006
Was ist JavaServer Faces?
Bibliothek von wiederverwendbaren GUI Komponenten
Standard Java EE 5 Web UI Framework
Java Community Process JSR 127, JSR-252
(http://jcp.org/en/jsr/detail?id=127)
Version 1.2 im Mai 2006 (Version 1.0 im März 2004)
Grafik aus SUN‘s „Java EE 5 Tutorial“
© 2006
Vision von JSF
JSR-127 (http://www.jcp.org/en/jsr/detail?id=127):
"Basic Idea: Make Web Development Faster And Easier"
Fokus auf Komponenten statt Markup
à Komponentenmarkt
Management von Events und State
Für bestmögliche Toolunterstützung entwickelt
© 2006
Grundprinzip
Typische JSF Applikation besteht aus:
Webseiten als MVC View
à Webseiten referenzieren serverseitige Komponenten
JavaBeans Komponenten als MVC Model
à Management von Applikationsstatus und Verhalten
JSF Servlet als MVC Controller
à Deklaration der Seitennavigation
Events
à Vergleichbar mit Events-Listener Konzept in traditioneller GUI
Entwicklung
© 2006
Positionierung
Graphic taken from „JSF in Action“ by Kito D. Mann
© 2006
Beispiel Login-Formular
Einfaches Login-Formular mit JSF Komponenten und JSP
© 2006
Beispiel Login-Formular
Webseite als MVC View
Login JSP mit
JSF Komponenten
JSP und JSF Tags
gemischt
Alle
JSF Komponenten
innerhalb des JSF ViewElements
...
<f:view>
<html>
<body>
<h:form>
<table>
<tr>
<td><h:outputText value="Username"/></td>
<td><h:inputText/></td>
</tr>
<tr>
<td><h:outputText value="Password"/></td>
<td><h:inputSecret/></td>
</tr>
</table>
<h:commandButton value="Speichern"/>
<h:commandButton value="Abbrechen"/>
</h:form>
</body>
</html>
</f:view> ...
© 2006
Beispiel Login-Formular
Login-Formular als HTML im Browser
<html>
<body>
<form id="_id0" method="post"
action="/myApp/faces/simpleRegistration.jsp"
enctype="application/x-www-form-urlencoded">
<table cellspacing="2" cellpadding="3" border="0">
<tr>
<td>Username</td>
<td><input type="text" name="_id0:_id2" /></td>
</tr>
<tr>
<t>Password</td>
<td><input type="password" name="_id0:_id4" value="" /></td>
</tr>
</table>
<input type="submit" name="_id0:_id5" value="Speichern" />
<input type="submit" name="_id0:_id6" value="Abbrechen" />
<input type="hidden" name="com.sun.faces.VIEW"
value="H4sIAAAAAAAAAFvzloG1hIHRsAAA455JNwkAAAA=" />
<input type="hidden" name="_id0" value="_id0" />
</form>
</body>
© 2006
</html>
Agenda
Einleitung
JSF Architektur
JSF Implementierungen
Fazit
Daten sind
immer im Spiel.
Referenzen
© 2006
J2EE recommended architecture
Rich Client
SOAP
JDBC
RDBMS
JMS
MOM
(Queue)
MDB
JSF
JSF
Web Actions
Browser
View
Components
HTTP
JDBC
BMP
GUI
Java ME
Mobile Device
Consumed Service
CMP
Rich Client
Session Bean
Web Service
Servlet
GUI
.NET
Framework
Component
IF
SOAP
BL
DTO’s
Unit & IntegrationTesting
Presentation
Client Tier
Business Logic
Middle Tier
Integ.
WS IF
Präs.
Java Swing
Proxy
GUI
Remoting
Integration
Resource Tier
© 2006
MVC Architektur
JSF implementiert das Model 2 aus den J2EE Blueprints
JSF
JSFApplikation
Applikation
Controller
View
HTML
HTML
RenderKit
RenderKit
HTML
HTML
Browser
Browser
Page
Page
Description
Description
FacesServlet
FacesServlet
WAP
WAP
Browser
Browser
Model
WML
WML
RenderKit
RenderKit
Managed
Managed
Beans
Beans
Page
Page
Description
Description
© 2006
MVC Architektur
Architektur unabhängig Markup und spezifischen Protokollen
entworfen
JSF Applikation kann unterschiedliche Technologien zur
Darstellung verwenden
JSF RenderKit erzeugt aus den Komponenten das Markup zur
Laufzeit
Trennung von Seitenbeschreibung/Komponenten und Rendering
des Markup bringt
à Flexibilität von Komponenten mit verschiedenen RenderKits
à Einheitliches Programmiermodell, JSF und Java, für verschiedene
Clienttypen
© 2006
JSF Component
JSF Component besteht aus
à UIComponent, definiert das Verhalten des Elements und steuert den
Zugriff aus Datenmodell
à Renderer, generiert Markup für einen Clienttyp für eine Komponente
oder Komponentenfamilie
à JSP Custom Tag, zur Notation von JSF Components in JSP Views
Klare Trennung zwischen Verhalten und Darstellung
UIComponent
UIComponent
ManagedBean
ManagedBean
JSF EL
State
State
RenderKit
RenderKit
Renderer
Renderer
Renderer
Renderer
© 2006
MVC – Controller
JSF implementiert das Front Controller Pattern: FacesServlet
Aufgaben
à Gatekeeper – alle Requests gehen durch das Servlet
à Request Processing Lifecycle Management
à Navigation durch Auswahl einer View
Konfiguration des FacesServlet in /WEB-INF/web.xml
<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>
© 2006
Application Configuration Resource File
Konfigurationsdatei von JSF
à Ein oder mehrere Dateien
à Pfad kann in web.xml als <context-param> definiert werden
Default-Pfad: WEB-INF/faces-config.xml
à Runtime Access via Singleton javax.faces.Application
Definition und Konfiguration von Objekten, wie
à
à
à
à
à
à
à
Managed Beans
Navigationsregeln
Validators&Converters
Event-Listeners
MessageBundles
RenderKits
…
© 2006
MVC – View
View beschreibt Layout, Verhalten und Darstellung der
Applikation
User Interface besteht aus Hierarchie von Komponenten
à Root-Element <f:view>
Komponenten sind vorgefertigte Elemente, die Entwickler zu
komplexen Views zusammenstecken
à Layouting
à Menüs
à Einfache bis umfangreiche Werte Eingabe
Input Feld über DateSelector bis zum Shuffle-Dialog
à Validierung und Konvertierung
Nicht sichtbare Komponenten
© 2006
MVC – View
Basisklasse javax.faces.component.UIComponent
à Vergleichbar mit Swing Komponenten javax.swing.JComponent
à Server-seitig
<f:view>
<html>
<body>
<h:form>
<table>
<tr>
<td><h:outputText value="Username"/></td>
<td><h:inputText/></td>
</tr>
<tr>
<td><h:outputText value="Password"/></td>
<td><h:inputSecret/></td>
</tr>
</table>
<h:commandButton value="Speichern"/>
<h:commandButton value="Abbrechen"/>
</h:form>
</body>
</html>
</f:view>
UIViewRoot
UIViewRoot
UIForm
UIForm
UIOutput
UIOutput UIOutput
UIOutput
UIInput
UIInput
UICommand
UICommand
UIInput
UIInput
© 2006
UICommand
UICommand
MVC – Model
Modell wird durch Managed Beans repräsentiert
Managed Beans sind POJOs
keine Abhängigkeit von Basisklassen oder Interfaces
Managed Beans sind JSF Controller nicht bekannt
à Managed Beans können symbolischen Navigationsnamen einer
Navigationsregel liefern
à Ergebnis wird vom Controller zur Navigation verwendet
Konfiguration der Managed Beans in faces-config.xml
© 2006
MVC – Model
Verbindung zur Applikationslogik
Binding von Eingabefelder und Submits an ManagedBeans
<inputText>
<commandButton>
Æ Properties der Bean
Æ Methoden der Bean
Bindemittel: JSF Expression Language
à Syntax für Zugriff auf JavaBean Properties und Aufruf von Methoden
à Vergleichbar zu JSP Expression Language
à Verwendung in Views, Konfigdatei und Java Code
à Get und Set von Properties, Handling von Events
<h:inputText value="#{bbRegistration.username}" id="username"/>
<h:commandButton value="Speichern" action="registerConfirm"
actionListener="#{bbRegistration.onRegister}"/>
© 2006
Navigation
Deklarative Navigation
à
à
à
à
Ähnlich zu Struts
Lokale und globale Navigationsregeln in Datei faces-config.xml
Lokale Regel, wenn Ausgangsseite (from-view-id) angegeben ist
Globale Regel, wenn keine Ausgangsseite angegeben ist
<navigation-rule>
<from-view-id>/registration.jspx</from-view-id>
<navigation-case>
<from-outcome>back</from-outcome>
<to-view-id>/register.jspx</to-view-id>
</navigation-case>
<navigation-case>
<from-outcome>registerConfirm</from-outcome>
<to-view-id>/registerConfirm.jspx</to-view-id>
</navigation-case>
</navigation-rule>
Ausgangsseite
Ausgangsseite
Symbolische
SymbolischeNav.name
Nav.name
Zielsseite
Zielsseite
© 2006
Navigation
Verwendung der Navigationsregeln
Attribut action gibt Navigation-Case an
à Statische Navigation durch symbolischen Navigationsnamen
<h:commandButton value="Speichern" action="registerNav"
actionListener="#{bbRegistration.onRegister}"/>
statisch
statisch
à Dynamische Navigation durch JSF Expression Language
à Berechnung des Navigation Case in Managed Bean Methode
Methodensignatur: public String myAction()
<h:commandButton value="Speichern"
action=„#{saveSettings == true ? ´confirm´ : ´home´}"
actionListener="#{bbRegistration.onRegister}"/>
dynamisch
dynamisch
<h:commandButton value="Speichern"
action="#{bbRegistration.register}"
actionListener="#{bbRegistration.onRegister}"/>
© 2006
Request Processing Lifecycle
Lifecycle einer JSF Page
à JSF unterteilt den Lifecycle in 6 Phasen
à Unterscheidung zwischen initialen Request oder Postback Request
Initial Request
à Restore View Phase
Component-Tree wird aus der View erzeugt oder wieder hergestellt
Tree wird in Server-Cache verwaltet
JSF
JSFApplikation
Applikation
à Render Response Phase
Erzeugt Markup
aus Component-Tree
Schreibt Markup
in Response
Speichert Status des
Component-Trees
Restore
Restore
View
View
HTML
HTML
Browser
Browser
Apply
ApplyRequest
Request
Values
Values
Process
Process
Validations
Validations
Initial Request
Render
Render
Response
Response
Invoke
Invoke
Application
Application
© 2006
Update
UpdateModel
Model
Values
Values
Request Processing Lifecycle
Postback Request (zusätzlich zum Initial Request)
Apply Request Values
à Komponenten aus dem Component-Tree können ihren Status mit Werten aus
dem HTTP Post Request provisorisch aktualisieren
Process Validation
à Konverter und Validatoren der Komponenten prüfen den provisorischen Wert
Update Model Values
à Provisorische Wert wird als neuer Status in Komponente übernommen
Invoke Application
à Erzeugte Events werden an registrierte Listener weitergegeben,
Z.B. Submit eines Buttons wird als ActionEvent an ActionListener
Exceptions im Lifecycle
à Bei Exceptions wird in die Render Response Phase gesprungen
à Ausgangs-View wird angezeigt, keine Navigation
© 2006
UI Events und Listeners
Events werden durch HTTP Post server-seitig verbreitet
à
à
à
à
Alle Formulardaten werden gesendet
Event-Listener sind Managed Beans
Registrierung von ein oder mehreren Listeners möglich
Event-Source sind Komponenten (server-seitig)
ActionEvent
à UI Component wurde aktiviert
à Methoden in Bean public void onMyEvent(ActionEvent e)
ValueChangeEvent
à Wert eines UI Input Element validiert und geändert
à Methoden in Bean public void myChanged(ValueChangeEvent vce)
PhaseEvent
à kennzeichnet Beginn oder Ende einer Lifecycle Phase
à Konfiguration von PhaseEvent-Listeners in faces-config.xml
à Interface javax.faces.event.PhaseListener
© 2006
State von JSF Applikationen
Jede Komponente eines Component-Tree sichert State am Ende
der Render Response Phase
JSF verwaltet den State einer View zwischen Requests
Bei Postback auf eine View wird der State jeder Komponente in
Restore View Phase wiederhergestellt
State auf Server oder Client gespeichert
à Server: in HTTPSession,
à Client: abhängig von Markup Sprache;
bei HTML als hidden Form Field
© 2006
Agenda
Einleitung
JSF Architektur
JSF Implementierungen
Fazit
Daten sind
immer im Spiel.
Referenzen
© 2006
SUN Reference Implementation
JSF 1.1.02
à https://javaserverfaces.dev.java.net/
à Download enthält
Libs, Dokumentation, Samples und Sourcen
Basisimplementierung des JSR-127
Liefert JSF Infrastruktur
à Z.B. FacesServlet-Controller
à Komponentenimpl. der Spec.
ADF Faces nutzt SUN RI und implementiert „nur“ JSF Components selber
Nur wenige zusätzliche Features
à Z.B. com.sun.faces.NUMBER_OF_VIEWS_IN_SESSION
© 2006
SUN Reference Implementation
JSF Components:
à JSF Custom Tag HTML
à Sichtbare Komponenten
Formular
Eingabe
Ausgabe
Layout
© 2006
SUN Reference Implementation
JSF Components:
à JSF Custom Tag Core
à Nicht sichtbare Komponenten
Converter
Validator
EventListener
© 2006
SUN Reference Implementation
Positiv
à Solide Implementierung der JSF Infrastruktur
à Hersteller bauen auf SUN RI auf und bieten zusätzliches
Komponenten
à Komponenten liefern minimales vorgefertigtes Look&Feel
à Look mit CSS leicht änderbar
Negativ
à
à
à
à
Sehr wenige Komponenten
Nur einfache Komponenten (nahe am HTML)
Kein Client-Site Scripting vorgesehen
Look muss bei jeder Komponente eingestellt werden
© 2006
Oracle ADF Faces
Oracle JSF Component Framework
Library von JSF Komponenten
Basiert auf SUN RI 1.1
Optimaler Support mit Design-time Visual Tools in
JDeveloper 10.1.3
à
à
à
à
Visual Editing JSF Page
Faces-config.xml Editing Konsole
Visual Page flow design
Declarative data binding (JSR-227)
100% JSF Standard complient
© 2006
ADF Faces
Ca. 100 JSF Komponenten
à Einfache bis umfangreiche Komponenten
à http://www.oracle.com/technology/products/jdev/htdocs/partners/addins/exchange/jsf/in
dex.html
Partial Page Rendering (AJAX-style)
Client-Side Validation (JavaScript)
Dialog-Framework
Support für Skining
à Zur Laufzeit umschaltbar
Verschiedene RenderKits: HTML, Mobile, Telnet
Weitere Features:
File upload support, data tables, hierarchical tables, color/date pickers, progress
indicators, menu tabs/buttons, wizards, internationalization und accessibility
© 2006
ADF Faces
ADF Faces auch ohne JDeveloper benutzbar
ADF Faces wurde dieses Jahr an Apache Org. übergeben
à Subprojekt von MyFaces
à Æ OpenSource (ASF Lizenz)
à Neuer Name: Trinidad
(http://wiki.apache.org/myfaces/ADF_Faces)
© 2006
ADF Faces
Positiv
à
à
à
à
à
Mächtigkeit und Umfang der Komponenten
Nutzen von JavaScript: PPT und Client-Side Validation
Verschiedene RenderKits
Vorhandenes Look der Komponenten und Skining-Support
Sourcecode über Apache MyFaces
Negativ
à Verwenden eigener Look oder Kunden CI schwierig
à Skining ungenügend beschrieben - Komplette Anpassung möglich?
© 2006
Agenda
Einleitung
JSF Architektur
JSF Implementierungen
Fazit
Daten sind
immer im Spiel.
Referenzen
© 2006
Fazit
Why do I need it?
à Ed Burns, 27.4.2004 „About Faces: The JavaServer™ Faces API and
how it relates to Struts“
Spekulativ
OK
Standpunktfrage
Request/Response <-> Componets/Events
OK
Toolkit abhängig
© 2006
Fazit
Positiv
à
à
à
à
à
MVC Architektur
Trennung von Verhalten und Darstellung
Protokoll und Markup unabhängig
Komponentenmarkt
Event-orientiertes Programmiermodell
Negativ
à
à
à
à
Zusätzliche Technologie im Webumfeld
Umsetzung von vorgegebenem Look&Feel wird erschwert (z.Z.)
Ergänzende Frameworks sinnvoll
Proof of Concept im Projekt fehlt
© 2006
Herzlichen Dank!
Daten sind
immer im Spiel.
Fragen?
© 2006
Agenda
Einleitung
JSF Architektur
JSF Implementierungen
JSF 1.2
Daten sind
immer im Spiel.
Fazit
Referenzen
© 2006
Referenzen
JavaServer Faces
à SDN JavaServer Faces Technology,
http://java.sun.com/javaee/javaserverfaces/
SUN RI JSF
à https://javaserverfaces.dev.java.net/
à https://javaserverfaces.dev.java.net/presentations/
Apache MyFaces, http://myfaces.apache.org/
JCP,
http://www.jcp.org/en/jsr/detail?id=127,
http://www.jcp.org/en/jsr/detail?id=252
Oracle ADF Faces,
http://www.oracle.com/technology/products/jdev/htdocs/partners/addins/
exchange/jsf/index.html
© 2006
Bücher
„Pro JSF and AJAX“, Jonas Jacobi und John R. Fallows
ISBN: 1590595807, Apress
„JSF in Action“, Kito Mann
ISBN: 1932394125, Manning Publications
„JavaServer Faces: The Complete Reference“,
Chris Schalk, Ed Burns, James Holmes
ISBN: 0072262400, Osborne McGraw-Hill,
Erscheinungsdatum: 1. August 2006
© 2006
Weblogs
Jonas Jacobi, Oracle Mitarbeiter
http://www.orablogs.com/jjacobi/
Chris Schalk, Oracle Mitarbeiter
http://www.jroller.com/page/cschalk
OTN JSF, http://www.oracle.com/technology/tech/java/jsf.html
JSFCentral, http://www.jsfcentral.com/
James Holmes, http://www.jamesholmes.com/JavaServerFaces/
Adam Winer, http://sfjsf.blogspot.com/
Craig McClanahan, http://blogs.sun.com/roller/page/craigmcc/
© 2006
