Vous êtes sur la page 1sur 24

JavaServer Faces

Traduo da Terceira Edio


Core JavaServer Faces - Captulo 01_2.indd 1 10/05/2012 18:11:27
PRIMEIROS PASSOS
Tpicos deste Captulo:
- Por que luvuServer luces:, nu pgnu 3
- Lm Lxempo Smpes, nu pgnu 4
- Ambentes de Desenvovmento puru lSl, nu pgnu l3
- Anse de umu Apcuuo de Lxempo, nu pgnu l5
- Lmu Prmeru Pussudu de Chos peo Aux, nu pgnu 2l
- Servos do lrumework lSl, nu pgnu 24
- Nos ustdores, nu pgnu 26
Core JavaServer Faces - Captulo 01_2.indd 2 10/05/2012 18:11:27
Captulo Captulo
1
3
Por que JavaServer Faces?
Atualmente voc tem a possibilidade de escolher entre uma imensa variedade de
frameworks para o desenvolvimento da interface de usurio de uma aplicao
web. O JavaServer Faces (JSF) um framework baseado em componentes. Por exem-
plo, se voc deseja exibir uma tabela formada por linhas e colunas, em vez de utili-
zar um loop para gerar as tags HTML das linhas e colunas voc s precisa adicionar
a uma pgina um componente tabela. [Quem j conhece o desenvolvimento em
Java para o lado cliente (client-side) pode imaginar o JSF como um tipo de Swing
para aplicaes do lado servidor (server-side).] Atravs do uso de componentes
possvel conceber uma interface de usurio em um nvel mais alto do que o do
HTML bruto. Voc pode reutilizar seus componentes alm de empregar conjuntos
de componentes desenvolvidos por terceiros. E possvel tambm usar um am-
biente de desenvolvimento visual no qual voc poder simplesmente arrastar e
soltar componentes dentro de um formulrio.
O JSF possui as seguintes partes:
r Um conjunto de componentes de UI (User Interface, interface do usurio em
ingls) pr-fabricados;
r Um modelo de programao orientado a eventos;
r Um modelo de componentes que permite a desenvolvedores independentes
fornecerem componentes adicionais.
Alguns componentes do JSF so simples, como campos de entrada de dados e
botes, enquanto outros so bastante sofsticados, como, por exemplo, tabelas de
dados e rvores.
Core JavaServer Faces - Captulo 01_2.indd 3 10/05/2012 18:11:28
4
Captulo 1 Primeiros Passos
O JSF contm todo o cdigo necessrio para manipulao de eventos e organizao
de componentes. Os programadores de aplicaes podem ignorar esses detalhes e
se dedicar apenas lgica da aplicao.
JSF no o nico framework com componentes baseados na web, mas a camada de
viso no padro Java EE. JSF est includo em cada servidor de aplicaes Java EE e
pode ser facilmente adicionado a um continer web autnomo como o Tomcat
Ao contrrio da maioria dos frameworks para web, o JSF um padro com mlti-
plas implementaes, o que torna possvel a escolha de fornecedores. Outra vanta-
gem reside no fato de que, alm de o JSF estar em contnuo processo de aperfeioa-
mento e atualizao, o projeto do framework foi cuidadosamente analisado por um
comit de padronizao.
Este livro tem como foco o JSF 2.0, que implementa as melhorias mais importantes
sobre as verses anteriores. Ele muito mais simples do que o JSF 1.x e oferece
novos e poderosos recursos, tais como a integrao com Ajax e a criao de compo-
nentes compostos.
Um Exemplo Simples
Agora vamos examinar um exemplo simples de aplicao JSF. Nosso primeiro
exemplo comea com uma tela de login, mostrada na Figura 11.
Figura 11 Tela de login
O arquivo que descreve a tela de login , essencialmente, um arquivo HTML com al-
gumas poucas tags adicionais (veja Listagem 11). A aparncia visual dessa tela pode
ser facilmente melhorada por um artista grfco sem habilidade para programao.
Core JavaServer Faces - Captulo 01_2.indd 4 10/05/2012 18:11:28
5
Um Exemplo Simples
1. <?xml version="1.0" encoding="UTF-8"?>
2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4. <html xmlns="http://www.w3.org/1999/xhtml"
5. xmlns:h="http://java.sun.com/jsf/html">
6. <h:head>
7. <title>Welcome</title>
8. </h:head>
9. <h:body>
10. <h:form>
11. <h3>Please enter your name and password.</h3>
12. <table>
13. <tr>
14. <td>Name:</td>
15. <td><h:inputText value="#{user.name}"/></td>
16. </tr>
17. <tr>
18. <td>Password:</td>
19. <td><h:inputSecret value="#{user.password}"/></td>
20. </tr>
21. </table>
22. <p><h:commandButton value="Login" action="welcome"/></p>
23. </h:form>
24. </h:body>
25. </html>
Listagem 11 login/web/index.xhtml
Discutiremos o contedo desse arquivo detalhadamente mais adiante neste
captulo, na seo Pginas JSF, na pgina 17. Por enquanto, apenas observe os
seguintes pontos:
r A quantidade de tags em HTML padro: p, t abl e, entre outras;
r Algumas tags apresentam prefxos, como h: head e h: i nput Text . Estas so tags
JSF. O atributo xml ns declara o namespace do JSF;
r As tags h: i nput Text , h: i nput Secr et e h: commandBut t on correspondem ao campo
de texto, campo de senha e ao boto de submit na Figura 11;
r Os campos de entrada de dados esto vinculados s propriedades do
objeto. Por exemplo, o atributo val ue=#{user . name} diz implementao
JSF para vincular o campo de texto propriedade name de um objeto user.
Discutiremos esse vnculo detalhadamente mais adiante neste captulo, na
seo Beans, na pgina 16.
Quando o usurio digita o nome e a senha e clica no boto Login, o arqui-
vo wel come. xht ml exibido, conforme especifcado no atributo act i on da tag
h: commandBut t on. (veja Figura 1-2 e Listagem 1-2.)
Core JavaServer Faces - Captulo 01_2.indd 5 10/05/2012 18:11:29
6
Captulo 1 Primeiros Passos
OBSERVAO: Nas verses anteriores ao JSF 2.0, para especifcar a pgina a
ser exibida quando um boto era clicado, voc precisava adicionar uma regra
de navegao (em ingls, navigation rule) em um arquivo WEB- I NF/ f aces-
cohg.xm1. No JSF 2.0 voc pode especifcar o nome da pgina diretamente
no atributo act i on do boto. (Mas continua sendo possvel o uso de regras de
navegao; ns as discutiremos no Captulo 3.)
Figura 1-2 Tela de boas-vindas
A segunda pgina JSF de nossa aplicao ainda mais simples que a primeira (veja
a Listagem 1-2). Empregamos a expresso #{user . name} para exibir a propriedade
name do objeto user que foi defnido na primeira pgina. Por enquanto, no levamos
em considerao a senha.
1. <?xml version="1.0" encoding="UTF-8"?>
2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4. <html xmlns="http://www.w3.org/1999/xhtml"
5. xmlns:h="http://java.sun.com/jsf/html">
6. <h:head>
7. <title>Welcome</title>
8. </h:head>
9. <h:body>
10. <h3>Welcome to JavaServer Faces, #{user.name}!</h3>
11. </h:body>
12. </html>
Listagem 1-2 login/web/welcome.xhtml
Sem dvida alguma, o objetivo dessa aplicao no causar qualquer tipo de
impacto, mas apenas ilustrar as diversas peas necessrias para a criao de uma
aplicao JSF.
Core JavaServer Faces - Captulo 01_2.indd 6 10/05/2012 18:11:30
7
Um Exemplo Simples
Ingredientes
Nossa aplicao de exemplo possui os seguintes ingredientes:
r Pginas que defnem as telas de login e de boas-vindas so chamadas de
i ndex. xht ml e wel come. xht ml .
r Um bean que gerencia os dados do usurio (no nosso caso, nome do usurio
e senha). Um bean uma classe Java que expe propriedades, normalmente
seguindo uma conveno simples para nomear os mtodos getter e setter. O
cdigo encontra-se no arquivo User Bean. j ava (veja Listagem 13). Observe
as anotaes @Named e 0Mahagedeah, que especifcam o nome pelo qual uma
pgina JSF faz referncia a um objeto dessa classe. (Por uma questo de com-
patibilidade h duas anotaes alternativas relativas escolha de nome para
um bean. O @Named a melhor opo para um servidor de aplicaes compat-
vel com o Java EE 6. O 0Mahagedeah concebido para uso com servidores de
aplicaes legadas e processadores de servlet autnomos.)
r Os arquivos de confgurao web. xml e beans. xml so necessrios para manter
em operao o servidor de aplicaes.
OBSERVAO: Nas verses anteriores ao JSF 2.0, voc precisava declarar
os beans em um arquivo WEB- I NF/faces-cohg.xm1. Esse procedimento no
mais necessrio e essa aplicao no requer tal arquivo.
Aplicaes JSF mais avanadas apresentam a mesma estrutura, mas podem conter
outras classes Java, como handlers de eventos, validadores e componentes customi-
zados. Parmetros de confgurao adicionais podem ser colocados em um arquivo
WE-ThI/faces-cohg.xm1 que descreveremos no prximo captulo. Para uma aplica-
o simples, esse arquivo no necessrio.
1. package com.corejsf;
2.
3. import java.io.Serializable;
4. import javax.inject.Named;
5. // ou import javax.faces.bean.ManagedBean;
6. import javax.enterprise.context.SessionScoped;
7. // ou import javax.faces.bean.SessionScoped;
8.
9. @Named("user") // ou @ManagedBean(name="user")
10. @SessionScoped
11. public class UserBean implements Serializable {
12. private String name;
Listagem 1-3 login/src/java/com/corejsf/UserBean.java
Core JavaServer Faces - Captulo 01_2.indd 7 10/05/2012 18:11:30
8
Captulo 1 Primeiros Passos
13. private String password;
14.
15. public String getName() { return name; }
16. public void setName(String newValue) { name = newValue; }
17.
18. public String getPassword() { return password; }
19. public void setPassword(String newValue) { password = newValue; }
20. }
Estrutura de Diretrios
As aplicaes JSF so implementadas como um arquivo WAR: um arquivo compac-
tado com extenso . war e uma estrutura de diretrios com um layout padronizado:
Arquivos XHTML
WEB-INF/
arquivos de confgurao JSF e de servlet
classes/
arquivos class
lib/
arquivos da biblioteca
resources/
arquivos CSS, JavaScript, imagens
META-INF/
arquivos de confgurao do servidor de aplicaes
O arquivo WAR da nossa aplicao de exemplo tem a estrutura de diretrios mos-
trada na Figura 13. Note que a classe User Bean encontra-se no pacote com. cor ej sf .
OBSERVAO: Quando voc usa o Tomcat ou outro processador de servlets,
no diretrio l i b fcam os arquivos JAR da implementao JSF. Isso no
necessrio com o GlassFish e outros servidores de aplicao Java EE, pois
eles j trazem o JSF incorporado.
Core JavaServer Faces - Captulo 01_2.indd 8 10/05/2012 18:11:31
9
Um Exemplo Simples
Figura 1-3 Estrutura de diretrios do arquivo WAR do exemplo
usual o empacotamento das fontes da aplicao em uma estrutura de diretrios
diferente. Neste livro, adotamos as convenes do Java Blueprints (ht t p: / / j ava.
sun. com/ bl uepr i nt s/ code/ pr oj ect convent i ons. ht ml ). O uso desse pacote facilita a
importao de nosso projeto para um IDE, como o Eclipse ou o Netbeans. O cdigo-
-fonte fca armazenado em um diretrio sr c/ j ava, e as pginas JSF e os arquivos de
confgurao, em um diretrio web (veja Figura 1-4).
Figura 1-4 Estrutura de diretrios das fontes da aplicao do exemplo
Criando uma Aplicao JSF
Agora, vamos gui-lo atravs das etapas necessrias para criao de aplicaes JSF sem
o auxlio de um IDE ou de um script. Por certo, na prtica, voc optar por usar algu-
ma ferramenta desse tipo; porm, para ter condies de resolver eventuais problemas
com mais efcincia, muito til conhecer a implementao gerada por um IDE.
Core JavaServer Faces - Captulo 01_2.indd 9 10/05/2012 18:11:32
10
Captulo 1 Primeiros Passos
Voc precisa dos seguintes pacotes de software para iniciar o trabalho:
r JDK (Java SE Development Kit) 5.0 ou superior (ht t p: / / j ava. sun. com/ j 2se)
r JSF 2.0 (que j pode estar embutido em seu servidor de aplicaes ou ser
obtido separadamente em ht t p: / / j avaser ver f aces. dev. j ava. net )
r O cdigo exemplo usado neste livro, disponvel em ht t p: / / cor ej sf . com
Partimos da premissa que voc j instalou o JDK e tem familiaridade com as ferra-
mentas a ele associadas. Para mais informaes sobre o JDK, veja, Core Java 2 de
Cay Horstman e Gary Cornell, Editora Alta Books.
Sabendo que o JSF 2.0 parte integrante da especifcao Java EE 6, o uso de um
servidor de aplicaes compatvel com essa especifcao, como o GlassFish verso
3 (hffp://g1asssh.dev.ava.hef), facilita a tarefa de colocar em prtica o JSF.
Voc pode usar um processador de servlet, como o Tomcat (ht t p: / / t omcat . apache.
og), em conjunto com a implementao de referncia do JSF (disponvel em ht t p: / /
j avaser ver f aces. dev. j ava. net ), caso no queira instalar um servidor de aplicaes
completo.
Se voc optar pelo uso de outro servidor de aplicaes ou processador de servlet,
ter que adaptar as instrues apresentadas a seguir.
Estas so as instrues para a criao da aplicao JSF de nosso exemplo:
1. Inicie a execuo do prompt de comando.
2. Navegue para o diretrio corejsf-examples isto , o diretrio que contm o
cdigos fonte dos exemplos deste livro.
3. Se voc estiver usando o GlassFish ou outro servidor de aplicaes compat-
vel com Java EE 6, navegue para o subdiretrio j avaee. Caso esteja utilizando
o Tomcat, navegue para o subdiretrio t omcat .
4. Navegue para o diretrio src (source, fonte em ingls) e crie o diretrio onde
sero armazenados os arquivos class:
cd ch01/login/src/java
mkdir ../../web/WEB-INF/classes
No Windows, utilize barras invertidas como separador.
5. Se estiver trabalhando com o GlassFish, execute o seguinte comando:
javac -d ../../web/WEB-INF/classes -classpath .:glassfsh/modules/\*
com/corejsf/UserBean.java
Core JavaServer Faces - Captulo 01_2.indd 10 10/05/2012 18:11:33
11
Um Exemplo Simples
No Windows, utilize um ponto e vrgula no classpath e no deixe de usar o
caracter coringa
*
:
Se voc estiver usando o Tomcat, execute o seguinte comando para fazer a
compilao de seu cdigo:
javac -d ../../web/WEB-INF/classes -classpath .:jsf-ref-impl/lib/jsf-api.jar
com/corejsf/UserBean.java
6. O Tomcat requer a incluso das seguintes bibliotecas do JSF:
mkdir ../../web/WEB-INF/lib
cp jsf-ref-impl/lib/*.jar ../../web/WEB-INF/lib
Pule essa etapa, se voc estiver executando um servidor de aplicaes com-
patveis com o Java EE 6.
7. Execute os comandos a seguir (e observe a colocao de um ponto ( . ) no
fnal do comando j ar , indicando o diretrio corrente):
cd ../../web
jar cvf../login.war .
Implantando uma Aplicao JSF
Instale seu servidor e inicie-o. Por exemplo, para iniciar o GlassFish sob Unix/Li-
nux, utilize o seguinte comando:
glassfsh/bin/asadmin start-domain
(veja Figura 1-5) para iniciar o Tomcat sob Unix/Linux use o seguinte comando:
tomcat/bin/startup.sh
Figura 1-5 Executando o GlassFish
Core JavaServer Faces - Captulo 01_2.indd 11 10/05/2012 18:11:39
12
Captulo 1 Primeiros Passos
Para verifcar se o servidor est executando corretamente, direcione seu navegador
para a URL padro. Tanto para o GlassFish como no caso do Tomcat, essa URL :
ht t p: / / l ocal host : 8080. Dever ser exibida a pgina de boas-vindas (veja Figura 1-6).
Figura 1-6 Pgina de boas-vindas do GlassFish
A maioria dos servidores permite que voc instale as aplicaes simplesmente
copiando os arquivos WAR para o diretrio de implantao. No GlassFish, esse di-
retrio glassfsh/ domai ns/ domai n1/ aut odepl oy. No Tomcat, os arquivos WAR devem
ser implantados em tomcat/ webapps.
Copie o arquivo 1og1h.Wa para o diretrio de implantao, certifque-se de que seu
servidor esteja em execuo e direcione seu navegador para:
http://localhost:8080/login
A aplicao dever comear a executar.
OBSERVAO: Se alguma coisa no funcionar na implantao do programa
exemplo, voc dever consultar o arquivo de log, onde encontrar indicao
das possveis causas. No GlassFish todas as mensagens fcam registradas no
arquivo glassfsh/doma1hs/doma1h1/1ogs/seve.1og. No caso do Tomcat, elas
esto em tomcat/1ogs/cafa11ha.ouf.
Quando comear a desenvolver suas prprias aplicaes, til saber que
os logs contm todas as sadas enviadas para Syst em. out e Syst em. er r . Na
confgurao padro, essas sadas incluem todas as mensagens com nvel
INFO ou superior.
Em outras palavras, para obter as informaes que permitam a voc depurar
a aplicao para identifcar os erros, sufciente incluir chamadas de Syst em.
out . pr i nt l n ou Logge.gefC1oba1{}.1hfo, e a sada ser exibida nos logs.
Core JavaServer Faces - Captulo 01_2.indd 12 10/05/2012 18:11:52
13
Ambientes de Desenvolvimento para o JSF
Ambientes de Desenvolvimento para o JSF
Para criar as pginas e arquivos de confgurao de uma aplicao JSF simples,
voc pode utilizar um editor de texto. No entanto, medida que sua aplicao se
tornar mais complexa, surgir a necessidade de usar ferramentas mais sofsticadas.
Os IDEs, como o Eclipse e o Netbeans, so merecidamente difundidos entre os pro-
gramadores. O suporte a recursos do tipo autocompletar, refatorao e depurao,
entre outros, garante um drstico aumento de produtividade, em especial no caso
de grandes projetos.
Pelo menos at agora, quando da preparao deste livro, tanto o Eclipse quanto
o Netbeans oferecem um bom suporte a JSF. O Netbeans, por j estar totalmente
integrado com o GlassFish e o Tomcat, no requer que esses servidores sejam
obtidos parte. Com o Eclipse necessrio instal-los separadamente e usar o
plugin especfco de cada um deles. (O plugin do GlassFish pode ser encontrado
em hffp://g1assshp1ug1hs.dev.ava.hef.) O Eclipse oferece apenas suporte bsico
para o JSF. Diversos derivados comerciais do Eclipse (como MyEclipse, JBoss
Developer Studio e Rational Application Developer), da mesma forma que o Ora-
cle JDeveloper, possuem recursos avanados de JSF. Todos eles disponibilizam
verses de teste que podem ser obtidas via download.
Quando voc carregar em seu IDE o cdigo de um dos exemplos de projeto que
acompanham o livro, escolha a opo de importao de um projeto web a partir de
fontes existentes. Selecione o diretrio source, como o corejsf-examples/ j avaee/ ch01/
1og1h. O Netbeans obtm automaticamente os diretrios corretos para fonte e web,
mas o Eclipse requer que voc altere os diretrios default, sr c e WebCont ent , respec-
tivamente para sr c/ j ava e web (veja Figura 1-7).
Figura 1-7 Importando um projeto para o Eclipse
Core JavaServer Faces - Captulo 01_2.indd 13 10/05/2012 18:11:54
14
Captulo 1 Primeiros Passos
A utilizao de um IDE facilita bastante a execuo e a depurao das aplicaes. A
Figura 1-8 apresenta o depurador do Eclipse parado em um ponto de interrupo
(breakpoint, em ingls) na classe User Bean. Tanto o Eclipse quanto o Netbeans ofere-
cem suporte a correes de erro do tipo hot fxes, alm de possibilitar alteraes das
pginas JSF e do cdigo Java, alteraes essas que so instantaneamente refetidas
pela aplicao em execuo. (Advertncia: os hot fxes no podem ser aplicados em
qualquer situao e pode ocorrer a necessidade de voc reimplantar sua aplicao
ou, at mesmo, reiniciar o servidor de aplicaes.)
Figura 1-8 O depurador do Eclipse
Alguns IDEs possuem uma ferramenta de desenvolvimento visual atravs da qual o
projetista tem condies de escolher os componentes em uma paleta e simplesmen-
te arrast-los e solt-los dentro da pgina JSF. A Figura 1-9 apresenta a ferramenta
visual do JDeveloper.
Em geral, as ferramentas de desenvolvimento visual esto habilitadas a manipular
conjuntos especfcos de componentes. O JDeveloper, por exemplo, usa os compo-
nentes ADF Faces. Infelizmente, voc no pode escolher seu conjunto favorito e
adicion-lo a uma dessas ferramentas. O padro JSF ainda no especifca mtodos
de etapa de desenvolvimento para componentes e no h uma maneira padro de
empacotar bibliotecas de componentes para uso em mltiplos IDEs.
Core JavaServer Faces - Captulo 01_2.indd 14 10/05/2012 18:12:03
15
Uma Anlise da Aplicao de Exemplo
Figura 1-9 Desenvolvimento visual de JSF
Uma Anlise da Aplicao de Exemplo
Voc acabou de ver uma aplicao JSF simples e j sabe como desenvolv-la e
execut-la. Vamos agora analisar mais detalhadamente a estrutura da aplicao.
Aplicaes web possuem duas partes: a camada de apresentao e a lgica de negcios.
A camada de apresentao refere-se aparncia da aplicao. No contexto de uma
aplicao baseada em navegadores, a aparncia determinada pelas tags HTML, que
especifcam o layout, as fontes, as imagens e assim por diante. A lgica de negcios
implementada no cdigo Java, que determina o comportamento da aplicao.
Algumas tecnologias web misturam HTML e cdigo. Essa abordagem atraente
por facilitar a produo de aplicaes simples em um nico arquivo. Para aplica-
es crticas, contudo, misturar HTML e cdigo cria problemas considerveis.
Web designers profssionais entendem de design grfco, mas, normalmente,
dependem de ferramentas para converter sua ideia em HTML. Por certo, eles no
gostariam de manipular cdigo embutido em suas pginas. Por outro lado, progra-
madores so notoriamente desqualifcados no que se refere ao design grfco (os
programas de exemplo deste livro provam isto claramente).
Core JavaServer Faces - Captulo 01_2.indd 15 10/05/2012 18:12:07
16
Captulo 1 Primeiros Passos
Assim, para elaborar aplicaes web profssionais, importante separar a apre-
sentao da lgica de negcios. Isso permite que tanto os web designers quanto os
programadores se concentrem nas suas competncias fundamentais.
No contexto do JSF, o cdigo das aplicaes est localizado nos beans e o design,
nas pginas web. Examinaremos primeiramente os beans.
Beans
Um bean Java uma classe que expe propriedades e eventos a um framework
como o JSF. Uma propriedade um valor nomeado de um determinado tipo que
pode ser lido e/ou escrito. A maneira mais simples de defnir uma propriedade
convencionando uma nomenclatura padronizada para os mtodos de leitura e es-
crita, ou seja, a conveno familiar gef/sef. No nome dos mtodos, a primeira letra
do nome da propriedade escrita em caixa alta.
Por exemplo, a classe User Bean tem duas propriedades: nome (name) e senha (pas-
swor d), ambas do tipo Sf1hg:
public class UserBean implements Serializable {
. . .
public String getName() { . . . }
public void setName(String newValue) {. . . }
public String getPassword() { . . . }
public void setPassword(String newValue) { . . . }
}
Os mtodos gef/sef podem executar aes arbitrrias. Em muitos casos, simples-
mente obtm (get) ou atribuem um valor a (set) um campo de um objeto. Mas eles
tambm devem realizar alguns clculos ou mesmo acessos a um banco de dados.
OBSERVAO: De acordo com a especifcao bean, vlido omitir um mtodo de
leitura ou escrita. Por exemplo, se gefPassWod for omitido, ento passwor d uma
propriedade do tipo somente-escrita (write-only, em ingls). Isso poderia ser desejvel
por motivos de segurana. Todavia, o JSF no oferece suporte a propriedades do tipo
somente-escrita. Voc sempre utiliza propriedades leitura/escrita para os componentes
de entrada de dados, e as do tipo somente-leitura (read-only, em ingls) podem ser
empregadas para os de sada.
Um bean gerenciado (managed bean, em ingls) um bean Java que pode ser acessa-
do a partir de uma pgina JSF. Ele deve ter um nome e um escopo. O bean de nosso
exemplo tem o nome user e o escopo session. Isso signifca que o objeto bean fca
disponvel para um usurio atravs de mltiplas pginas. Usurios diferentes que
executam essa aplicao web so associados a instncias diferentes do objeto bean.
No Captulo 2, voc conhecer escopos adicionais para um bean.
Core JavaServer Faces - Captulo 01_2.indd 16 10/05/2012 18:12:08
17
Uma Anlise da Aplicao de Exemplo
Os beans so gerenciados no seguinte sentido: Quando o nome de um bean ocorre
em uma pgina JSF, a implementao JSF localiza o objeto que possui esse nome
ou ento o cria, se ainda no existir dentro do escopo apropriado. Por exemplo, se
um segundo usurio se conectar nossa aplicao de exemplo, outro objeto do tipo
User Bean ser criado.
A maneira mais fcil para se especifcar o nome e o escopo de um bean gerenciado
o uso de anotaes:
@Named("user") // ou @ManagedBean(name="user")
@SessionScoped
public class UserBean implements Serializable
Em aplicaes JSF, usam-se beans gerenciados para todos os dados que devem ser
acessveis a partir de uma pgina. Os beans so os canais entre a interface de usu-
rio e o backend da aplicao.
Pginas JSF
Para cada tela do navegador voc precisa de uma pgina JSF. Por razes histricas,
h diversos mecanismos diferentes para a criao de pginas JSF. A verso 1.x desse
software tinha como base o JavaServer Pages (JSP), que causava alguns problemas
tcnicos inconvenientes. No entanto, o JSF permite que os programadores substitu-
am o handler de visualizao que processa suas pginas. O projeto Facelets fazia
exatamente isso, com o objetivo de apresentar mensagens de erro mais signifcativas,
disponibilizar um mecanismo de fabricao das partes comuns das pginas e per-
mitir que voc escrevesse com mais facilidade seus prprios componentes. Facelets
tornou-se parte integrante do JSF 2.0 e ns o utilizamos neste livro.
Para criar uma pgina Facelets, voc adiciona tags JSF a uma pgina XHTML, que
nada mais seno uma simples pgina HTML com tags XML apropriados. Ns
utilizamos a extenso . xht ml para as pginas Facelets.
Examine novamente a primeira pgina de nosso exemplo na Listagem 1-1. No topo
da pgina voc encontrar uma declarao de namespace:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html">
A segunda linha declara o prefxo h: par a as tags HTML do JSF.
A implementao JSF tambm defne um conjunto de tags de ncleo, que so inde-
pendentes do HTML. Se voc precisar de um deles em sua pgina, dever adicio-
nar uma declarao namespace:
xmlns:f="http://java.sun.com/jsf/core"
Se voc utilizar bibliotecas de tags de outros fornecedores, dever incluir declara-
es de namespace adicionais.
Core JavaServer Faces - Captulo 01_2.indd 17 10/05/2012 18:12:08
18
Captulo 1 Primeiros Passos
OBSERVAO: Voc pode escolher qualquer prefxo de tag que desejar, como,
por exemplo: ht ml : i nput Text em vez de h: i nput Text . Neste livro adotamos h
para as tags HTML e f para o ncleo.
Uma pgina JSF semelhante a um formulrio HTML, com as seguintes diferenas:
r Sua pgina deve ter formatao XHTML correta, pois, ao contrrio de um
navegador, a implementao JSF no deixa passar erros de sintaxe.
r Voc deve usar h: head, h: body e h: f or mem vez de head, body e f or m.
r Voc deve substituir as tags i nput comuns do HTML pelas correspondentes
h: i nput Text , h: i nput Secr et e h: commandBut t on.
OBSERVAO: Em vez de usar uma tag JSF como:
<h:inputText value="#{user.name}"/>
voc pode empregar uma tag HTML comum, com o atributo j sf c:
<input type="text" jsfc="h:inputText" value="#{user.name}"/>
Esse recurso visa a facilitar a criao de pginas em uma ferramenta de
web design. No entanto, isso s funciona para os componentes JSF que tm
correspondncia direta com os do HTML. Neste livro, adotamos as tags JSF.
OBSERVAO: Se voc tem familiaridade com verses anteriores do JSF j
deve ter visto pginas JSF defnidas com a sintaxe JSP:
<html>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<f:view>
<head>...</head>
<body>...</body>
</f:view>
</html>
No JSF 2.0 ainda possvel usar o JSP, mas esse procedimento no
recomendado. Uma desvantagem que voc poder receber mensagens
muito obscuras no caso de pginas que contenham erro de sintaxe e, mais
importante ainda, que alguns recursos do JSF 2.0 (tais como os modelos,
templating, em ingls) funcionam apenas com Facelets.
Nos captulos 4 e 5, discutiremos todas as tags JSF e seus atributos. Nos primeiros
trs captulos tratamos dos campos de entrada de dados e botes de comando.
Core JavaServer Faces - Captulo 01_2.indd 18 10/05/2012 18:12:09
19
Uma Anlise da Aplicao de Exemplo
Os valores dos campos de entrada de dados fcam associados s propriedades do
bean, cujo nome seja user :
<h:inputText value="#{user.name}"/>
Os delimitadores #{. . . } contm expresses na linguagem de expresses do JSF, a
qual discutiremos em detalhes no Captulo 2.
Quando uma pgina exibida, a implementao JSF localiza o bean denominado
user e chama o mtodo gefhame para obter o valor corrente da propriedade. Quando
a pgina submetida, a implementao JSF chama o mtodo set Name para atribuir o
valor que foi digitado no formulrio.
A tag h: commandBut t on possui um atributo act i on, cujo valor indica qual ser a pgi-
na a ser exibida na sequncia:
<h:commandButton value="Login" action="welcome"/>
Congurao do Servlet
Para instalar uma aplicao JSF em um servidor de aplicaes, voc deve fornecer
um arquivo de confgurao chamado web. xml . Por sorte, possvel usar o mesmo
arquivo web. xml para a maioria das aplicaes JSF. A Listagem 1-4 apresenta o con-
tedo desse arquivo.
1. <?xml version="1.0" encoding="UTF-8"?>
2. <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
3. xmlns="http://java.sun.com/xml/ns/javaee"
4. xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
5. xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
6. http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
7. version="2.5">
8. <servlet>
9. <servlet-name>Faces Servlet</servlet-name>
10. <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
11. </servlet>
12. <servlet-mapping>
13. <servlet-name>Faces Servlet</servlet-name>
14. <url-pattern>/faces/*</url-pattern>
15. </servlet-mapping>
16. <welcome-file-list>
17. <welcome-file>faces/index.xhtml</welcome-file>
18. </welcome-file-list>
19. <context-param>
20. <param-name>javax.faces.PROJECT_STAGE</param-name>
21. <param-value>Development</param-value>
22. </context-param>
23. </web-app>
Listagem 1-4 login/web/WEB-INF/web.xml
Core JavaServer Faces - Captulo 01_2.indd 19 10/05/2012 18:12:10
20
Captulo 1 Primeiros Passos
Todas as pginas JSF so passadas para o Faces servlet que parte integrante do
cdigo de implementao do JSF. Para assegurar a ativao da servlet correta
quando uma pgina JSF solicitada, as URLs do JSF possuem um formato especial.
Na nossa confgurao elas utilizam o prefxo / f aces. O elemento sev1ef-mapp1hg
garante que todas as URLs com esse prefxo sejam processadas pelo Faces servlet.
Por exemplo, voc no pode simplesmente direcionar seu navegador para
hffp://1oca1hosf:8080/1og1h/1hdex.xhfm1. A URL deve ser ht t p: / / l ocal host : 8080/
1og1h/faces/ i ndex. xht ml . A regra de mapeamento ativa o Faces servlet que vem a
ser o ponto de entrada da implementao JSF. Esta retira o prefxo / f aces, carre-
ga a pgina i ndex. xht ml , processa as tags e apresenta o resultado.
CUIDADO: Se a requisio da pgina JSF no tiver o prefxo / f aces, o
navegador exibir as tags HTML, mas ignorar as do JSF.
OBSERVAO: Voc pode defnir um mapa de extenso ao invs de um mapa
de prefxo / f aces. Use a diretiva abaixo no seu arquivo web. xht ml .
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>*.faces</url-pattern>
</servlet-mapping>
Em seguida, utilize a URL hffp://1oca1hosf:8080/1og1h/1hdex.faces. Essa
URL ativa o servlet Faces. A implementao JSF que retira a extenso .faces e
carrega o arquivo /1og1h/1hdex.xhfm1.
OBSERVAO: A rigor, pginas JSF no so arquivos XHTML elas apenas
tm o objetivo de criar tais arquivos. Se voc quiser usar a extenso . j sf para
as pginas JSF, ter que acrescentar a seguinte entrada ao arquivo web. xml :
<context-param>
<param-name>javax.faces.DEFAULT_SUFFIX</param-name>
<param-value>.jsf</param-value>
</context-param>
Observe que essa confgurao afeta apenas os desenvolvedores das
aplicaes web e no os usurios dessas aplicaes. As URLs mantm a
extenso . f aces ou o prefxo / f aces.
O arquivo web. xml especifca uma pgina de boas-vindas (welcome page, em ingls),
que ser carregada quando o usurio digitar no navegador a URL da aplicao
web. Por exemplo, se ele digitar a URL hffp://1oca1hosf:8080/1og1h, o servidor de
aplicaes carregar automaticamente a pgina / f aces/ i ndex. xht ml .
Core JavaServer Faces - Captulo 01_2.indd 20 10/05/2012 18:12:10
21
Uma Primeira Passada de Olhos pelo Ajax
Por ltimo, especifcamos um parmetro que acrescenta suporte para depurao de
uma aplicao JSF:
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>
As opes disponveis para o estgio do projeto so Devel opment , Uni t Test , Syst e-
mTest e Poducf1oh. No estgio de desenvolvimento voc obtm um nmero maior
de mensagens informativas de erro.
OBSERVAO: O parmetro PP0JECTSTACE foi introduzido no JSF 2.0.
OBSERVAO: Alguns servidores de aplicaes (inclusive o GlassFish) geram
automaticamente um mapeamento de servlet para os padres / f aces/ *,
*. f aces e *. j sf , desde que observadas as condies a seguir:
r Nenhuma das classes na aplicao web utilize anotaes JSF
r Nenhum parmetro de inicializao comece com j avax. f aces
r O arquivo WE-ThI/faces-cohg.xm1 esteja presente
No ser necessrio fornecer um arquivo web. xml se voc no precisar defnir
outros parmetros. Entretanto, j que recomendamos que o estgio do projeto
seja defnido como Devel opment , ns forneceremos os arquivos web. xml em
nossos exemplos. Se voc tiver certeza que o seu servidor de aplicaes
detecta automaticamente as aplicaes JSF, poder omitir a declarao do
Faces servlet e o mapeamento de servlet de seu arquivo web. xml .
Uma Primeira Passada de Olhos pelo Ajax
O Ajax (Asynchronous JavaScript with XMLHttpRequest) uma tecnologia para atu-
alizao de pginas web no navegador do cliente sem que o formulrio tenha que
ser submetido e a resposta criada. A pgina web contm cdigo JavaScript que se
comunica com o servidor e realiza alteraes incrementais na estrutura da pgina.
O resultado para o usurio uma apresentao mais estvel, sem a temida atuali-
zao total de pgina.
*
No Captulo 10, discutiremos em detalhes a tecnologia Ajax. Por sorte, o JSF 2.0
permite que voc use o Ajax sem ter a necessidade de compreender a grande com-
plexidade de seu canal de comunicao. Apresentamos aqui um ligeiro aperitivo
para estimular seu apetite.
* NE: No livro original usa-se o termo page fip. Optamos por atualizao total de pgina.
Core JavaServer Faces - Captulo 01_2.indd 21 10/05/2012 18:12:11
22
Captulo 1 Primeiros Passos
Reestruturaremos nossa aplicao login de forma que em vez de submeter o for-
mulrio o boto Login passe a fazer uma requisio Ajax. To logo o usurio tenha
feito o login uma saudao ser exibida (veja Figura 1-10).
Figura 1-10 Com o uso de Ajax, a pgina de saudao exibida sem
atualizao total de pgina.
Cada um dos componentes acessados pelo cdigo cliente requer um identifcador
(ID), que ns declaramos com o atributo i d, da seguinte maneira:
<h:outputText id="out" value="#{user.greeting}"/>
Tambm fornecemos identifcadores para os campos name e password.
Por default, o ID do formulrio adicionado ao incio do ID de seus componen-
tes. Defnindo como f al se o atributo pr ependI d do formulrio, ns desligamos esse
procedimento de forma a obter nomes mais simples para os identifcadores (veja
Listagem 1-5).
Acrescentamos classe User Bean uma propriedade greeting do tipo somente-leitura:
public String getGreeting() {
if (name.length() == 0) return "";
Core JavaServer Faces - Captulo 01_2.indd 22 10/05/2012 18:12:12
23
Uma Primeira Passada de Olhos pelo Ajax
else return "Welcome to JSF2 + Ajax, " + name + "!";
}
Essa saudao ser exibida no campo de texto.
Agora estamos prontos para implementar o comportamento Ajax para o boto
Login:
<h:commandButton value="Login">
<f:ajax execute="name password" render="out" />
</h:commandButton>
Quando o boto Login for clicado, em vez de o formulrio ser submetido, uma
requisio Ajax ser enviada ao servidor.
Os atributos execut e e r ender especifcam listas de ID de componentes. Os com-
ponentes do atributo execut e so processados da mesma forma que seriam se o
formulrio fosse submetido. Na prtica, o valor deles enviado ao servidor e as
propriedades do bean correspondentes so atualizadas. Os componentes r ender
so processados como se a pgina tivesse sido exibida. No nosso caso, o mtodo
gefCeef1hg do bean denominado user chamado e seu resultado enviado para o
cliente, onde exibido.
Observe que o bean user fca residente no servidor. A saudao no processada no
cliente. Em vez disso, o cdigo cliente envia valores dos componentes para o servi-
dor, recebe o HTML atualizado para os componentes a serem gerados e insere essas
atualizaes dentro da pgina.
Quando voc executar esta aplicao, notar que no ocorrero atualizaes totais
de pgina quando o boto Login for clicado. Apenas a saudao atualizada e o
restante da pgina permanece inalterado.
Como voc acabou de ver, o uso de Ajax em conjunto com JSF mais natural. A
lgica do programa escrita em Java e para a interao com o cdigo Java empre-
gado o mesmo mecanismo usado em uma pgina JSF comum.
1. <?xml version="1.0" encoding="UTF-8"?>
2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4. <html xmlns="http://www.w3.org/1999/xhtml"
5. xmlns:h="http://java.sun.com/jsf/html"
6. xmlns:f="http://java.sun.com/jsf/core">
7. <h:head>
8. <title>Welcome</title>
9. </h:head>
10. <h:body>
11. <h:form prependId="false">
12. <h3>Please enter your name and password.</h3>
Listagem 1-5 login-ajax/web/index.xhtml
Core JavaServer Faces - Captulo 01_2.indd 23 10/05/2012 18:12:12
24
Captulo 1 Primeiros Passos
13. <table>
14. <tr>
15. <td>Name:</td>
16. <td><h:inputText value="#{user.name}" id="name"/></td>
17. </tr>
18. <tr>
19. <td>Password:</td>
20. <td><h:inputSecret value="#{user.password}" id="password"/></td>
21. </tr>
22. </table>
23. <p><h:commandButton value="Login">
24. <f:ajax execute="name password" render="out"/>
25. </h:commandButton></p>
26. <h3><h:outputText id="out" value="#{user.greeting}"/></h3>
27. </h:form>
28. </h:body>
29. </html>
Servios do Framework JSF
Agora que voc j viu a sua primeira aplicao JSF, mais fcil explicar os servios
que o framework JSF oferece aos desenvolvedores. A Figura 111 apresenta uma
viso geral de alto nvel da arquitetura JSF. Como voc pode ver, o framework JSF
responsvel pela interao com os dispositivos clientes e fornece as ferramentas
para unir a apresentao visual, a lgica da aplicao e a lgica de negcios de
uma aplicao web. Entretanto, o escopo do JSF restringe-se camada da apresen-
tao. Ou seja, persistncia em bancos de dados, Web Service e outras conexes de
backend esto fora do escopo do JSF.
Figura 1-11 Viso geral do framework JSF
dispositivos
clientes
container servlet
aplicao web
apresentao lgica de aplicao
navegao
validao
manipulao de
eventos
lgica de negcio
banco de base
Web
Service
framework J SF
Core JavaServer Faces - Captulo 01_2.indd 24 10/05/2012 18:12:15

Vous aimerez peut-être aussi