Sie sind auf Seite 1von 57

Cadillacs.

x23
v.1.0

Notas:

o
o
o
o

Agregar las libreras de JSF a nuestro proyecto, eclipse cuenta con la opcin de
integrarlo en la parte de propiedad de nuestro proyecto en Project Facets.
Las vistas terminaran con la extincin xhtml.
Uso de ManagedBeans (JavaBenas) para almacenar datos.
<h:view>
Se utilizaba para indicar que lo que haba dentro de estas
etiquetas se trataran como elementos JSF, en JSF 2.x ya no es necesario.

GLOBAL MENTORING - JSF


JavaServer Faces

Es una tecnologa que fue diseada para simplificar la construccin de interfaz de


usuario, para aplicaciones web java.
JavaServer Faces (JSF) es el marco de aplicaciones web estndar para java Enterprise
Edition (Java EE).
Caractersticas:
Implementa el patrn MVC proporcionando un enfoque orientado a eventos.
RAD. Desarrollo rpido de aplicaciones para Web.
Proporciona una API para componentes de interfaz de usuario. Componentes
reutilizables.
Render-kits. Los componentes pueden desplegarse no solamente en el
navegador Web, sino en dispositivos mviles u otros tipos de clientes.
Extensibilidad. JSF es altamente extensible debido a su arquitectura. Permite
crear fcilmente nuevos componentes, por lo que existen varios frameworks que
extienden el poder de JSF.
Caractersticas de JavaServer Faces 2.0:
Manejo de condiciones por default ms inteligentes, aplica para la navegacin
simple.
Manejo de anotaciones para varias configuraciones de este framework.
Soporte nativo para AJAX
Soporte por default Facelets
Mas componentes y validadores
Arquitectura JavaServer Faces

Patrn de Diseo MVC con JSF


El modelo contiene datos de la interfaz de usuario y es el responsable de mantener
los datos de la aplicacin Web. Se puede implementar con clases puras de java
(POJO) o con ManagedBean de Modelo. No tienen lgica de aplicacin ni
administran el flujo de la misma.

La vista define la interfaz de usuario con una jerarqua de interfaz, utiliza la librera
estndar de JavaServer faces, tambin libreras como EL (Expression Languaje) y
JSTL (Java Standar Tag Library), para facilitar el despliegue de informacin del
modelo.
La tecnologa por default en JSF 2.0 son los Facelets o JSP.
El controlador maneja las interacciones del usuario y la navegacin o flujo de la
aplicacin se implementa con Managed Bean Controlador.

Tecnologa de los Facelets


La tecnologa por default en JSF 2.0 son los Facelets.

Los Facelets fueron creados tomando en cuenta el ciclo de vida de JSF a diferencia
de los JSP.
Al ejecutar un Facelet, todos los componentes JSF se convierten a instancias java y
son administradas por un Component Tree que tambin es una clase de java .
Todos
los
componentes
JSF
se
derivan
de
la
clase
abstracta
javax.faces.component.UIComponet
El estado de los componentes (Component Tree) pueden almacenarse del lado
del cliente o del lado del servidor.
Al utilizar Facelets es ms sencillo encapsular cdigo y as crea componentes
reutilizables.
Los Facelets permiten crear plantillas y as definir ms fcilmente nuevas vistas a
partir de plantillas ya definidas.

Flujo de navegacin en JSF

1. El framework inicia una peticin GET a una pgina, por ejemplo nuestro
index.xhtml
2. Una vez que ya estamos dentro de JavaServer Faces, el usuario recibe el
contenido de respuesta y enva nuevamente una respuesta POST o GET al
servidor Web, en esta peticin el usuario est solicitando cierto recurso.
3. El servidor Web recibe la peticin y revisa los managed bean involucrados
en la peticin, si es necesario crea una instancia de ellos, dependiendo de su
alcance y en este momento si es necesario se mandan a llamar los mtodos
setters de las propiedades del bean que se deben llenar.

4. Se ejecuta el mtodo que procesa la peticin solicitada por el cliente, en este


momento ya deben de estar instanciados los managed bean involucrados en
esta peticin, si es que los hubiera.
5. Se ejecuta la lgica de negocio con el objetivo de obtener el modelo de nuestra
aplicacin, esto es la informacin que se va a desplegar o manipular dentro de
nuestra aplicacin.
6. Se selecciona el caso de navegacin respectivo y se redirecciona a la vista
correspondiente, en este caso la vista puede ser una pgina facelet o puede
ser un JSP,
7. En el paso 7, la vista utiliza la informacin de modelo que le comparti la
informacin JSF para finalmente regresar la respuesta solicitada al cliente.
8. Opcionalmente, como solicitud de la peticin, podra simplemente redireccionar
a un caso de navegacin, es decir pasar de la peticin 2 al paso 6,
simplemente para seleccionar una pgina a redireccionar.
Requerimientos para JSF 2.0
Ejecucin en Tomcat 6 o mayor
Java 5 o mayor
Archivos Jar de JSF 2.0 (Son dos JAR)
Configurar web.xml y faces-config.xml (opcional)
Para

el caso de Glassfish o JBoss


Java 6 o mayor
Descargar Glassfish 3 o JBoss AS 6
No se requieren libreras (Java EE 6 tiene soporte integrado para JSF 2.0)
Configurar web.xml y faces-config.xml (opcional)

Managed Beans
Un JavaBean es una clase Java que sigue las siguientes convenciones:
Tiene un constructor vacio
Tiene atributos privados (get/set).
Un managed bean son clases java que tambin cumplen con las convenciones de los
Javabeans sin embargo al trabajar con javaserver faces, vamos a trabajarlos y
configurarlos de manera distinta.
No estn obligados a extender de ninguna otra clase.
Aunque JSF no define una clasificacin para los managed beans (backing benas)
podemos definir las siguientes:
Beans de Modelo: representan el modelo en el patrn MVC.
Beans de control: Representan el controlador en el patrn MVC.
Beans de Soporte o Helpers: Contienen cdigo por ejemplo de Convertidores.
Beans de Utileria: Tareas genricas, como obtener el objeto request.

Un managed bean se puede declarar de distintas maneras:


Con anotaciones, antes del nombre de la clase.
o @ManagedBean

Como bean CDI (Contexts and Dependency Inyection), antes del nombre de la
clase:
o @Named
o Si usamos este concepto debemos declarar un archivo llamado beans.xml
en la carpeta web/WEB-INF
En el archivo faces-config.xml:
o <managed-bean> </managed-bean>

Alcance de los Managed Beans


application persiste durante toda la aplicacin.
sesin persiste durante el tiempo de la sesin del usuario.
view persiste si es la misma vista, til si usamos Ajax.
request persiste solo durante la peticin del usuario.
Nota: El alcance es menor de forma descendente.
CDI y el alcance de los Beans
application persiste durante toda la aplicacin.
sesin persiste durante el tiempo de la sesin del usuario.
Conversation persiste hasta completar alguna tarea (CDI y el alcance de los
beans).
request persiste solo durante la peticin del usuario.
Nota: El alcance es menor de forma descendente.
Ejemplo:
package beans.model;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
@ManagedBean
@RequestScoped
public class Candidato {
// constructor vacio
public Candidato() {
}
private String nombre;
public String getNombre() {
return nombre;
}
public void setNombre(String nombre) {
this.nombre = nombre;
}
}

Inyeccin de beans
JSF soporta inyeccin de dependencias simple
Se puede hacer de dos maneras diferentes:
Con anotaciones dentro del mismo Managed Bean:
o @ManagedProperty (value=#{nombreBean})

En el archivo faces-config.xml utilizando las siguientes etiquetas dentro de un


managed bean.
o <managed-property>#{nombreBean}</managed-property>
Archivo faces-config.xml uso:
Archivo opcional en JSF 2.0
Configuracin centralizada, todos nuestros componentes definidos en un solo
archivo.
Reglas de navegacin, flujo de nuestras paginas.
Declaracin de Managed Beans
Inyeccin de dependencias
Definir configuraciones regionales, especificar el idioma.
Registrar validadores
Registro de listeners
Ubicacin del archivo WEB-INF/faces-config.xml
Ejemplo de configuracin de un faces-config.xml

Expression Languaje (EL)


El lenguaje EL de JSF nos permite simplificar el manejo de expresiones en las pginas JSF.
El lenguaje EL enlaza la Vista con el Modelo del patrn MVC.
Es decir que al definir un bean simplemente para desplegar esta informacin en nuestro
JSF utilizamos la siguiente estructura:
#{nombreBean.propiedad}

Objetos implcitos en EL

El lenguaje EL tambin nos permite acceder fcilmente a objetos implcitos (ya


instanciados) en las pginas JSF, algunos ejemplos son:
Cookie : Map

facesContext: FacesContext
header: Map
headerValues: Map
param: Map
paramValues: Map
request (JSF 1.2): ServletRequest or PortletRequest
session (JSF 1.2): HttpSession or PortletSession
requestScope: Map
sessionScope: Map
applicationScope: Map
initParam: Map
view: UIViewRoot
Existen Operadores EL

Ejercicio
Alcance de Request en JSF

Navegacin en JSF
Paso 6. Es donde se definen las Reglas de Navegacin

La navegacin en JSF permite movernos entre pginas de la misma tecnologa.


Existen varios tipos de navegacin
o Navegacin Esttica. En el cual el valor de la siguiente vista/pagina est
definido por un solo nombre o cadena fija.
o Navegacin dinmica. El valor de la siguiente vista/pagina a seleccionar
va a depender de la accin que ejecute el usuario y la cadena de regreso
de la accin ejecutado.

Existen varias formas de configurar la navegacin.


o Navegacin implcita (JSF 2.0) la salida especificada busca directamente
una pgina con un nombre idntico a la cadena de salida en el directorio
actual, con la extensin de la pgina actual tambin por ejemplo xhtml o
JSP.
o Navegacin explicita. Por el contrario se define la navegacin dentro del
archivo faces-config.xml se debe de agregar un elemento xml que

permita indicar de donde proviene la peticin, cul es su salida y hacia que


pgina debe dirigirse. Con JSF 2.0 con solo regresar una cadena, busca en
automtico una pgina con un nombre idntico y se le encuentra toma
preferencia y despliega esa vista en lugar de buscar un caso de navegacin
dentro del archivo de faces-config.xml

El elemento para definir cul es la siguiente pgina a mostrar es una cadena y


se le conoce como salida o en ingles Outcome.
o La navegacin esttica aplica en los siguientes casos:
No se requiere ejecutar cdigo java del lado del servidor, si no
nicamente dirigirse a otra pgina.
No hay lgica para determinar la pgina siguiente a mostrar.
o Ejemplos de Navegacin esttica:
Pgina JSF que indica la peticin:
<h:commandButton label=Entrar action=login />
Como podemos observar el login es solo una cadena.
La pgina siguiente se puede determinar de 2 formas:
a) Outcome por default, buscar directamente la pgina
login.xhtml y esta pgina se va a buscar en el mismo directorio
donde se encuentra la pgina que inicio la peticin.
b) Como segunda opcin, busca el outcome en faces-config.xml,
encontrando el caso que determina la siguiente pgina a
mostrar, como hemos comentado la navegacin esttica se
utiliza cuando no requerimos ninguna lgica para determinar la
siguiente vista a mostrar, sino simplemente sabemos cul es la
pgina siguiente y podemos especificarlo por medio de un
nombre y este nombre nos dar el siguiente pgina a mostrar.

