JavaServer Faces JS Bournival 18 juillet 2007
Jun 10, 2015
JavaServer Faces JS Bournival
18 juillet 2007
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 2
Agenda
Introduction Historique Architecture Concepts clés Cycle de vie d’une requête Expression language Traction dans l’industrie Références Questions
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 3
JavaServer Faces?
JSF est la spécification d’un cadre d’application pour la couche de présentation d’une application web. JSF fait partie, aussi de la spécification globale de JEE 5.
JSR 127: spécification initiale résultant en l’implémentation de JavaServer Faces 1.1
JSR 252: spécification de JSF 1.2, corrigeant plusieurs problèmes, et ajoutant certaines nouvelles fonctionnalités
JSR 314: spécification de JSF 2.0 … à suivre.
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 4
Buts recherchés et Historique
RAD Rapid Application Development
RIA Rich Internet Application
Permettre, pour les développeurs, de facilement lier, dans un contexte stateful, des composants backend, avec des évènements émanant de l’interface-utilisateur.
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 5
Buts recherchés et Historique
… it is also aimed directly at solving many of the common problems
encountered when writing applications for HTML clients that communicate via HTTP […] These applications are typically form-based, and are comprised of one or more HTML pages with which the user interacts to complete a task or set of tasks.
- Craig McClanahan, Ed Burns, & Roger Kitain
Java Specification Request (JSR) 127
"
"
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 6
Architecture vue d’en haut
Markup generation
Stateful UI component model
Client-side event model
Conversion & validation
Navigation
Synchronisation avec les backing beans
JSF framework
Backing beans
Model objects(logique applicative)
Servlet container
Base de données
EJB
Service web
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 7
Niveaux d'abstractions
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 8
Les concepts clé
Les 8 éléments à maîtriser dans JSF UICOMPONENT RENDERER VALIDATOR BACKING BEANS CONVERTER EVENTS & LISTENERS MESSAGES NAVIGATION
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 9
Les concepts clé (1/8)
UICOMPONENT Abstraction et encapsulation de fonctionnalités pour un
composant possédant un état, et une représentation graphique
ViewRoot
Form
InputText Check box OutputText
VIEW STATE
RENDERED VIEW
Option 1
submit
Entrer le texte
...
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 10
Les concepts clé (2/8)
RENDERER renderer par défaut: HTML 4.01 direct implementation model VS. delegated implementation model Organisé render kits
HtmlCommandButton
Soumet-moi!
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 11
Les concepts clé (5/8)
CONVERTER prend en charge encoding-decoding converters de base fournis par JSF
<f:convertNumber />
<f:convertDateTime />
<h:inputText value="#{user.balance}"> <f:convertNumber type="currency" currencyCode="KZT"/></h:inputText>
<h:inputText value="#{user.dateOfBirth}"> <f:convertDateTime pattern="MM/dd/yyyy (hh:mm a)"/></h:inputText>
Petits exemples boboches mais qui disent tout:
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 12
Les concepts clé (3/8)
VALIDATOR directement dans l'implémentation du composant via une méthode d'une backing bean via une classe validateur générique
<h:inputText value="#{user.name}"> <f:validateLength minimum=“13"/></h:inputText>
<h:inputText value="#{user.creditCard}"> <f:validator validatorId=“com.nurun.CreditCardValidator"/></h:inputText>
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 13
Les concepts clé (4/8)
BACKING BEANS Lier la valeur d'un composant à
un attribut d'une backing bean Attacher un composant à un
attribut d'une backing bean Déclaration dans le fichier de
configuration de JSF Lien avec composantes
d'affaires (EJB3, Spring) Niveau de portée Application,
Session ou Requête
Option 1
submit
Entrer le texte
...
public String faitKekchose() { if (true) {
return ‘success’; } else {
// nothing }}
<h:commandButton action=“#{myBean.faitKekchose}“ … />
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 14
Les concepts clé (6/8)
EVENTS & LISTENERS Types
• value change events• action events• data model events• phase events
Les listeners sont appelés lors de la soumission Peut se présenter sous la forme d’une classe, ou simplement d’une
méthode d’une backing bean
<h:inputText value="#{myBean.name}" valueChangeListener="#{myBean.react}" />
Petit exemple:
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 15
Les concepts clé (7/8)
MESSAGES Erreurs d'application, ou de validation Composants pouvant ajouter des messages Rien de très magique ici, se compare aisément aux tags du style <html:errors/> de Struts
FacesContext context = FacesContet.getCurrentInstance();
context.addMessage(null, new FacesMessage("blah.");
<h:messages style=“color: blue“ />
Dans la vue:
Dans la backing bean:
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 16
Les concepts clé (8/8)
NAVIGATION Déclaration des règles de navigation dans le fichier de configuration
de JSF, faces-config.xml Basé sur des outcome sous la forme de chaîne de caractères Rien de nouveau ici pour les habitués de Struts
<navigation-rule>
<from-view-id>/welcome.jsp</from-view-id>
<navigation-case>
<from-outcome>success</from-outcome>
<to-view-id>/response.jsp</to-view-id>
</navigation-case>
</navigation-rule>
Exemple dans faces-config.xml:
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 17
Le cycle de vie d'une requête
6 phases forment le cycle de vie d’une requête JSF
Soumettre
Un clic est né
Restore View
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 18
Le cycle de vie d'une requête (1/6)
Restore View Construction ou mise à jour de l'arbre logique de
composants
Restore View
ViewRoot
Form
InputText Check box OutputText
<input type="hidden" name="com.sun.faces.VIEW" value="H4sIAAAAAAAAAMVaa2wcVxW+u347bmsnKXk1zTYPN2ncfT/zaOvYeayyboLXSYkjcMYzd+2NZ2emM7P2uFGiFNGCqIRAJRVIASrBj/4of0AI1B+8UWlQi4jgByCkCBVFlSgI/pSHoJx757m7d8axHZxVMp5799x7zz3fOd8599qvv486NBVFeLkW1epStMLxWIvW9aoYnVAxLutqndfrKt5Y2Tb60LULkTBqL6FufrYqCiqWdPRg6SI3z8XIgNiwqnKLpaqmHyyhHl7kNO1proZ1tN6UETlpJgYTVqUZEOgkK+majjZ4ZjjBabNjnAJfh6vCs+gKChsKaLeBSJhKOWsYz9/c/uU3ua+0oVARtWvV57ChIITaFtrh2auRwUjR0T4y1LC2BZtUZAnUjs7qNTF6Ah6n6rpS1yewoYNw+1RVyDhD98jqTJS7yBnpi1qFvrjDhqFV1jm9rlnDsuYw+uwADdob9CDPbkuyECipo/QSGpexiHn9iCyLmJNGZjE/Ny0bYKQB10iWGT/htq+T3Z+btq7RzHpiKq7McZDjFgE2XE2vUynKJ7 … ==" />
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 19
Le cycle de vie d'une requête
6 phases forment le cycle de vie d’une requête JSF
Soumettre
Un clic est né
Restore View Apply Request Values
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 20
Apply Request Values
Le cycle de vie d'une requête (2/6)
Apply Request Values Insertion des valeurs dans chacun des composants de
l'arbre
ViewRoot
Form
InputText Check box OutputText
POST /path/view.faces HTTP/1.0
From: [email protected]
User-Agent: HTTPTool/1.0
Content-Type: application/x-www-form-urlencoded
Content-Length: 32
Myform:mycomponent=bonhomme+carnaval& …
HTTP POST request
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 21
Le cycle de vie d'une requête
6 phases forment le cycle de vie d’une requête JSF
Soumettre
Un clic est né
Restore View Apply Request Values Process Validations
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 22
Process Validations
Le cycle de vie d'une requête (3/6)
Process Validations JSF demande à chacun des composants de se
convertir et de se valider (validateur externes etc.)
"tue jan 3 2007 11:25:21.234 EST"
java.util.Date
Render Response
X
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 23
Le cycle de vie d'une requête
6 phases forment le cycle de vie d’une requête JSF
Soumettre
Un clic est né
Restore View Apply Request Values Process Validations
Update Model Values
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 24
Update Model Values
Le cycle de vie d'une requête (4/6)
Update Model Values Insertion des valeurs dans le modèle (backing bean et
autres objets du modèle)
ViewRoot
Form
InputText Check box OutputText
Attribute 1Attribute 2
Backing Bean
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 25
Le cycle de vie d'une requête
6 phases forment le cycle de vie d’une requête JSF
Soumettre
Un clic est né
Restore View Apply Request Values Process Validations
Update Model ValuesInvoke Application
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 26
Invoke Application
Le cycle de vie d'une requête (5/6)
Invoke Application Exécute la méthode action (ou autre listener
enregistré) appelé par l'évènement par défaut déclenché par les composants de type «command» (lien ou bouton)
actionMethodlisteningMethod
Backing Bean
Hit me boy!
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 27
Le cycle de vie d'une requête
6 phases forment le cycle de vie d’une requête JSF
Soumettre
Un clic est né
Restore View Apply Request Values Process Validations
Update Model ValuesInvoke ApplicationRender ResponsePage HTML rendue
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 28
Render Response
Le cycle de vie d'une requête (6/6)
Render Response Affiche la réponse en mettant à contribution le
mécanisme de vue utilisé (JSP, Facelets)
ViewRoot
Form
InputText Check box OutputText
Attribute 1Attribute 2
Backing Bean
Page HTML rendue
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 29
JSF EL
EL == Expression Language Sont sous la forme #{…} Permet de dynamiquement manipuler les attributs des backing
beans ou objets du domaine, ou encore d'exécuter des opérations simples sans polluer une vue avec des scriplets qui s'intègre mal.
Similaires à JSP/JSTL ${…} Ces expressions sont évalués à l'exécution de la page
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 30
JSF EL (suite …)
On peut utiliser le langage d'expression de JSF pour: Insérer des composants dans des objets; Exposer les propriétés d'une JavaBean, d'une Collection, ou de types
simples; Référencer des méthodes (action, listener, validation, …); Exécuter des opérations logiques ou mathématiques; En plus, sont supportées les propriétés imbriquées.
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 31
JSF EL (suite …)
value-binding method-binding
Pour un listener Pour une action Pour un validator Pour un converter
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 32
Les composants standards de JSF
Option 1
Option 1
Clique-moi!
Entrer le texteEntrer plus de texte
Entrer le texte
Je me déroule
Option 1
Option 3
Option 2
Option 2
Item 1Item 2Item 3
<HIDDEN />
Je suis ici pour que tu me cliques!
**********
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 33
Implémentations de la spécification
Sun RI 1.2
Apache MyFaces 1.1 (1.2 pas encore release)
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 34
Librairies de composants
Oracle ADF Faces ICEFaces JBoss RichFaces JBoss Ajax4JSF Apache Tomahawk Apache Sandbox Apache Trinidad And many more …
+ +
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 35
Outils
Eclipse JSF Tools (WTP 2.0) IBM RAD NetBeans Sun Java Studio Creator RHDS / Exadel MyEclipse IDE Oracle JDeveloper BEA Workshop for JSF
+ +
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 36
Références
Livres JavaServer Faces in Action Core JSF
Sites Webs JCP.org JSR 127 JCP.org JSR 252 jsfcentral.com
Blogs Kito Mann (http://weblogs.java.net/blog/kito75/) Ed Burns (http://weblogs.java.net/blog/edburns/) Craig Mclanahan (http://blogs.sun.com/craigmcc/)
2006Communication interactive et nouvelles technologies / Interactive Communications through New Technologies Page 37
Ext. 2112