Navegacin Dinmica
La navegacin dinmica utiliza un mtodo action, el cual tiene la tecnologa
para determinar el outcome (salida).
o Ejemplo,
cdigo pgina JSF (vista)
<h: commandButton label=Aceptar
action=#{loginBean.verificarUsuario} />
Cdigo LoginBean (Controlador)
public String verificarUsuario{
if()
return exito; //outcome, pagina a mostrar
else
return fallo; //outcome, pagina a mostrar
NOTA: El outcome busca primero una vista llamada xito/fallo en caso de no contar con
una vista de esos nombres, si no lo encuentra procede a buscar dentro del archivo facesconfig.xml un caso de navegacin que tenga como outcome la palabra exito/fallo y
dependiendo de ello mostrara la siguiente vista a mostrar.

Creacin de reglas de navegacin

<faces-config>
<navigation-rule>
<from-view-id>/inicio.xhtml</from-view-id>
peticin
<navigation-case>
tener varios, a
<from-outcome>entrar</ from-outcome>
<to-view-id>/login.xhtml</ to-view-id>/
</navigation-case>

</navigation-rule>

</faces-config>

-> pagina de donde proviene la


-> Casos de navegacin, puede
diferentes pginas de JSF.

Como resumen una pgina de origen puede tener como destino varias paginas o lo que
es lo mismo de nuestro outcome, tambin podemos tener reglas de navegacin
genricas, por ejemplo redirigir cualquier pagina a la pgina de inicio, si es que se
requiere.

Ciclo de Vida en JSF

El ciclo de vida de JSF comienza con una peticin de un usuario, en este caso el usuario
solicita un recurso de nuestro servidor Web, la primera fase en este ciclo de vida, es el
proceso de restauracin o creacin de la vista, si es la primera vez que solicita esta vista,
se va a crear cada uno de los componentes que representan las etiquetas de nuestra
pgina JSF y va a tener una clase correspondiente de java que represente esa etiqueta en
JSF, todas estas etiquetas son administradas por un componente principal llamada
componentTree o rbol de componentes, en caso de que la peticin haya sido GET o sin
parmetros, en este caso el Framework no tiene nada ms que realizar y simplemente
regresa la respuesta hacia el cliente, en caso contrario y que necesitemos procesar
informacin, el paso es aplicar los valores de la peticin en este paso los parmetros
enviados son mapeados con cada uno de los componentes java correspondientes esto
nos permitir llenar la informacin que los usuarios estn enviando a nuestra aplicacin
java.
En el paso 3 de este ciclo de vida, lo que sucede es el procesamiento de validaciones y
conversiones es decir en el paso 2 ya se asignaron los valores correspondientes a
nuestras clases java. Sin embargo en este punto, si esos valores son los adecuados o si
es necesario convertirlos a cierto tipo de datos. Por ello en el paso 3 si alguna validacin
falla el estado del componente java se marca como invalido y se pasa directamente al
paso 6 (Error de Conversin o validacin) esto solo sucede en el caso de que hayamos
encontrado algn error. Sin embargo esto nos garantiza que nuestra aplicacin java no va
a continuar si es que tiene un problema de validacin o de correccin de datos. En caso
de que no tengamos errores, pasa al paso 4.
En el paso 4, lo que hace el framework es actualizar los valores de nuestras clases de
modelos, los valores de los componentes de java ya una vez validados y convertidos en
el paso 3 son puestos en los objetos de modelo utilizando los mtodos Setters
respectivos, es decir que hasta este paso 4 es donde realmente el framework nos
garantiza que esos valores ya los podemos utilizar para operar, por ejemplo si estamos
utilizando un dato de tipo fecha en este momento la fecha se puede convertir
directamente a un tipo fecha y no manejarlo como String ya que normalmente as es
como suceda dentro del API de los Servlets y los JSPs , cuando utilizbamos esas
tecnologas nosotros ramos responsables de hacer este tipo de conversin, en el caso
de JSF mucho de ese trabajo queda resuelto por el propio framework.
En el paso 5 ya que tenemos la informacin de modelo procedemos a invocar nuestra
aplicacin o lo que es lo mismo, los mtodos que procesan las peticiones de nuestros

usuarios, en este punto se ejecutan los mtodos accin que estn almacenados en los
managedBean, los mtodos actionListener son llamados antes que los mtodos de
tipo action.
Una vez que hemos procesado los mtodos de nuestra aplicacin se genera una
respuesta respectiva hacia el cliente.
Con esto se concluye el ciclo de vida de nuestra aplicacin de JSF, es posible crear clases
para la depuracin de las fases paso a paso, para ello debemos de implementar la
interfaz feceListener y se debe de registrar en el archivo de faces-config.xml.

Validadores, Convertidores y Manejo de Mensajes en JSF


Validadores en JSF
El pas 3 es donde se validan y convierten los datos, para asegurar que los datos
de nuestra aplicacin sean consistentes. Segn los datos introducidos por el
usuario. Este proceso permite asegurar que antes de actualizarle informacin del
modelo, es decir las propiedades de nuestro model managed bean, tengamos la
certeza de que la informacin se encuentra con el formato y el tipo de dato
deseado.

JSF provee distintos tipos de validaciones, por ejemplo validaciones estndar,


validaciones en los mtodos de los managedBeans y validaciones personalizadas o
customizada.

Validaciones en JSF
Veremos dos maneras de ejecutar la validacin
componente:
Validacin individual por campo
Validacin por campos interdependientes

en

nuestros

componentes

Podemos lograr la validacin individual de varias maneras, por ejemplo:


Agregando un atributo required al tag JSF.
Agregando un atributo validador al tag JSF.
Agregando un validador como tag interno
El tag h:message se utiliza para mostrar errores de un componente JSF
Ejemplo de un validador estndar:
<h: inputText id=edadId required=true value=#{empleadoBean.edad} >
<f:valdiateLongRange mnimum=18 mximum=50 />
</h:inputText>
Ejemplo de validador personalizado
<h:inputText id=ipID required=true value=#{ipBean.ipValor}>
<f:validator validatorId=validadorIp />
</h:inputText>
Nota: El nombre de validadorIp deber de estar definido en el archivo de facesconfig.xml o deber de utilizar la anotacin de facesValidator e implementar el
mtodo validate dentro de este Bean.

La validacin interdependiente se ejecuta dentro de los mtodos actions.


El tag h:messages se utiliza para mostrar varios errores a la vez.

Manual de Introduccin a JSF


ndice
Captulo 1. Introduccin
1.1Preliminares
1.2Caractersticas principales
1.3Comparativa con Tecnologas similares
1.4Beneficios de la Tecnologa JavaServer Faces
1.5Qu es una aplicacin JavaServer Faces?
1.6Una sencilla aplicacin JavaServer Faces
Captulo 2. Instalacin de Ambiente
Captulo 3 Modelo Vista Controlador en JSF
3.1
Introduccin
3.2
Modelo
3.3
Vista
3.4
Controlador
3.5
Ciclo de vida de una pgina JavaServer Faces
3.5.1 Escenarios de Procesamiento del Ciclo de Vida de una Peticin
3.5.2 Ciclo de Vida Estndar de Procesamiento de
3.6
Una sencilla aplicacin JavaServer Faces en detalle
3.7
Beans y pginas JSF
3.7.1 Beans
3.7.2 Paginas JS
3.8
Configuracin Servlet
Captulo 4 Managed Beans, navegacin y etiquetas bsicas JSF
4.1Managed Beans
4.1.1 Concepto
4.1.2 mbitos de los beans
4.1.3 Configuracin de un bean a travs de XML
4.2Navegacin
4.2.1 Concepto
4.2.2 Navegacin esttica
4.2.3 Navegacin dinmica
4.2.4 Navegacin avanzada
4.3Etiquetas bsicas

4.4Un ejemplo completo de etiquetas bsicas con JSF

Captulo 5 Etiquetas JSF estndares


5.1
Introduccin
5.2
Etiquetas Core
5.3
Etiquetas HTML
5.3.1 Atributos comunes

1. INTRODUCCIN
1.1

Preliminares

Tradicionalmente, las aplicaciones web se han codificado mediante pginas JSP (Java
Server Pages) que reciban peticiones a travs de formularios y construan como
respuesta pginas HTML (Hiper Text Markup Language) mediante ejecucin directa o
indirecta -a travs de bibliotecas de etiquetas- de cdigo Java, lo que permita, por
ejemplo, acceder a bases de datos para obtener los resultados a mostrar amn de
realizar operaciones marginales como insertar o modificar registros en tablas
relacionales, actualizar un carrito de la compra, etc.
JavaServer Faces pretende facilitar la construccin de estas aplicaciones proporcionando
un entorno de trabajo (framework) va web que gestiona las acciones producidas por el
usuario en su pgina HTML y las traduce a eventos que son enviados al servidor con el
objetivo de regenerar la pgina original y reflejar los cambios pertinentes provocados por
dichas acciones. En definitivas cuentas, se trata de hacer aplicaciones Java en las que el
cliente no es una ventana de la clase JFrame o similar, sino una pgina HTML.
Como el lector puede imaginar, cualquier evento realizado sobre una pgina JSF incurre
en una carga sobre la red, ya que el evento debe enviarse a travs de sta al servidor, y
la respuesta de ste debe devolverse al cliente; por ello, el diseo de aplicaciones
JavaServer Faces debe hacerse con cuidado cuando se pretenda poner las aplicaciones a
disposicin del mundo entero a travs de internet. Aquellas aplicaciones que vayan a ser
utilizadas en una intranet podrn aprovecharse de un mayor ancho de banda y
producirn una respuesta mucho ms rpida.

1.2

Caractersticas principales

La tecnologa JavaServer Faces constituye un marco de trabajo (framework) de interfaces


de usuario del lado de servidor para aplicaciones web basadas en tecnologa Java y en el
patrn MVC (Modelo Vista Controlador).
Los principales componentes de la tecnologa JavaServer Faces son:

Una API y una implementacin de referencia para:


Representar componentes de interfaz de usuario (UI-User Interface) y manejar su
estado
Manejar eventos, validar en el lado del servidor y convertir datos
Definir la navegacin entre pginas
Soportar internacionalizacin y accesibilidad, y
Proporcionar extensibilidad para todas estas caractersticas.
Una librera de etiquetas JavaServer Pages (JSP) personalizadas para dibujar
componentes UI dentro de una pgina JSP.
Este modelo de programacin bien definido y la librera de etiquetas para
componentes

UI facilita de forma significativa la tarea de la construccin y mantenimiento de


aplicaciones web con UIs en el lado servidor. Con un mnimo esfuerzo, es posible:
Conectar eventos generados en el cliente a cdigo de la aplicacin en el lado
servidor.
Mapear componentes UI a una pgina de datos en el lado servidor.
Construir una interfaz de usuario con componentes reutilizables y extensibles.
Como se puede apreciar en la figura 1.1, la interfaz de usuario que se crea con la
tecnologa JavaServer Faces (representada por miUI en el grfico) se ejecuta en el
servidor y se renderiza en el cliente.

Figura 1.1 Diagrama de una aplicacin JSF


En la figura no queda qu es fsicamente miUI. La pgina JSP, miform.jsp, especifica los
componentes de la interfaz de usuario mediante etiquetas personalizadas definidas por la
tecnologa JavaServer Faces. LA UI de la aplicacin web (representada por miUI en la
figura) maneja los objetos referenciados por la JSP, que pueden ser de los siguientes
tipos:

1.3

Objetos componentes que mapean las etiquetas sobre la pgina JSP.


Oyentes de eventos, validadores y conversores registrados y asociados a los
componentes.
Objetos del modelo que encapsulan los datos y las funcionalidades de los
componentes especficos de la aplicacin (lgica de negocio).

Comparativa con Tecnologas similares

Al igual que Struts, JSF pretende normalizar y estandarizar el desarrollo de aplicaciones


web. Hay que tener en cuenta que JSF es posterior a Struts y, por lo tanto, se a nutrido de
la experiencia de ste, erradicando algunas sus deficiencias. De hecho el creador de
Struts (Craig R. McClanahan) tambin es el lder de la especificacin de JSF.

Como se ha indicado, JSF es muy similar a Struts, ya que la interfaz de usuario se


implementa con pginas JSP, con la ventaja de que puede trabajar con diversas
herramientas de desarrollo que pueden facilitar la elaboracin de la interfaz de forma
visual, pero esto es opcional, pudiendose hacer mediante editores de texto, editando
cada uno de los ficheros que componen la aplicacin, tal y como se ha trabajado en este
tutorial. Sin embargo se abordar el uso de estas herramientas, en concreto, Java Studio
Creator, en el ltimo captulo.
No obstante, JSF no puede competir en madurez con Struts (en este punto Struts es claro
ganador), pero s puede ser una opcin muy recomendable para nuevos desarrollos,
sobre todo si todava no tenemos experiencia con Struts.
1.4 Beneficios de la Tecnologa JavaServer Faces
A continuacin se explican algunos de los puntos por los que JSF es una tecnologa muy
interesante (incluso mas que Struts).
Una de las ventajas de que JSF sea una especificacin estndar es que pueden
encontrarse implementaciones de distintos fabricantes. Esto permite no vincularse
exclusivamente con un proveedor concreto, y poder seleccionar el que ms interese en
cada caso segn el nmero de componentes que suministra, el rendimiento de stos,
soporte proporcionado, precio, poltica de evolucin, etc.
JSF trata la vista (la interfaz de usuario) de una forma algo diferente a lo que estamos
acostumbrados en aplicaciones web, ya que este tratamiento es mucho ms cercano al
estilo de Java Swing, Visual Basic o Delphi, donde la programacin de la interfaz se hacer
a travs de componentes y est basada en eventos (pulsacin de un botn, cambio en el
valor de un campo, etc.).
JSF es muy flexible. Por ejemplo nos permite crear nuestros propios componentes, y/o
crear nuestros propios renderizadores para pintar los componentes en la forma que ms
nos convenga.
Una de las grandes ventajas de la tecnologa JavaServer Faces es que ofrece una clara
separacin entre el comportamiento y la presentacin. Las aplicaciones web construidas
con tecnologa JSP conseguan parcialmente esta separacin. Sin embargo, una aplicacin
JSP no puede mapear peticiones HTTP al manejo de eventos especficos de los
componentes o manejar elementos UI como objetos con estado en el servidor. La
tecnologa JavaServer Faces permite construir aplicaciones web que introducen realmente
una separacin entre el comportamiento y la presentacin, separacin slo ofrecida
tradicionalmente por arquitecturas UI del lado del cliente.
Separar la lgica de negocio de la presentacin tambin permite que cada miembro del
equipo de desarrollo de la aplicacin web se centre en su parte asignada del proceso
diseo, y proporciona un modelo sencillo de programacin para enlazar todas las piezas.
Por ejemplo, personas sin experiencia en programacin pueden construir pginas JSF
usando las etiquetas de componentes UI que esta tecnologa ofrece, y luego enlazarlas
con cdigo de la aplicacin sin escribir ningn script ni nada.
Otro objetivo importante de la tecnologa JavaServer Faces es mejorar los conceptos
familiares de componente-UI y capa-web sin limitarnos a una tecnologa de script
particular o un lenguaje de marcas. Aunque la tecnologa JavaServer Faces incluye una
librera de etiquetas

JSP personalizadas para representar componentes en una pgina JSP, las APIs de
JavaServer Faces se han creado directamente sobre el API JavaServlet. Esto nos permite,
tericamente, hacer algunas cosas avanzadas: usar otra tecnologa de presentacin junto
a JSP, crear nuestros propios componentes personalizados directamente desde las clases
de componentes, y generar salida para diferentes dispositivos cliente, entre otras.
En definitivas cuentas, la tecnologa JavaServer Faces proporciona una rica arquitectura
para manejar el estado de los componentes, procesar los datos, validar la entrada del
usuario, y manejar eventos.

1.5 Qu es una aplicacin JavaServer Faces?


En su mayora, las aplicaciones JavaServer Faces son como cualquier otra aplicacin web
Java. Se ejecutan en un contenedor de servlets de Java y, tpicamente, contienen:
Componentes JavaBeans (llamados objetos del modelo en tecnologa JavaServer
Faces) conteniendo datos y funcionalidades especficas de la aplicacin.
Oyentes de Eventos.
Pginas, (principalmente pginas JSP).
Clases de utilidad del lado del servidor, como beans para acceder a las bases de
datos. Adems de estos tems, una aplicacin JavaServer Faces tambin tiene:
Una librera de etiquetas personalizadas para dibujar componentes UI en una
pgina.
Una librera de etiquetas personalizadas para representar manejadores de eventos,
validadores y otras acciones.
Componentes UI representados como objetos con estado en el servidor.
Toda aplicacin JavaServer Faces debe incluir una librera de etiquetas personalizadas que
define las etiquetas que representan componentes UI, as como una librera de etiquetas
para controlar otras acciones importantes, como validadores y manejadores de eventos.
La implementacin de JavaServer Faces, de Sun proporciona estas dos libreras. La
librera de etiquetas de componentes elimina la necesidad de codificar componentes UI
en HTML u otro lenguaje de marcas, lo que se traduce en el empleo de componentes
completamente reutilizables. Y la librera principal (core) hace fcil registrar eventos,
validadores y otras acciones de los componentes.
Como librera de etiquetas de componentes puede usarse la librera html_basic incluida
con la implementacin de referencia de la tecnologa JavaServer Faces, aunque tambin
es posible definir una librera de etiquetas personalizadas que dibuje componentes
propios o que proporcione una salida distinta a HTML.
Otra ventaja importante de las aplicaciones JavaServer Faces es que los componentes UI
de la pgina estn representados en el servidor como objetos con estado. Esto permite a
la aplicacin manipular el estado del componente y conectar los eventos generados por
el cliente a cdigo en el lado del servidor.

Finalmente, la tecnologa JavaServer Faces permite convertir y validar datos sobre


componentes individuales e informar de cualquier error antes de que se actualicen los
datos en el lado del servidor.
Debido a la divisin de labores que permite el diseo de la tecnologa JavaServer Faces, el
desarrollo y mantenimiento de una aplicacin JavaServer Faces se puede realizar muy
rpida y fcilmente. Abajo tenemos un listado de los roles principales de un equipo de
desarrollo tpico.
Aunque en muchos equipos, los desarrolladores individuales puede interpretar ms de
uno de esos roles, resulta muy til considerar la tecnologa JavaServer Faces desde varias
perspectivas basadas en la responsabilidad principal que tiene cada participante:

Autores de pginas, que utilizan un lenguaje de marcas, como HTML, para construir
pginas para aplicaciones web. Cuando se utiliza la tecnologa JavaServer Faces,
los autores de pginas casi siempre usarn exclusivamente la librera de etiquetas.
Desarrolladores de aplicaciones, que programan los objetos del modelo, los
manejadores de eventos, los validadores, y la navegacin de pginas. Los
desarrolladores de aplicaciones tambin pueden proporcionar las clases de utilidad
necesarias.
Escritores de componentes, que tienen experiencia en programar interfaces de
usuario y prefieren crear componentes personalizados utilizando un lenguaje de
programacin. Esta gente puede crear sus propios componentes desde cero, o
puede extender los componentes estndares proporcionados por JavaServer Faces.
Vendedores de herramientas, que proporcionan herramientas que mejoran la
tecnologa JavaServer Faces para hacer incluso ms sencilla la construccin de
interfaces de usuario en el lado servidor.

Para las aplicaciones web pueden ser muy convenientes frameworks como JSF, Struts,
Spring,etc., pero stos no servirn (a no ser a costa de un gran esfuerzo) para hacer
portales. Para este segundo caso sera ms adecuado usar gestores de contenidos como
Lenya, OpenCMS, etc.

1.6 Una sencilla aplicacin JavaServer Faces


Esta seccin describe el proceso de desarrollo de una sencilla aplicacin JavaServer
Faces. Con ella se ver qu caractersticas contiene una aplicacin tpica JavaServer
Faces.

Primeros Pasos
o Agregar las libreras de JSF a nuestro proyecto, eclipse cuenta con la opcin de
integrarlo en la parte de propiedad de nuestro proyecto en Project Facets.
o

Encabezado de nuestras paginas JSP


<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets">
<head>

Nuestra primera aplicacin empieza con una pantalla de entrada con un Login y un
password. Como vemos en la figura 1.2:

Figura 1.2 Salida del fichero ejemploBasico/index.jsp


Fichero: ejemploBasico/index.jsp

Discutiremos en detalle el contenido de este archivo ms tarde . Por ahora, baste con
comentar los siguientes puntos:

core
JAVASERVER FACES

-----------------------------------------THIRD EDITION
JSF 2.0 es mucho ms simple de usar y mejor integrado en la pila de la tecnologa Java EE
de JSF 1.0. Casi cada centmetro de JSF 1.0 se ha transformado en JSF 2.0 de alguna
manera para mejor. Adems, la especificacin es ahora compatible con las nuevas
tecnologas web tales como Ajax y REST.
JSF es ahora el marco de web de Java del lado del servidor por excelencia, y se ha
cumplido la mayora de sus promesas. Usted realmente puede disear interfaces de
usuario web poniendo componentes en un formulario y su vinculacin a objetos Java, sin
tener que mezclar cdigo y marcado. Un punto de JSF fuerte es su modelo de
componentes extensibles, y un gran nmero de componentes de terceros se han

convertido en disponible. El diseo flexible del marco ha permitido crecer bien y


acomodar las nuevas tecnologas.
Debido a que JSF es una especificacin y no un producto, usted no est a merced de un
nico proveedor. Implementaciones de JSF, componentes y herramientas estn
disponibles a partir de mltiples fuentes. Estamos muy entusiasmados con JSF 2.0, y
esperamos que compartir este entusiasmo cuando usted aprende cmo esta tecnologa
que hace que un desarrollador de aplicaciones web ms eficaz.
Acerca de este libro
La primera mitad del libro, que se extiende a travs del Captulo 7, se centra en las
etiquetas JSF. Estas etiquetas son similares a las etiquetas de formulario HTML. Ellos son
los bloques bsicos de construccin para las interfaces de usuario JSF. Cualquier persona
con conocimientos bsicos de HTML (para el diseo de pginas web) y de programacin
Java estndar (por la lgica de la aplicacin) puede utilizar las etiquetas JSF para
construir aplicaciones web.
La primera parte del libro se tratan los siguientes temas:
Configuracin del entorno de programacin (Captulo 1)
Conexin de etiquetas JSF a la lgica de la aplicacin (Captulo 2)
Navegacin entre pginas (Captulo 3)
El uso de las etiquetas JSF estndar (captulo 4)
El uso de Facelets etiquetas para plantillas (Captulo 5)
Las tablas de datos (captulo 6)
La conversin y la entrada de validacin (captulo 7)
Comenzando con el captulo 8, comenzamos la programacin JSF en serio. Usted
aprender cmo realizar tareas avanzadas, y la forma de ampliar el marco JSF. Estos son
los principales temas de la segunda parte:
Control de eventos (captulo 8)
Los componentes reutilizables compuestos, componentes con un comportamiento
sofisticado que se componen de componentes ms simples (Captulo 9)
El Ajax (Captulo 10)
La implementacin de componentes personalizados (Captulo 11)
Conexin a bases de datos y otros servicios externos (Captulo 12)
Terminamos el libro con un captulo que pretende dar respuesta a las preguntas ms
comunes de la forma "Cmo puedo. . . ? "(Captulo 13). Le animamos a echar un vistazo
a ese captulo tan pronto como usted se sienta cmodo con los conceptos bsicos de JSF.
Hay notas tiles sobre depuracin y registro, y tambin le dan detalles de la
implementacin y el cdigo de trabajo para las caractersticas que faltan en JSF, como la
carga de archivos, mens pop-up, y un componente de buscapersonas para tablas largas.
Todos los captulos se han revisado extensamente en esta edicin para destacar las
caractersticas nuevas y mejoradas de JSF 2.0. Los captulos 5, 9 y 10 son nuevos en esta
edicin.
Software necesario
Todo el software que usted necesita para este libro est disponible gratuitamente. Puede
utilizar un servidor de aplicaciones compatible con Java EE 6 (como GlassFish versin 3) o
un corredor servlet (como Tomcat 6), junto con una aplicacin JSF. El software funciona en
Linux, Mac OS X, Solaris y Windows. Tanto Eclipse y NetBeans tienen un amplio apoyo
para el desarrollo de JSF con GlassFish o Tomcat.

EMPEZANDO
Los temas de este captulo
"Por qu JavaServer Faces?" En la pgina 3
"Un ejemplo sencillo" en la pgina 4
"Entornos de desarrollo para JSF" en la pgina 13
"Un Anlisis de la aplicacin de ejemplo" en la pgina 15
"Un primer vistazo de Ajax" en la pgina 21
"JSF Framework Services" en la pgina 24
"Detrs de las escenas" en la pgina 26

Chapter 1
Por qu JavaServer Faces?
Hoy en da, se puede elegir entre muchos frameworks para el desarrollo de la interfaz de
usuario de una aplicacin web. JavaServer Faces (JSF) es un marco basado en
componentes. Por ejemplo, si desea mostrar una tabla con filas y columnas, no generas
etiquetas HTML para las filas y las clulas en un bucle, pero se agrega un componente de
tabla a una pgina. (Si usted est familiarizado con el desarrollo de Java del lado del
cliente, se puede pensar en JSF como "Swing para aplicaciones de servidor.") Utilizando
componentes, se puede pensar en su interfaz de usuario a un nivel ms alto que el HTML
puro. Puede volver a utilizar sus propios componentes y utilizar conjuntos de
componentes de terceros. Y usted tiene la opcin de utilizar un entorno de desarrollo
visual en el que usted puede arrastrar y soltar componentes en un formulario.
JSF tiene las siguientes partes:
Un conjunto de IU prefabricada componentes (interfaz de usuario)
Un modelo de programacin orientada a eventos
Un modelo de componentes que permite a los desarrolladores de terceros para
suministrar componentes adicionales
Algunos componentes JSF son simples, tales como campos de entrada y botones. Otros
son bastante sofisticados, por ejemplo, tablas y rboles de datos.

JSF contiene todo el cdigo necesario para la gestin de eventos y organizacin de los
componentes.
Los programadores de aplicaciones pueden ser felizmente ignorante de estos detalles y
gastar su esfuerzo en la lgica de la aplicacin.
JSF no es el nico framework de desarrollo web basado en componentes, pero es la capa
de la vista en el estndar Java EE. JSF se incluye en cada servidor de aplicaciones Java EE,
y puede ser fcilmente aadidos a un contenedor web independiente como Tomcat.
A diferencia de la mayora de los frameworks web, JSF es un estndar con mltiples
implementaciones. Esto le da una opcin de los vendedores. Otra ventaja es que un
comit de normas ha dado una atencin considerable al diseo de la estructura, y que
JSF se mejora y actualiza continuamente.
Este libro se centra en JSF 2.0, una mejora importante con respecto a versiones
anteriores. JSF 2.0 es mucho ms sencillo de usar que 1.x JSF, y proporciona nuevas y
potentes funciones, como la integracin fcil Ajax y autora componente compuesto.

Un ejemplo sencillo
Vamos a echar un vistazo a un ejemplo simple de una aplicacin JSF. Nuestro ejemplo se
inicia con una pantalla de inicio de sesin, se muestra en la Figura 1-1.

Figura 1-1
El archivo que describe la pantalla de inicio de sesin es esencialmente un archivo HTML
con algunas etiquetas adicionales (ver Listado 1-1). Su aspecto visual puede mejorar
fcilmente por un artista grfico que no necesitar tener conocimientos de programacin.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html">
<h:head>
<title>Welcome</title>
</h:head>
<h:body>
<h:form>
<h3>Please enter your name and password.</h3>
<table>
<tr>
<td>Name:</td>
<td><h:inputText value="#{user.name}" /></td>
</tr>
<tr>

<td>Password:</td>
<td><h:inputSecret value="#{user.password}" /></td>
</tr>
</table>
<p>
<h:commandButton value="Login" action="welcome" />
</p>
</h:form>
</h:body>
</html>

Se discute el contenido de este archivo en detalle en la seccin "JSF Pages". Por ahora, tenga en
cuenta los siguientes puntos:

Un nmero de las etiquetas son etiquetas HTML estndar: p, table, y as sucesivamente.


Algunas etiquetas tienen prefijos, como h: head y h: inputText. Estos son etiquetas JSF. El
atributo xmlns declara el espacio de nombres JSF.
Las etiquetas h: inputText, h: inputSecret, y h: CommandButton corresponden al campo de
texto, campo de contrasea, y botn de envo en la Figura 1-1.
Los campos de entrada estn vinculados a las propiedades de objetos. Por ejemplo, el valor
de value= "# {user.name}" cuenta la implementacin JSF para vincular el campo de texto
con la propiedad del nombre de un objeto de usuario. Discutimos este vnculo en ms
detalle en la seccin "Beans" en la pgina 16.

Cuando el usuario introduce el nombre y la contrasea, y haga clic en el botn "Login", se muestra
el archivo welcome.xhtml, segn se especifica en el atributo de accin de la Etiqueta h:
commandButton. (Ver Figura 1-2 y el Listado 1-2.)

Figura 1.2 Una pgina de bienvenida

La segunda pgina JSF de nuestra aplicacin es incluso ms sencillo que el primero (ver
el Listado 1-2). Usamos el # {user.name} expresin para mostrar la propiedad name del
objeto de usuario que se encuentra en la primera pgina. La contrasea se ignora por el
momento.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html">
<h:head>
<title>Welcome</title>
</h:head>
<h:body>
<h3>Welcome to JavaServer Faces, #{user.name}!</h3>
</h:body>
</html>

El propsito de esta aplicacin es, por supuesto, no para impresionar a nadie, pero para
ilustrar las diversas piezas que son necesarias para producir una aplicacin JSF.

Ingredientes

Nuestra aplicacin de muestra se compone de los siguientes ingredientes:


Pginas que definen la entrada y pantallas de bienvenida. Los llamamos
index.xhtml y welcome.xhtml.
Un Bean que gestiona los datos de usuario (en nuestro caso, nombre de usuario y
contrasea). Un bean es una clase Java que expone las propiedades, siguiendo un
sencillo convencin de nombres para los mtodos get y set. El cdigo de la
UserBean.java archivo (ver Listado 1-3). Tenga en cuenta el "@Named" o anotacin
"@ManagedBean" que especifica el nombre por el cual un objeto de esta clase se
hace referencia en las pginas JSF. (Por razones de compatibilidad, hay dos
anotaciones alternativas para el nombramiento de un bean. "@Named" Es la mejor
opcin con un servidor de aplicaciones compatible con Java EE 6.
"@ManagedBean" Est destinado para su uso con servidores de aplicaciones
heredadas y los corredores de servlets independientes.)
Los archivos de configuracin web.xml y beans.xml que son necesarios para
mantener el servidor de aplicaciones feliz.
NOTA: Antes de JSF 2.0, haba que declarar beans en un archivo WEB-INF /
facesconfig.xml.
Esto ya no es necesario, y esta aplicacin no necesita un archivo faces-config.xml.

Aplicaciones JSF ms avanzados tienen la misma estructura, pero pueden contener clases
Java adicionales, tales como controladores de eventos, validadores, y componentes
personalizados. Parmetros de configuracin adicionales se pueden colocar en un archivo
WEB-INF / facesconfig. xml que describiremos en el captulo siguiente. Para una
aplicacin simple, no se requiere este archivo.
package corejsf;
import java.io.Serializable;
import javax.faces.bean.ManagedBean; // o import javax.inject.Named;
import javax.faces.bean.SessionScoped; // o import javax.enterprise.context.SessionScoped;
@ManagedBean(name = "user") // o @Named("user")
@SessionScoped
public class UserBean implements Serializable {
private static final long serialVersionUID = 1L;
private String name;
private String password;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getPassword() {
return password;
}

public void setPassword(String password) {


this.password = password;
}
}

Estructura de directorios
Una aplicacin JSF se despliega como un archivo WAR: un archivo comprimido con
extensin .war y una estructura de directorios que sigue un modelo normalizado:

NOTA: Si utiliza Tomcat u otro corredor servlet, el directorio lib contiene los archivos JAR
de la aplicacin JSF. Esto no es necesario con GlassFish y otros servidores de aplicaciones
Java EE, puesto que ya se han construido en JSF.
La construccin de una aplicacin JSF
Ahora que andamos por los pasos necesarios para crear aplicaciones JSF con las manos
desnudas. Por supuesto, es probable que desee utilizar un IDE o un script de
construccin. Sin embargo, es una buena idea para saber lo que hace su IDE bajo el cap
para que pueda solucionar los problemas con eficacia.
Un anlisis de la aplicacin de ejemplo
Ya ha visto una aplicacin JSF simple, y usted ahora saber cmo construir y ejecutarlo.
Ahora vamos a echar un vistazo ms de cerca a la estructura de la aplicacin. Las
aplicaciones web tienen dos partes: la capa de presentacin y la lgica de negocio. La
capa de presentacin tiene que ver con el aspecto de la aplicacin. En el contexto de una
aplicacin basada en navegador, la mirada est determinado por las etiquetas HTML que
especifican diseo, las fuentes, las imgenes, y as sucesivamente. La lgica de negocio
se implementa en el cdigo Java que determina el comportamiento de la aplicacin.
Algunas tecnologas web entremezclan HTML y el cdigo. Este enfoque es seductora ya
que es fcil de producir aplicaciones sencillas en un nico archivo. Pero para aplicaciones
serias, mezcla de marcas y cdigo plantea problemas considerables.
Diseadores web profesionales saben de diseo grfico, pero por lo general se basan en
herramientas que traducen su visin en HTML. Ellos ciertamente no quieren tratar con
cdigo embebido. Por otro lado, los programadores son notoriamente sin reservas cuando
se trata de diseo grfico. (Los programas de ejemplo en este libro tienen amplia
evidencia.)
Por lo tanto, para disear aplicaciones web profesionales, es importante para separar la
presentacin de la lgica de negocio. Esto permite a los diseadores web y
programadores centrarse en sus competencias bsicas.

En el contexto de JSF, el cdigo de la aplicacin se encuentra en los beans, y el diseo


est contenida en las pginas web. Nos fijamos en los beans primero.
Beans
Un bean es una clase que expone las propiedades y eventos para un framework, como
JSF. Una propiedad es un valor llamado de un determinado tipo que se puede leer y / o
escribir.
La forma ms sencilla de definir una propiedad es utilizar una convencin de
nomenclatura estndar para los mtodos de lector y escritor, es decir, la convencin get /
set familiar. La primera letra del nombre de la propiedad se cambia a maysculas en los
nombres de los mtodos.
Por ejemplo, la clase UserBean tiene dos propiedades, el nombre y la contrasea, tanto
de tipo String:
public
...
public
public
public
public
}

class UserBean implements Serializable {


String getName() { . . . }
void setName(String newValue) {. . . }
String getPassword() { . . . }
void setPassword(String newValue) { . . . }

Los mtodos get / set pueden llevar a cabo acciones arbitrarias. En muchos casos,
simplemente obtener o establecer un campo de instancia. Pero tambin podran realizar
algunos clculos o incluso acceder a una base de datos.
NOTA: De acuerdo con la especificacin de beans, es legal omitir un mtodo captador o
definidor. Por ejemplo, si getPassword se omite, la contrasea es una propiedad de slo
escritura.
Eso podra ser deseable por razones de seguridad. Sin embargo, JSF no admite
propiedades de slo escritura. Siempre utilice leer las propiedades / escritura para los
componentes de entrada, aunque se puede utilizar propiedades de slo lectura para los
componentes de salida
Un bean gestionado es un bean Java que se puede acceder desde una pgina JSF. Un
bean gestionado debe tener un nombre y un mbito. El bean en nuestro ejemplo tiene el
nombre de user y mbito de sesin. Esto significa que el objeto bean est disponible para
un usuario a travs de mltiples pginas. Diferentes usuarios que utilizan la aplicacin
web se dan diferentes instancias del objeto bean. Usted se encontrar con mbitos
adicionales de beans en el Captulo 2.
Los beans son "manejados" en el sentido siguiente: Cuando el nombre de bean se
produce en una pgina JSF, la implementacin JSF localiza el objeto con ese nombre, o lo
construye si no existe an en el mbito de aplicacin adecuado. Por ejemplo, si un
segundo usuario se conecta a nuestra aplicacin de ejemplo, se construye otro objeto
UserBean.
La manera ms fcil de especificar el nombre y el alcance de un bean gestionado es
utilizar atributos:
@Named("user") // or @ManagedBean(name="user")

@SessionScoped
public class UserBean implements Serializable

En aplicaciones JSF, que uso bean managed para todos los datos que necesita para ser
accesible desde una pgina. Los beans son los conductos entre la interfaz de usuario y el
servidor de la aplicacin.

JSF Pages
Usted necesita una pgina JSF para cada pantalla del navegador. Por razones histricas,
hay varios mecanismos diferentes para crear pginas JSF. JSF 1.x se bas en JavaServer
Pages (JSP), lo que caus algunos problemas tcnicos desagradables.
Sin embargo, JSF permite a los programadores para reemplazar el "manejador de vista"
que procesa pginas JSF. El proyecto Facelets hizo exactamente eso, proporcionando
mejores mensajes de error, un mecanismo para factorizar partes pginas comunes y un
mecanismo fcil para escribir sus propios componentes. Facelets se ha convertido en una
parte de JSF 2.0, y la usamos en este libro.
Al crear una pgina Facelets, agregar etiquetas JSF a una pgina XHTML. Una
pgina de XHTML es simplemente una pgina HTML que es tambin XML
adecuado. Usamos la .xhtml extensin para las pginas Facelets.
Echar otro vistazo a la primera pgina de nuestra aplicacin de ejemplo en el Listado 1-1.
En la parte superior de la pgina, se encuentra una declaracin de espacio de nombres:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html">

La segunda lnea declara la h: prefix para las etiquetas JSF HTML.


La implementacin JSF tambin define un conjunto de etiquetas bsicas que son
independientes de HTML.
Si usted necesita una etiqueta de este tipo en su pgina, usted debe agregar una
declaracin de espacio de nombres:
xmlns:f="http://java.sun.com/jsf/core"

Si utiliza bibliotecas de etiquetas de otros proveedores, usted suministra declaraciones de


espacios de nombres adicionales.
NOTA: Usted puede elegir cualquier prefijo de etiqueta que te gusten, como 'html:
inputText' en vez de 'h: inputText'. En este libro, siempre usamos h para las etiquetas
HTML y F para las etiquetas principales.
Una pgina JSF es similar a un formulario HTML. Tenga en cuenta las siguientes
diferencias:
Su pgina debe tener el formato correcto XHTML. A diferencia de un navegador, la
aplicacin JSF no perdona los errores de sintaxis.
Utilice h: head, h: body, y h: form en lugar de la head, el body y form.
En lugar de utilizar las etiquetas HTML de entrada familiares, utilice h: inputText,
h: inputSecret, y h: commandButton.
NOTA: En lugar de utilizar una etiqueta JSF como:

<h:inputText value="#{user.name}"/>

se puede utilizar una etiqueta HTML regular con un atributo JSFC:


<input type="text" jsfc="h:inputText" value="#{user.name}"/>

Esa caracterstica est diseada para facilitar la creacin de pginas en una herramienta
de diseo web. Sin embargo, slo funciona para aquellos componentes JSF que
corresponden directamente a los componentes HTML. En este libro, siempre utilizamos
las etiquetas JSF.
NOTA: Si usted est familiarizado con versiones anteriores de JSF, usted pudo haber visto
pginas JSF definidos con la sintaxis JSP.
<html>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<f:view>
<head>...</head>
<body>...</body>
</f:view>
</html>

Puede seguir utilizando JSP en JSF 2.0, pero no lo recomiendo. Una desventaja es que
usted puede conseguir los mensajes de error muy crpticos si una pgina tiene un error
de sintaxis. Ms importante an, algunos JSF 2.0 caractersticas (tales como plantillas)
slo funcionan con Facelets.
Discutimos todas las etiquetas JSF estndar y sus atributos en los captulos 4 y 5. En los
tres primeros captulos, podemos llegar a funcionar con campos de entrada y botones de
comando.
Los valores de campo de entrada estn unidos a las propiedades del bean con nombre de
usuario:
<h:inputText value="#{user.name}"/>

Los # {...} delimitadores encierran expresiones en el "lenguaje de expresin", JSF que se


discuten en detalle en el captulo 2.
Cuando se muestra la pgina, la aplicacin JSF localiza el bean de usuario y llama al
mtodo getName para obtener el valor actual de la propiedad. Cuando se enva a la
pgina, la aplicacin JSF invoca el mtodo setName para establecer el valor que se ha
introducido en el formulario.
La etiqueta h: commandButton tiene un atributo de accin cuyo valor indica que la
pgina se debe mostrar a continuacin:
<h:commandButton value="Login" action="welcome"/>

Configuracin Servlet
Al implementar una aplicacin JSF dentro de un servidor de aplicaciones, es necesario
proporcionar un archivo de configuracin llamado web.xml. Afortunadamente, usted
puede utilizar el mismo archivo web.xml para la mayora de aplicaciones JSF. Listado 1-4
muestra el archivo.
<?xml version="1.0" encoding="UTF-8"?>

<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
version="2.5">
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>faces/index.xhtml</welcome-file>
</welcome-file-list>
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>
</web-app>

Todas las pginas JSF se pasan al Faces servlet que es una parte del cdigo de la
aplicacin JSF. Para asegurar que el servlet correcto se activa cuando se solicita una
pgina JSF, las direcciones URL JSF tienen un formato especial. En nuestra configuracin,
tienen un prefix / face. El elemento servlet-mapping se asegura de que todas las URL con
ese prefijo son procesados por el servlet Faces
Por ejemplo, no se puede simplemente apuntar su navegador a http://localhost:
8080/login/index.xhtml.
La
URL
tiene
que
ser
http://localhost:8080/login/faces/index.xhtml.
La regla de asignacin activa el servlet Faces, que es el punto de entrada a la aplicacin
JSF. La implementacin JSF elimina el / enfrenta prefijo, carga la pgina index.xhtml,
procesa las etiquetas, y muestra el resultado.
PRECAUCIN: Si ve una pgina JSF sin el /faces prefijo, el navegador mostrar las
etiquetas HTML en la pgina, pero se puede omitir las etiquetas JSF.
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.faces</url-pattern>
</servlet-mapping>

A continuacin, utilice la direccin URL http: // localhost: 8080 / login / index.faces. Eso
URL activa el servlet faces.
NOTA: En sentido estricto, las pginas JSF no son los archivos que XHTML slo pretenden
producir este tipo de archivos. Si desea utilizar una extensin .jsf de archivos de pginas
JSF, a continuacin, agregue la siguiente entrada al archivo web.xml:
<context-param>
<param-name>javax.faces.DEFAULT_SUFFIX</param-name>
<param-value>.jsf</param-value>
</context-param>

Tenga en cuenta que esta configuracin slo afecta a los desarrolladores web, no a los
usuarios de la aplicacin web. Las URLs todava tienen una extensin .faces o /faces
prefix.
El archivo web.xml especfica una pgina de bienvenida, la pgina que se carga cuando
el usuario introduce la direccin URL de la aplicacin web. Por ejemplo, si un usuario
introduce la URL http://localhost:8080/login, el servidor de aplicaciones se carga
automticamente la pgina /faces/index.xhtml.
Por ltimo, se especifica un parmetro que aade soporte para la depuracin de una
aplicacin JSF:
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>

Un primer vistazo de Ajax con JSF 2.0


JavaScript asncrono con XMLHttpRequest (Ajax) es una tecnologa para la actualizacin
de una pgina web en el navegador cliente sin presentar una forma y hacer que la
respuesta. La pgina web contiene cdigo JavaScript que se comunica con el servidor y
hace cambios incrementales en la estructura de la pgina. El resultado es una
experiencia de usuario ms suave y sin el temido "tirn de la pgina".
Vamos a discutir el Ajax en detalle en el captulo 10. Afortunadamente, JSF 2.0 le permite
utilizar Ajax sin tener que entender los considerables complejidades del canal de
comunicacin Ajax. Aqu, le damos un sabor rpido para abrir el apetito.
Vamos a reestructurar nuestra solicitud de inicio de sesin para que el botn Acceder
hace una peticin Ajax en lugar de enviar el formulario. Tan pronto como el usuario ha
iniciado la sesin, aparecer un saludo (ver Figura 1-10).

Cada componente al que se accede por el cdigo cliente necesita un ID, que declaramos
con el atributo id, as:
<h:outputText id="out" value="#{user.greeting}"/>

Tambin damos identificaciones a los campos de entrada de nombre y contrasea.


De forma predeterminada, el ID de forma se antepone a los ID de sus componentes.
Pasamos este proceso fuera con el fin de tener nombres de identificacin ms simples,
estableciendo el atributo prependId del formulario en false (ver Listado 1-5).
Aadimos un solo lectura propiedad saludo a la clase UserBean:
public String getGreeting() {
if (name.length() == 0) return "";
else return "Welcome to JSF2 + Ajax, " + name + "!";
}

Este saludo se mostrar en el campo de texto.


Ahora estamos listos para implementar el comportamiento Ajax para el botn de inicio de
sesin:
<h:commandButton value="Login">
<f:ajax execute="name password" render="out" />
</h:commandButton>

Cuando se hace clic en el botn de inicio de sesin, el formulario no se presenta. En lugar


de ello, una peticin Ajax se enva al servidor.
El ejecutan y hacen atributos especifican listas de identificaciones de los componentes.
Los componentes ejecutar se procesan exactamente como si se hubiera enviado el
formulario. En particular, sus valores se envan al servidor y las correspondientes
propiedades del bean se actualizan. Los componentes render se procesan como si la
pgina se ha mostrado.
En nuestro caso, se llama al mtodo getGreeting del grano de usuario, y su resultado se
enva al cliente y se visualiza.

JSF Services Framework

Ahora que ha visto su primera aplicacin JSF, es ms fcil de explicar los servicios que el
framework JSF ofrece a los desarrolladores. Figura 1-11 da una visin general de alto nivel
de la arquitectura de JSF. Como se puede ver, el framework JSF es responsable de
interactuar con los dispositivos cliente, y proporciona herramientas para atar juntos la
presentacin visual, lgica de la aplicacin, y la lgica de negocio de una aplicacin web.
Sin embargo, el alcance de JSF se limita a la capa de presentacin. Persistencia de base
de datos, servicios web, y otras conexiones backend estn fuera del alcance de JSF.

Estos son los servicios ms importantes que el marco JSF proporciona:


Aplicaciones de arquitectura de todo el modelo-vista-controlador de software
permiten a los usuarios manipular ciertos datos, como los carritos de la compra,
itinerarios de viaje, o cualquier informacin que se requiere en un dominio
determinado problema. Estos datos se llama el modelo. Al igual que los artistas
crean pinturas de un modelo en un estudio, una aplicacin web muestra vistas del
modelo de datos. En una aplicacin web, HTML (o una tecnologa de procesamiento
similar) se utiliza para pintar estos puntos de vista.
JSF conecta la vista y el modelo. Como se ha visto, un componente de vista se
puede conectar a una propiedad de bean de un objeto modelo, tales como:
<h:inputText value="#{user.name}"/>

La aplicacin JSF funciona como el controlador que reacciona al usuario mediante


el procesamiento de eventos de accin y de cambio de valor, ellos enrutamiento a
cdigo que actualiza el modelo o la vista. Por ejemplo, es posible que desee
invocar un mtodo para comprobar si se permite a un usuario para iniciar sesin.
Utilice la siguiente etiqueta JSF:
<h:commandButton value="Login" action="#{user.check}"/>

Cuando el usuario hace clic en el botn y el formulario se enva al servidor, la


aplicacin JSF invoca el mtodo de verificacin del bean de usuario. Este mtodo
puede tomar acciones arbitrarias para actualizar el modelo, y se devuelve el ID de
la pgina siguiente para mostrarse. Discutimos este mecanismo en el Captulo 3.
Por lo tanto, JSF implementa una arquitectura modelo-vista-controlador.

Los datos de conversin: los usuarios introducen los datos en los formularios web
como texto. Los objetos de negocio quieren datos como nmeros, fechas u otros
tipos de datos. Como se explica en el captulo 7, JSF hace que sea fcil de
especificar y personalizar las reglas de conversin.

Validacin y control de errores - JSF hace que sea fcil de colocar las reglas de
validacin de campos, como "se requiere este campo" o "este campo debe ser un
nmero". Por supuesto, cuando los usuarios introducen datos no vlidos, es
necesario mostrar mensajes de error correspondientes. JSF quita gran parte del
tedio de esta tarea de programacin. Cubrimos validacin en el Captulo 7.

Internacionalizacin - JSF gestiona temas de internacionalizacin, como la


codificacin de caracteres y la seleccin de paquetes de recursos. Cubrimos
paquetes de recursos en el captulo 2.

Desarrolladores de componentes personalizados en componentes pueden


desarrollar componentes sofisticados que los diseadores de pginas simplemente
caen en sus pginas. Por ejemplo, supongamos que un desarrollador de
componentes produce un componente de calendario con todas las campanas y
silbatos habituales. Usted slo tiene que utilizar en su pgina, con un comando,
como por ejemplo:
<acme:calendar value="#{flight.departure}" startOfWeek="Mon"/>

Ajax soporte - JSF proporciona un canal de comunicacin estndar Ajax que invoca
de manera transparente las acciones del lado del servidor y actualizaciones de
componentes del lado del cliente. Consulte el Captulo 10 para obtener ms
informacin.

Por defecto, JSF genera marcado para las pginas HTML. Pero es posible extender
el framework JSF para producir etiquetas para otra pgina de descripcin lenguaje
como WML o XUL. Cuando JSF se desarroll primero, esta flexibilidad pareca
bastante intrigante. Sin embargo, nunca hemos visto un uso convincente de esta
generalidad y no se cubre en este libro.

Detrs de escenas

Ahora que usted ha ledo sobre el "qu" y el "por qu" de JSF, puede ser curioso acerca
de cmo la implementacin JSF hace su trabajo. Echemos un vistazo detrs de las
escenas de nuestra aplicacin de ejemplo. Comenzamos en el punto cuando el navegador
se conecta primero a la direccin http://localhost:8080/myProgram/faces/index.xhtml.
La implementacin JSF inicializa el cdigo JSF y lee la pgina index.xhtml. Esa pgina
contiene etiquetas, como h: form y h: inputText. Cada etiqueta tiene una clase de
controlador de etiqueta asociada. Cuando se lee la pgina, se ejecutan los controladores
de etiquetas. Los controladores de etiquetas JSF colaboran entre s para construir un rbol
de componentes (ver Figura 1-12).

Rendering Pginas
A continuacin, la pgina HTML es interpretado. Todo el texto que no es una etiqueta JSF se pasa a travs. El
h: form, h: inputText, h: inputSecret, y h: CommandButton etiquetas se convierten a HTML. Como acabamos
de discutir, cada una de estas etiquetas da lugar a un componente asociado.
Cada componente tiene un procesador que produce salida HTML, lo que refleja el estado de los componentes.
Por ejemplo, el procesador del componente que corresponde a la h: inputText Etiqueta produce el siguiente
resultado:

<input type="text" name="unique ID" value="current value"/>

Este proceso se denomina codificacin. El procesador del objeto UIInput pide la


implementacin JSF para buscar el identificador nico y el valor actual de la user.name
expresin. Por defecto, las cadenas de identificacin son asignadas por la aplicacin JSF.
Los IDs se parecen bastante al azar, como _id_id12: _id_id21. La pgina codificada es
enviada al navegador, y el navegador lo muestra en la forma habitual (vase la Figura 113).

SUGERENCIA: Seleccione "Ver -> fuente de pgina" en el men del navegador para ver
la salida HTML del proceso de renderizado. La figura 1-14 muestra una salida tpica. Esto
es til para depurar problemas JSF.

Las solicitudes de decodificacin


Despus se muestra la pgina en el navegador, el usuario rellena los campos del
formulario y haga clic en el botn de inicio de sesin. El navegador enva los datos del
formulario al servidor web, con el formato de una peticin POST. Este es un formato
especial, definido como parte del protocolo HTTP. La solicitud POST contiene el URL de la
forma (/ login / faces / index.xhtml), as como los datos del formulario.

NOTA: La URL para la solicitud POST es el mismo que el de la solicitud que hace que la
forma. Navegacin a una nueva pgina se produce despus de que el formulario ha sido
enviado. (Por esta razn, la URL que aparece en el navegador suele ser un paso por
detrs de la URL de la pgina JSF que se est mostrando.)
El formulario de datos es una cadena de pares ID / valor, tales como:
id1=me&id2=secret&id3=Login

Como parte del procesamiento de la solicitud normal, los datos del formulario se coloca
en una tabla hash que todos los componentes pueden acceder.
A continuacin, la aplicacin JSF le da a cada componente de la oportunidad de
inspeccionar que la tabla hash, un proceso llamado de decodificacin. Cada componente
decide sobre su propia forma de interpretar los datos del formulario.
El formulario de acceso tiene tres objetos componentes: dos objetos UIInput que
corresponden a los campos de texto en el formulario y un objeto UICommand que
corresponde al botn de enviar.
Los componentes UIInput actualizar las propiedades de bean que se hace
referencia en los atributos de valor: se invocan los mtodos setter con los valores
que el usuario suministra.
Los controles de componentes UICommand si se hace clic en el botn. Si es as, se
dispara un evento de accin para poner en marcha la accin de acceso hace
referencia en el atributo action. Ese evento le dice al manejador de navegacin
para buscar la pgina sucesor, welcome.xhtml.
Ahora, el ciclo se repite.
Acabas de ver las dos etapas de procesamiento ms importantes de la JECUCIN JSF:
la codificacin y decodificacin. Sin embargo, la secuencia de procesamiento (tambin
llamado el ciclo de vida) es un poco ms complicada. Si todo va bien, usted no tiene que
preocuparse acerca de las complejidades del ciclo de vida. Sin embargo, cuando se
produce un error, definitivamente va a querer entender lo que hace a la aplicacin JSF. En
la siguiente seccin, nos fijamos en el ciclo de vida con mayor detalle.
El Ciclo de Vida
La especificacin JSF define seis fases distintas:
1. Restaurar Ver
2. Aplicar Solicitar Valores
3. Validaciones de procesos
4. Actualizar valores de Modelo
5. Invoque Aplicacin
6. Render Respuesta
Aqu hablamos de la corriente ms comn a travs del ciclo de vida (ver Figura 1-15).
Ver una serie de variaciones a lo largo del libro. La restauracin Vista fase recupera el
rbol de componentes para la pgina solicitada si se ha presentado previamente o
construye un nuevo rbol de componentes si se muestra por primera vez.
Si no hay valores de peticin, la implementacin JSF salta adelante a la fase de
respuesta Render. Esto sucede cuando se visualiza una pgina por primera vez.

De lo contrario, la siguiente fase es la fase Aplicar Solicitar Valores. En esta fase, las
iteraciones de aplicacin JSF ms de los objetos componentes en el rbol de
componentes. Cada cheques de objetos componentes que requieren valores pertenecen
a la misma y las almacena.

Los valores almacenados en el componente se llaman "valores locales". Cuando se disea


una pgina JSF, puede adjuntar validadores que realizan comprobaciones de exactitud en
los valores locales. Estos validadores se ejecutan en la fase Validaciones de procesos. Si
la validacin pasa, el ciclo de vida de JSF contina normalmente. Sin embargo, cuando se
producen errores de conversin o validacin, la aplicacin JSF invoca el Render fase de
respuesta directa, volver a mostrar la |pgina actual, de modo que el usuario tiene otra
oportunidad para proporcionar entradas correctas.
NOTA: Para muchos programadores, este es el aspecto ms sorprendente del ciclo de vida de JSF.
Si un convertidor o validador falla, la pgina actual se vuelve a mostrar. Usted debe agregar
etiquetas para mostrar los errores de validacin para que sus usuarios saben por qu ver la pgina
antigua de nuevo. Consulte el Captulo 7 para ms detalles.

Despus de los convertidores y validadores han hecho su trabajo, se supone que es


seguro para actualizar los datos del modelo. Durante la fase de actualizacin de Valores
Modelo, los valores locales se utilizan para actualizar los beans que estn conectados a
los componentes.
En la fase de invocacin de aplicaciones, se ejecuta el mtodo de accin del botn o
enlace componente que provoc el envo del formulario. Ese mtodo se puede llevar a
cabo el procesamiento de la aplicacin arbitraria. Se devuelve una cadena resultado que
se pasa al controlador de navegacin. El manejador de navegacin busca la pgina
siguiente.
Por ltimo, la fase de respuesta Render codifica la respuesta y la enva al navegador.
Cuando un usuario enva un formulario, hace clic en un vnculo, o de lo contrario genera
una nueva solicitud, el ciclo comienza de nuevo.

MANAGED BEANS
Chapter 2

Los temas de este captulo


"Definicin de un Bean" en la pgina 33
"Los Beans CDI" en la pgina 39
"Mensaje paquetes" en la pgina 40
"Una aplicacin de ejemplo" en la pgina 45
"Beans Scopes" en la pgina 51
"Configuracin de Beans" en la pgina 56
"La sintaxis del lenguaje de expresin" en la pgina 63
Un tema central del diseo de aplicaciones web es la separacin de la presentacin y la
lgica de negocio. JSF utiliza Beans para lograr esta separacin. Pginas JSF se refieren a
las propiedades del bean, y la lgica del programa figura en el cdigo de implementacin
del bean. Debido a que los beans son tan fundamentales para la programacin JSF, los
discutimos en detalle en este captulo.
La primera mitad del captulo se describen las caractersticas esenciales de los Beans que
cada desarrollador JSF necesita conocer. A continuacin, presentamos un programa de
ejemplo que pone a estos elementos esenciales para trabajar. Las secciones restantes
cubren los aspectos ms tcnicos sobre la configuracin de Beans y expresiones de valor.
Usted puede saltarse estas secciones la primera vez que lea este libro y volver a ellos
cuando surja la necesidad.
Definicin de un Bean
De acuerdo con la especificacin JavaBeans (disponible en http://java.sun.com/ productos
/ JavaBeans /), un bean Java es "un componente de software reutilizable que puede ser
manipulado en una herramienta de creacin". Esa es una definicin bastante amplia y, de
hecho, como se ver en este captulo, los Beans se utilizan para una variedad de
propsitos.
A primera vista, un bean parece ser similar a un objeto. Sin embargo, los beans tienen un
propsito diferente. Los objetos son creados y manipulados dentro de un programa Java
cuando el programa llama constructores e invoca mtodos. Sin embargo, los beans
pueden ser creados y manipulados sin programacin.
La aplicacin "clsica" para JavaBeans es un constructor de interfaz de usuario. Una
ventana de la paleta en la herramienta de creacin contiene beans de componentes tales
como campos de texto, deslizadores, casillas de verificacin, y as sucesivamente. En
lugar de escribir cdigo Java, se utiliza un diseador de interfaz de usuario para arrastrar
y soltar los beans de componentes de la paleta en un formulario. A continuacin, puede
personalizar los beans mediante la seleccin de valores de las propiedades de un dilogo
de hoja de propiedades (ver Figura 2-1).

En el contexto de JSF, beans de almacenar el estado de las pginas web. La


implementacin JSF hace lo siguiente:
Crea y descarta las benas segn sea necesario (de ah el trmino "managed
beans")
Lee propiedades del bean al mostrar una pgina Web
Establece las propiedades del bean cuando se publique un form
Considere la posibilidad de la aplicacin de inicio de sesin en el Captulo 1, se muestra
en "Un ejemplo sencillo" en la pgina 4. Un campo de entrada lee y actualiza la
propiedad de contrasea del bean de usuario:
<h:inputSecret value="#{user.password}"/>

La implementacin JSF necesita localizar una clase de frijol para el usuario bean llamado.
En nuestro ejemplo, una clase UserBean se declara como sigue:
@ManagedBean(name="user")
@SessionScoped
public class UserBean implements Serializable {
...
}

Puede omitir el atributo de nombre en la anotacinManagedBean. En ese caso, el nombre


del bean se deriva del nombre de la clase girando la primera letra en minscula. Por
ejemplo, si se omite (name = "user") en el ejemplo anterior, el nombre del bean se
convierte userBean.
PRECAUCIN: La anotacin ManagedBean est en el paquete javax.faces.bean.
Java EE 6 define otra anotacin ManagedBean en el paquete javax.annotation
que no funciona con JSF

Cuando primero se encuentra una expresin con nombre de user, la aplicacin JSF
construye un objeto de la clase UserBean. El objeto se mantiene vivo durante la duracin
de la sesin, es decir, para todas las solicitudes que se originan desde el mismo cliente,
que dura hasta que la sesin se termina, ya sea explcita o tiempo de espera. A lo largo
de la sesin, el usuario nombre del bean hace referencia al objeto previamente
construido.
En cualquier momento dado en el tiempo, diferentes sesiones que pertenecen a
diferentes clientes pueden estar activas en el servidor. Cada uno de ellos tiene su propio
objeto UserBean.

Convertidores en JSF
Los convertidores cubren la necesidad de asignar valores entre la vista y el modelo de
manera automtica, manejando tipos distintos al de default, en este caso el manejo de
cadenas, los convertidores cubren la necesidad de desplegar la informacin del modelo,
por ejemplo podemos convertir una cadena que representa a su vez una fecha y esa
fecha podemos convertirla a un tipo date y asignarla a nuestro modelo.

JavaServer Faces - IDS


Web Framework
JSP y Servlet puede es una excelente opcin cuando las aplicaciones web solo necesiten
la generacin de contenido HTML dinmico.
Pero si la aplicacin requiere de una conversin de tipos de datos, validaciones
declarativas, y manejo de eventos en el navegador, nuestra aplicacin necesitara
implementar estos componentes.
Lo que se puede hacer con JavaServer Faces:
Conversin de Tipos
Validacin de Datos
Duplicidad de Cdigo
Bajo Nivel de Abstraccin

Framework
Un Web Framework es un software que proporciona funcionalidad genrica
(componentes) para desarrollar aplicaciones web.
Un Web Framework acelera los desarrollo pues cuenta con una base de
componentes listos para ser utilizados e integracin en una aplicacin.

Java Server Faces es una especificacin de java EE, creado para el desarrollo de
aplicaciones web avanzadas orientadas a presentacin de contenido visual.
JSF es un componente que se ejecuta del lado del servidor pero puede mantener
comunicacin con el cliente.
JSF est basado principalmente en componentes.

El nivel de abstraccin de JSF es muy alto:


- Nos permite realizar una separacin de Capas

Integra I18N
Permite crear reglas de navegacin
Cuenta con un gran nmero de convertidores
permite validaciones declarativas
Tiene un Manejo de eventos del lado del cliente

Mini Gua
JavaServer Faces

1. Introduccin
1.1 Preliminares
El objetivo de la tecnologa JavaServer Faces es desarrollar aplicaciones web de forma
parecida a como se construyen aplicaciones locales con Java Swing, AWT (Abstract
Window Toolkit), SWT (Standard Widget Toolkit) o cualquier otra API similar.
Tradicionalmente, las aplicaciones web se han codificado mediante pginas JSP (Java
Server Pages) que reciban peticiones a travs de formularios y construan como
respuesta pginas HTML (Hiper Text Markup Language) mediante ejecucin directa o
indirecta -a travs de bibliotecas de etiquetas- de cdigo Java, lo que permita, por
ejemplo, acceder a bases de datos para obtener los resultados a mostrar amn de
realizar operaciones marginales como insertar o modificar registros en tablas
relacionales, actualizar un carrito de la compra, etc.
JavaServer Faces pretende facilitar la construccin de estas aplicaciones proporcionando
un entorno de trabajo (framework) va web que gestiona las acciones producidas por el
usuario en su pgina HTML y las traduce a eventos que son enviados al servidor con el
objetivo de regenerar la pgina original y reflejar los cambios pertinentes provocados por
dichas acciones. En definitivas cuentas, se trata de hacer aplicaciones Java en las que el
cliente no es una ventana de la clase JFrame o similar, sino una pgina HTML.
Como el lector puede imaginar, cualquier evento realizado sobre una pgina JSF incurre
en una carga sobre la red, ya que el evento debe enviarse a travs de sta al servidor, y
la respuesta de ste debe devolverse al cliente; por ello, el diseo de aplicaciones
JavaServer Faces debe hacerse con cuidado cuando se pretenda poner las aplicaciones a
disposicin del mundo entero a travs de internet. Aquellas aplicaciones que vayan a ser
utilizadas en una intranet podrn aprovecharse de un mayor ancho de banda y
producirn una respuesta mucho ms rpida.
1.2 Caractersticas principales
La tecnologa JavaServer Faces constituye un marco de trabajo (framework) de interfaces
de usuario del lado de servidor para aplicaciones web basadas en tecnologa Java y en el
patrn MVC (Modelo Vista Controlador).
Los principales componentes de la tecnologa JavaServer Faces son:
Una API y una implementacin de referencia para:
o Representar componentes de interfaz de usuario (UI-User Interface) y
manejar su estado
o Manejar eventos, validar en el lado del servidor y convertir datos
o Definir la navegacin entre pginas
o Soportar internacionalizacin y accesibilidad, y
o Proporcionar extensibilidad para todas estas caractersticas.
o Una librera de etiquetas JavaServer Pages (JSP) personalizadas para dibujar
componentes UI dentro de una pgina JSP.
Este modelo de programacin bien definido y la librera de etiquetas para componentes
UI facilita de forma significativa la tarea de la construccin y mantenimiento de
aplicaciones web con UIs en el lado servidor. Con un mnimo esfuerzo, es posible:
Conectar eventos generados en el cliente a cdigo de la aplicacin en el lado
servidor.

Mapear componentes UI a una pgina de datos en el lado servidor.


Construir una interfaz de usuario con componentes reutilizables y extensibles.

Como se puede apreciar en la figura 1.1, la interfaz de usuario que se crea con la
tecnologa JavaServer Faces (representada por miUI en el grfico) se ejecuta en el
servidor y se renderiza en el cliente.

Figura 1.1 Diagrama de una aplicacin JSF


En la figura queda qu es fsicamente miUI. La pgina JSP, miform.jsp, especifica los
componentes de la interfaz de usuario mediante etiquetas personalizadas definidas por la
tecnologa JavaServer Faces. LA UI de la aplicacin web (representada por miUI en la
figura) maneja los objetos referenciados por la JSP, que pueden ser de los siguientes
tipos:
Objetos componentes que mapean las etiquetas sobre la pgina JSP.
Oyentes de eventos, validadores y conversores registrados y asociados a los
componentes.
Objetos del modelo que encapsulan los datos y las funcionalidades de los
componentes especficos de la aplicacin (lgica de negocio).
1.3 Comparativa con Tecnologas similares
Al igual que Struts, JSF pretende normalizar y estandarizar el desarrollo de aplicaciones
web. Hay que tener en cuenta que JSF es posterior a Struts y, por lo tanto, se ha nutrido
de la experiencia de ste, erradicando algunas sus deficiencias. De hecho el creador de
Struts (Craig R. McClanahan) tambin es el lder de la especificacin de JSF.
Como se ha indicado, JSF es muy similar a Struts, ya que la interfaz de usuario se
implementa con pginas JSP, con la ventaja de que puede trabajar con diversas
herramientas de desarrollo que pueden facilitar la elaboracin de la interfaz de forma
visual, pero esto es opcional, pudindose hacer mediante editores de texto, editando
cada uno de los ficheros que componen la aplicacin, tal y como se ha trabajado en este
tutorial. Sin embargo se abordar el uso de estas herramientas, en concreto, Java Studio
Creator, en el ltimo captulo.
No obstante, JSF no puede competir en madurez con Struts (en este punto Struts es claro
ganador), pero s puede ser una opcin muy recomendable para nuevos desarrollos,
sobre todo si todava no tenemos experiencia con Struts.

1.4 Beneficios de la Tecnologa JavaServer Faces

A continuacin se explican algunos de los puntos por los que JSF es una tecnologa muy
interesante (incluso ms que Struts). Hay una serie de especificaciones que definen JSF, y
que pueden encontrarse en los siguientes enlaces:
JSR 127 ( http://www.jcp.org/en/jsr/detail?id=127
JSR 252 ( http://www.jcp.org/en/jsr/detail?id=252
JSR 276 ( http://www.jcp.org/en/jsr/detail?id=276
Una de las ventajas de que JSF sea una especificacin estndar es que pueden
encontrarse implementaciones de distintos fabricantes. Esto permite no vincularse
exclusivamente con un proveedor concreto, y poder seleccionar el que ms interese en
cada caso segn el nmero de componentes que suministra, el rendimiento de stos,
soporte proporcionado, precio, poltica de evolucin, etc.
JSF trata la vista (la interfaz de usuario) de una forma algo diferente a lo que estamos
acostumbrados en aplicaciones web, ya que este tratamiento es mucho ms cercano al
estilo de Java Swing, Visual Basic o Delphi, donde la programacin de la interfaz se hacer
a travs de componentes y est basada en eventos (pulsacin de un botn, cambio en el
valor de un campo, etc.).
JSF es muy flexible. Por ejemplo nos permite crear nuestros propios componentes, y/o
crear nuestros propios renderizadores para pintar los componentes en la forma que ms
nos convenga.
Una de las grandes ventajas de la tecnologa JavaServer Faces es que ofrece una clara
separacin entre el comportamiento y la presentacin. Las aplicaciones web construidas
con tecnologa JSP conseguan parcialmente esta separacin. Sin embargo, una aplicacin
JSP no puede mapear peticiones HTTP al manejo de eventos especficos de los
componentes o manejar elementos UI como objetos con estado en el servidor. La
tecnologa JavaServer Faces permite construir aplicaciones web que introducen realmente
una separacin entre el comportamiento y la presentacin, separacin slo ofrecida
tradicionalmente por arquitecturas UI del lado del cliente.
Separar la lgica de negocio de la presentacin tambin permite que cada miembro del
equipo de desarrollo de la aplicacin web se centre en su parte asignada del proceso
diseo, y proporciona un modelo sencillo de programacin para enlazar todas las piezas.
Por ejemplo, personas sin experiencia en programacin pueden construir pginas JSF
usando las etiquetas de componentes UI que esta tecnologa ofrece, y luego enlazarlas
con cdigo de la aplicacin sin escribir ningn script ni nada.
Otro objetivo importante de la tecnologa JavaServer Faces es mejorar los conceptos
familiares de componente-UI y capa-web sin limitarnos a una tecnologa de script
particular o un lenguaje de marcas. Aunque la tecnologa JavaServer Faces incluye una
librera de etiquetas JSP personalizadas para representar componentes en una pgina JSP,
las APIs de JavaServer Faces se han creado directamente sobre el API JavaServlet. Esto
nos permite, tericamente, hacer algunas cosas avanzadas: usar otra tecnologa de
presentacin junto a JSP, crear nuestros propios componentes personalizados
directamente desde las clases de componentes, y generar salida para diferentes
dispositivos cliente, entre otras.
En definitivas cuentas, la tecnologa JavaServer Faces proporciona una rica arquitectura
para manejar el estado de los componentes, procesar los datos, validar la entrada del
usuario, y manejar eventos.
1.5 Qu es una aplicacin JavaServer Faces?

En su mayora, las aplicaciones JavaServer Faces son como cualquier otra aplicacin web
Java. Se ejecutan en un contenedor de servlets de Java y, tpicamente, contienen:
Componentes JavaBeans (llamados objetos del modelo en tecnologa JavaServer
Faces) conteniendo datos y funcionalidades especficas de la aplicacin.
Oyentes de Eventos.
Pginas, (principalmente pginas JSP).
Clases de utilidad del lado del servidor, como beans para acceder a las bases de
datos. Adems de estos tems, una aplicacin JavaServer Faces tambin tiene:
o
o
o

Una librera de etiquetas personalizadas para dibujar componentes UI en una


pgina.
Una librera de etiquetas personalizadas para representar manejadores de eventos,
validadores y otras acciones.
Componentes UI representados como objetos con estado en el servidor.

Toda aplicacin JavaServer Faces debe incluir una librera de etiquetas personalizadas que
define las etiquetas que representan componentes UI, as como una librera de etiquetas
para controlar otras acciones importantes, como validadores y manejadores de eventos.
La implementacin de JavaServer Faces, de Sun proporciona estas dos libreras. La
librera de etiquetas de componentes elimina la necesidad de codificar componentes UI
en HTML u otro lenguaje de marcas, lo que se traduce en el empleo de componentes
completamente reutilizables. Y la librera principal (core) hace fcil registrar eventos,
validadores y otras acciones de los componentes.
Como librera de etiquetas de componentes puede usarse la librera html_basic incluida
con la implementacin de referencia de la tecnologa JavaServer Faces, aunque tambin
es posible definir una librera de etiquetas personalizadas que dibuje componentes
propios o que proporcione una salida distinta a HTML.
Otra ventaja importante de las aplicaciones JavaServer Faces es que los componentes UI
de la pgina estn representados en el servidor como objetos con estado. Esto permite a
la aplicacin manipular el estado del componente y conectar los eventos generados por
el cliente a cdigo en el lado del servidor.
Finalmente, la tecnologa JavaServer Faces permite convertir y validar datos sobre
componentes individuales e informar de cualquier error antes de que se actualicen los
datos en el lado del servidor.
Debido a la divisin de labores que permite el diseo de la tecnologa JavaServer Faces, el
desarrollo y mantenimiento de una aplicacin JavaServer Faces se puede realizar muy
rpida y fcilmente. Abajo tenemos un listado de los roles principales de un equipo de
desarrollo tpico.
Aunque en muchos equipos, los desarrolladores individuales pueden interpretar ms de
uno de esos roles, resulta muy til considerar la tecnologa JavaServer Faces desde varias
perspectivas basadas en la responsabilidad principal que tiene cada participante:
Autores de pginas, que utilizan un lenguaje de marcas, como HTML, para construir
pginas para aplicaciones web. Cuando se utiliza la tecnologa JavaServer Faces,
los autores de pginas casi siempre usarn exclusivamente la librera de etiquetas.
Desarrolladores de aplicaciones, que programan los objetos del modelo, los
manejadores de eventos, los validadores, y la navegacin de pginas. Los
desarrolladores de aplicaciones tambin pueden proporcionar las clases de utilidad
necesarias.
Escritores de componentes, que tienen experiencia en programar interfaces de
usuario y prefieren crear componentes personalizados utilizando un lenguaje de

programacin. Esta gente puede crear sus propios componentes desde cero, o
puede extender los componentes estndares proporcionados por JavaServer Faces.
Vendedores de herramientas, que proporcionan herramientas que mejoran la
tecnologa JavaServer Faces para hacer incluso ms sencilla la construccin de
interfaces de usuario en el lado servidor.

Para las aplicaciones web pueden ser muy convenientes frameworks como JSF, Struts,
Spring,etc., pero stos no servirn (a no ser a costa de un gran esfuerzo) para hacer
portales. Para este segundo caso sera ms adecuado usar gestores de contenidos como
Lenya, OpenCMS, etc.

1.6 Una sencilla aplicacin JavaServer Faces


Esta seccin describe el proceso de desarrollo de una sencilla aplicacin JavaServer
Faces. Con ella se ver qu caractersticas contiene una aplicacin tpica JavaServer
Faces.
Nuestra primera aplicacin empieza con una pantalla de entrada con un Login y un
password. Como vemos en la figura 1.2:

Figura 1.2 Salida del fichero ejemploBasico/index.jsp


Fichero: ejemploBasico/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>Una simple aplicacion JavaServer Faces</title>
</head>
<body>
<h:form>
<h3>Por favor, introduzca su nombre y password.</h3>
<table>
<tr>
<td>Nombre:</td>
<td>
<h:inputText value="#{usuario.nombre}"/>
</td>
</tr>
<tr>
<td>Password:</td>
<td>
<h:inputSecret value="#{usuario.password}"/>
</td>
</tr>
</table>
<p>
<h:commandButton value="Aceptar" action="login"/>
</p>
</h:form>
</body>
</f:view>

</html>

Discutiremos en detalle el contenido de este archivo ms tarde. Por ahora, baste con
comentar los siguientes puntos:

Algunas de las etiquetas son etiquetas estndar de HTML: body, table, etc.
Algunas etiquetas tienen prefijos, como f:view y h:inputText; stas son etiquetas
JSF.
Las etiquetas h:inputText, h:inputSecret y h:commandButton corresponden al
TextField, PasswordField y al botn Submit de HTML.
Los campos de entrada son conectados al atributo del objeto. Por ejemplo, el
atributo #"{usuario.nombre}" nos dice segn la implementacin JSF que se
conecta el TextField con el atributo nombre del objeto usuario. Discutimos esta
vinculacin en ms detalle ms tarde en este captulo.

Cuando el usuario introduce el nombre y la contrasea, aparece una pgina de


bienvenida. El mensaje de bienvenida contiene el nombre de usuario, mientras que por
ahora ignoraremos la contrasea.
Como el lector puede comprobar, el propsito de esta aplicacin no es impresionar a
nadie, sino simplemente mostrar las piezas que son necesarias para construir una
aplicacin JSF. Esta sencilla aplicacin contiene las siguientes partes:
Dos pginas, una que contiene casillas de texto para el login de usuario y su
contrasea (index.jsp) y otra con la bienvenida (hola.jsp).
Un bean que maneja los datos de usuario, (en este caso nombre y contrasea).
o Un bean es simplemente una clase Java en la que sus campos son
accedidos siguiendo mtodos getter y setter convencionales. El cdigo
est en el archivo UsuarioBean.java.
Un archivo de configuracin para la aplicacin que contiene recursos del bean y
las reglas de navegacin. Por defecto, este archivo se denomina face-config.xml.
Los archivos que son necesarios para el servlet: el archivo web.xml y el archivo
index.html que redireccionan el usuario a la direccin correcta para la pgina de
entrada en el sistema.
Fichero: ejemploBasico/WEB-INF/classes /UserBean.java
public class UsuarioBean {
private String nombre;
private String password;
// ATRIBUTO: nombre
public String getNombre() {
return nombre;
}
public void setNombre(String nuevoValor) {
nombre = nuevoValor;
}
// ATRIBUTO: password
public String getPassword() {
return password;
}
public void setPassword(String nuevoValor) {
password = nuevoValor;
}
}

1.7 Estructura de directorios para una aplicacin JSF


Una aplicacin JSF se corresponde con una estructura de directorios que sigue un modelo
estndar, la cual se puede comprimir en un archivo con extensin WAR, para mayor
comodidad y portabilidad. Esta estructura de directorios estndar es:
Aplicacin/
Ficheros HTML y JSP WEB-INF/
archivos de configuracin classes/
archivos .class lib/
libreras

Con lo que la estructura del archivo WAR, queda tal que as:
ejemploBasico.war index.html index.jsp hola.jsp META-INF/
MANIFEST.MF
WEB-INF/ faces-config.xml web.xml classes/
UsuarioBean.class
lib/
common-beanutils.jar common-collections.jar common-digester.jar common-logging.jar
jsf-api.jar jsf-impl.jar
jstl.jar
standard.jar

Donde el directorio META-INF se genera automticamente al crear el archivo .war.


2 MODELO VISTA CONTROLADOR EN JSF

2.1 Introduccin
El patrn MVC (Modelo Vista Controlador), ver Figura 2.1, nos permite separar la lgica de
control (qu cosas hay que hacer pero no cmo), la lgica de negocio (cmo se hacen las
cosas) y la lgica de presentacin (cmo interaccionar con el usuario).
Utilizando este tipo de patrn es posible conseguir ms calidad, un mantenimiento ms
fcil, perder el miedo al folio en blanco (existe un patrn de partida por el que empezar
un proyecto), etc. al margen de todo esto, una de las cosas ms importantes que permite
el uso de este patrn consiste en normalizar y estandarizar el desarrollo de Software.

Figura 2.1 Arquitectura MVC


Adems, este modelo de arquitectura presenta otras importantes ventajas:
Hay una clara separacin entre los componentes de un programa; lo cual nos
permite implementarlos por separado.
Hay una API muy bien definida; cualquiera que use la API, podr reemplazar el
modelo, la vista o el controlador, sin demasiada dificultad.
La conexin entre el modelo y sus vistas (ya que puede haber varias) es dinmica:
se produce en tiempo de ejecucin, no en tiempo de compilacin.

2.2 Modelo
Todas las aplicaciones software dejan a los usuarios manipular ciertos datos que
proceden de una realidad sobre la que se pretende actuar, como supermercados,
itinerarios de viaje, o cualquier dato requerido en un dominio problemtico particular. A
estos datos en estado puro, que representan el estado de la realidad se les llama modelo:
modelan la parte de la realidad sobre la que se desea actuar.
El modelo, pues, es el objeto que representa y trabaja directamente con los datos del
programa: gestiona los datos y controla todas sus transformaciones. El modelo no tiene
conocimiento especfico de los diferentes controladores y/o vistas, ni siquiera contiene
referencias a ellos. Es el propio sistema el que tiene encomendada la responsabilidad de
mantener enlaces entre el modelo y sus vistas, y notificar a las vistas cundo deben
reflejar un cambio en el modelo.
En nuestro ejemplo bsico, lo primero que hay que hacer es definir el modelo, que se ve
reflejado en el fichero UsuarioBean.java, donde se aprecia la clase UsuarioBean, que
contiene los elementos necesarios para manejar los datos de la aplicacin: es necesario
un campo que almacene el nombre del usuario que entr, y otro para su correspondiente
contrasea, junto con sus respectivos mtodos de asignacin y recuperacin:
UserBean.java
Este modelo a utilizar en la aplicacin se le comunica al sistema JSF mediante el fichero
faces-config.xml, donde se detalla la parte de managed-bean, donde se aprecia un
bean denominado usuario, que est recogido en la clase UsuarioBean, y con un mbito
de sesin:
<managed-bean>
<managed-bean-name>usuario</managed-bean-name>
<managed-bean-class>UsuarioBean</managed-bean-class>
<managed-bean-scope>session</managed-bean-scope>
</managed-bean>

2.3 Vista
La vista es el objeto que maneja la presentacin visual de los datos gestionados por el
Modelo. Genera una representacin visual del modelo y muestra los datos al usuario.
Interacciona con el modelo a travs de una referencia al propio modelo.
En el ejemplo bsico, la vista est manipulada a travs de las pginas JSF, es decir,
mediante las pginas index.jsp y hola.jsp. JSF conecta la vista y el modelo. Como ya se
ha visto, un componente de la vista puede ligarse a un atributo de un bean del modelo,
como:
<h:inputText value="#{usuario.nombre}"/>

donde se ve como se declara un campo de texto de entrada (inputText) en la vista, ese


campo de texto recoge su valor de entrada en el atributo nombre de un bean
denominado usuario.
De esta manera se establece el vnculo de enlace en vista y modelo.

2.4

Controlador

El controlador es el objeto que proporciona significado a las rdenes del usuario,


actuando sobre los datos representados por el modelo. Entra en accin cuando se realiza
alguna operacin, ya sea un cambio en la informacin del modelo o una interaccin sobre
la Vista. Se comunica con el modelo y la vista a travs de una referencia al propio
modelo.
Adems, JSF opera como un gestor que reacciona ante los eventos provocados por el
usuario, procesa sus acciones y los valores de estos eventos, y ejecuta cdigo para
actualizar el modelo o la vista.
Retomando el ejemplo bsico, una parte del controlador la recogen las lneas de cdigo
del fichero index.jsp que capturan los datos del nombre de usuario, su contrasea, y el
botn de Aceptar:
<h:inputText value="#{usuario.nombre}"/>
<h:inputSecret value="#{usuario.password}"/>
<h:commandButton value="Aceptar" action="login"/>
Y la parte del fichero hola.jsp que muestra el nombre por pantalla:
<h:outputText value="#{usuario.nombre}"/>

Por otro lado, est el control para las reglas de navegacin, contenido en el fichero
faces-config.xml, donde por ejemplo, se indica que estando index.jsp, si ocurre una
accin denominada login, navegaremos a la pgina hola.jsp, esta accin comentada, es
un string que se declara en la vista como un atributo del botn de aceptar que aparece
en el formulario del ejemplo bsico. El fichero faces-config sera el siguiente:
<navigation-rule>
<from-view-id>/index.jsp</from-view-id>
<navigation-case>
<from-outcome>login</from-outcome>
<to-view-id>/hola.jsp</to-view-id>
</navigation-case>
</navigation-rule>

y la parte de la vista que establece la accin que activa la navegacin es:


<h:commandButton value="Aceptar" action="login"/>

Por ltimo, termina de definirse el controlador de la aplicacin con el servlet faces,


definido en el fichero web.xml:
<web-app>
<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.html</welcome-file>
</welcome-file-list>
</web-app>

Con la directiva <servlet> se establece el nico servlet de nuestra aplicacin es el


propio del framework JSF.

La directiva <servlet-mapping> indica la ruta (url) para acceder a servlet definido


anteriormente. Cualquier pgina JSP que pretendamos visualizar, si contiene la
extensin .faces, se visualizar a traves de JSF.
Por ltimo con <welcome-file-list> se establece como pgina de arranque de la
aplicacin index.html. Posteriormente, esta pgina se redirecciona a index.faces,
esto se hace as para que el framework JSF, a travs de su servlet principal tome el
control. Si no se hiciera de esta manera, el servidor de aplicaciones mostrara una
simple pgina JSP como tal, y la compilacin de dicha pgina, fuera del marco JSF,
provocara errores.
2.5 Ciclo de vida de una pgina JavaServer Faces
El ciclo de vida de una pgina JavaServer Faces page es similar al de una pgina JSP: El
cliente hace una peticin HTTP (Hiper Text Transfer Protocol) de la pgina y el
servidor responde con la pgina traducida a HTML. Sin embargo, debido a las
caractersticas extras que ofrece la tecnologa JavaServer Faces, el ciclo de vida
proporciona algunos servicios adicionales mediante la ejecucin de algunos pasos extras.
Los pasos del ciclo de vida se ejecutan dependiendo de si la peticin se origin o no
desde una aplicacin JavaServer Faces y si la respuesta es o no generada con la fase de
renderizado del ciclo de vida de JavaServer Faces. Esta seccin explica los diferentes
escenarios del ciclo de vida.
2.5.1 Escenarios de Procesamiento del Ciclo de Vida de una Peticin
Una aplicacin JavaServer Faces soporta dos tipos diferentes de respuestas y dos tipos
diferentes de peticiones; la idea es que en una aplicacin JSF se pueden mezclar pginas
JSF y JSP (no-JSF) y, segn se pidan y/o se devuelvan una u otras, tendremos diferentes
respuestas y/o peticiones:
Respuesta Faces:
Una respuesta servlet que se gener mediante la ejecucin de la fase Renderizar la
Respuesta del ciclo de vida de procesamiento de la respuesta.
Respuesta No-Faces:
Una respuesta generada por el servlet en la que no se ha ejecutado la fase
Renderizar la Respuesta. Un ejemplo es una pgina JSP que no incorpora
componentes JavaServer Faces.
Peticin Faces:
Una peticin al servlet que fue enviada desde una Respuesta Faces previamente
generada. Un ejemplo es un formulario enviado desde un componente de interfaz de
usuario JavaServer Faces, donde la URI de la peticin identifica el rbol de
componentes JavaServer Faces para usar el procesamiento de peticin.
Peticin No-Faces:
Una peticin al servlet que fue enviada a un componente de aplicacin como un
servlet o una pgina JSP, en vez de directamente a un componente JavaServer Faces.
La combinacin de estas peticiones y respuestas resulta en tres posibles escenarios
del ciclo de vida que pueden existir en una aplicacin JavaServer Faces:

- Escenario 1: Una peticin No-Faces genera una respuesta Faces: Un ejemplo de este
escenario es cuando se pulsa un enlace de una pgina HTML que abre una pgina
que contiene componentes JavaServer Faces. Para construir una respuesta Faces
desde una peticin No-Faces, una aplicacin debe proporcionar un mapeo
FacesServlet en la URL de la pgina que contiene componentes JavaServer Faces.
FacesServlet acepta peticiones entrantes y pasa a la implementacin del ciclo de vida
para su procesamiento.
- Escenario 2: Una peticin Faces genera una respuesta no-Faces: Algunas veces una
aplicacin JavaServer Faces podra necesitar redirigir la salida a un recurso diferente
de la aplicacin Web (p.ej. una imagen sencilla) o generar una respuesta que no
contiene componentes JavaServer Faces. En estas situaciones, el desarrollador debe
saltarse la fase de renderizado (renderizar la respuesta) llamando a
FacesContext.responseComplete. FacesContext contiene toda la informacin
asociada con una peticin Faces particular. Este mtodo se puede invocar durante las
fases aplicar valores de respuesta, procesar validaciones o actualizar los valores del
modelo.
- Escenario 3: Una peticin Faces genera una respuesta Faces: Es el escenario ms
comn en el ciclo de vida de una aplicacin JavaServer Faces.
Este escenario implica componentes JavaServer Faces enviando una peticin a una
aplicacin JavaServer Faces utilizando el FacesServlet. Como la peticin ha sido
manejada por la implementacin JavaServer Faces, la aplicacin no necesita pasos
adicionales para generar la respuesta. Todos los oyentes, validadores y conversores
sern invocados automticamente durante la fase apropiada del ciclo de vida
estndar, como se describe en la siguiente seccin.
2.5.2 Ciclo de Vida Estndar de Procesamiento de Peticiones
La mayora de los usuarios de la tecnologa JavaServer Faces no necesitarn conocer
a fondo el ciclo de vida de procesamiento de una peticin. Sin embargo, conociendo
lo que la tecnologa JavaServer Faces realiza para procesar una pgina, un
desarrollador de aplicaciones JavaServer Faces no necesitar preocuparse de los
problemas de renderizado asociados con otras tecnologas UI. Un ejemplo sera el
cambio de estado de los componentes individuales: si la seleccin de un componente,
como por ejemplo una casilla de verificacin (checkbox) afecta a la apariencia de otro
componente de la pgina, la tecnologa JavaServer Faces manejar este evento de la
forma apropiada y no permitir que se dibuje la pgina sin reflejar este cambio.
La figura 2.2 ilustra los pasos del ciclo de vida peticin-respuesta JavaServer Faces.

Figura 2.2 Ciclo de vida peticin-respuesta de una pgina JSF


2.5.2.1 Reconstituir el rbol de componentes Cuando se hace una peticin de
una pgina JavaServer Faces, o cuando se produce un evento como pulsar sobre un
enlace o un botn, el sistema JavaServer Faces entra en el estado reconstituir el rbol
de componentes.
Durante esta fase, la implementacin JavaServer Faces construye el rbol de
componentes de la pgina JavaServer Faces, conecta los manejadores de eventos y los
validadores y graba el estado en el FacesContext.
2.5.2.2 Aplicar valores de la peticin Una vez construido el rbol de componentes,
cada componente del rbol extrae su nuevo valor desde los parmetros de la peticin con
su mtodo decode. A continuacin, el valor se almacena localmente en el componente.
Si la conversin del valor falla, se genera un mensaje de error asociado con el
componente y se pone en la cola de FacesContext. Este mensaje se mostrar durante la
fase renderizar la respuesta, junto con cualquier error de validacin resultante de la fase
procesar validaciones.
Si durante esta fase se produce algn evento, la implementacin JavaServer Faces
comunica estos eventos a los oyentes interesados.
En este punto, si la aplicacin necesita redirigirse a un recurso de aplicacin Web
diferente o generar una respuesta que no contenga componentes JavaServer Faces,
puede llamar a FacesContext.responseComplete.
En este momento, se han puesto los nuevos valores en los componentes y los mensajes y
eventos se han puesto en sus colas.

2.5.2.3 Procesar validaciones


Durante esta fase, el sistema JavaServer Faces procesa todas las validaciones registradas
con los componentes del rbol. Examina los atributos del componente especificados por
las reglas de validacin y evala las reglas con los valores de dichos atributos. Si un valor
incumple una regla, la implementacin JavaServer Faces aade un mensaje de error al
FacesContext y el ciclo de vida avanza directamente hasta la fase renderizar la
respuesta para que la pgina sea dibujada de nuevo incluyendo los mensajes de error. Si
haba errores de conversin de la fase aplicar los valores a la peticin, tambin se
mostrarn.

2.5.2.4 Actualizar los valores del modelo Una vez que la implementacin JavaServer
Faces determina que el dato es vlido, puede pasar por el rbol de componentes y
actualizar los valores del modelo con los nuevos valores pasados en la peticin. Slo se
actualizarn los componentes que tengan expresiones valueRef. Si el dato local no se
puede convertir a los tipos especificados por los atributos del objeto del modelo, el ciclo
de vida avanza directamente a la fase renderizar las respuesta, durante la que se
dibujar de nuevo la pgina mostrando los errores, similar a lo que sucede con los errores
de validacin.
2.5.2.5 Invocar Aplicacin
Durante esta fase, la implementacin JavaServer Faces maneja cualquier evento a nivel
de aplicacin, como enviar un formulario o enlazar a otra pgina.
En este momento, si la aplicacin necesita redirigirse a un recurso de aplicacin web
diferente o generar una respuesta que no contenga componentes JavaServer Faces,
puede llamar a FacesContext.responseComplete.
Posteriormente, la implementacin JavaServer Faces configura el rbol de componentes
de la respuesta a esa nueva pgina y, por ltimo, transfiere el control a la fase Renderizar
la Respuesta.
2.5.2.6 Renderizar la Respuesta Durante esta fase, la implementacin JavaServer
Faces invoca los atributos de codificacin de los componentes y dibuja los componentes
del rbol de componentes grabado en el FacesContext.
Si se encontraron errores durante las fases aplicar los valores a la peticin, procesar
validaciones o actualizar los valores del modelo, se dibujar la pgina original. Si las
pginas contienen etiquetas output_errors, cualquier mensaje de error que haya en la
cola se mostrar en la pgina.
Se pueden aadir nuevos componentes en el rbol si la aplicacin incluye renderizadores
personalizados, que definen cmo renderizar un componente. Despus de que se haya
renderizado el contenido del rbol, ste se graba para que las siguientes peticiones
puedan acceder a l y est disponible para la fase reconstituir el rbol de componentes
de las siguientes llamadas.
2.6 Una sencilla aplicacin JavaServer Faces en detalle
Vamos a comentar los pasos para construir la aplicacin vista en el primer captulo y
luego se comentar en detalle.
1. La estructura inicial de directorios debe ser la siguiente (en cualquier carpeta de
trabajo):
ejemploBasico index.html index.jsp hola.jsp
WEB-INF/ faces-config.xml web.xml
classes/
UsuarioBean.java

2. Debe compilarse el archivo UsuarioBean.java para generar UsuarioBean.class. Una


vez generado lo coloca en la carpeta /classes, en cuanto al fichero .java lo puede dejar
en la misma carpeta o crear una propia, por ejemplo /src que recoja sus ficheros fuentes,
es decir:
WEB-INF/ faces-config.xml web.xml
src/ UsuarioBean.java

classes/ UsuarioBean.class

3. Debe crearse la carpeta lib dentro de WEB-INF y dentro de sta, deben copiarse las
bibliotecas necesarias, representadas por los siguientes ficheros (la ubicacin original de
stos depender de donde haya instalado la implementacin JSF y Tomcat):
jsf-1_1/lib/jsf-api.jar
jsf-1_1/lib/jsf-impl.jar
jsf-1_1/lib/commons-digester.jar
jsf-1_1/lib/commons-beanutils.jar
jsf-1_1/lib/commons-collections.jar
jsf-1_1/lib/commons-logging.jar
tomcat 5.5/webapps/jsp-examples/WEB-INF/lib/jstl.jar
tomcat 5.5/webapps/jsp-examples/WEB-INF/lib/standard.jar

4. Por ltimo debe construirse el fichero .war (Web Archive). Para ello, dentro del
directorio /ejempoBasico, debe ejecutar:
jar cvf ejemploBasico.war .

y el fichero ejemploBasico.war generado hay que copiarlo al directorio:


c:\ArchivosDePrograma\Tomcat5.5 lo que producir el despliegue inmediato de la

aplicacin en el servidor Tomcat.


5. Por ltimo, slo queda probar que todo funciona bien. Desde su navegador, acceda a la
direccin:
http://localhost:8080/ejemploBasico

Y si todo es correcto, la aplicacin se iniciar correctamente.


Por otro lado, para desplegar la aplicacin existe una alternativa en caso de no querer
usar archivos .war: se puede copiar directamente la carpeta ejemploBasico, dentro
de
c:\ArchivosDePrograma\Tomcat5.5\webapps y acceder a la aplicacin mediante la
direccin
http://localhost:8080/ejemploBasico/index.faces

2.7 Beans y pginas JSF

Las aplicaciones web correctamente planificadas tienen dos partes: la parte de


presentacin y la lgica de negocio.

Das könnte Ihnen auch gefallen