Estudo Inicial JSF

O objetivo deste post é explicar de maneira bem básica e introdutória o funcionamento do framework JSF.

 
 

Baseado no livro referenciado no rodapé e executando seus exemplos, teremos no capítulo 1 uma aplicação (login) que simula uma página de login:

 
 

  • <?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”&gt;
  • <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>

    (figura 1, página index.xhtml)

     
     

     
     

     
     

     
     

As tags usadas para montagem desta página são diferentes de tags HTML simples. Na verdade, o framework como parte do seu trabalho, renderiza por exemplo, a tag <h:inputText …> para <input type=”text”> do HTML, e isso porque por padrão, toda implementação JSF tem que disponibilizar um renderizador HTML. Para outros renderizadores, como WML, WAP etc, o JSF poderia reinderizar a(s) tag(s) acima citada(s) para outro resultado.

 
 

Outro ponto interessante de se notar é que no framework JSF não existe de maneira explícita o uso de servlets como controladores da aplicação. Quem faz o papel de controlador então são os Managed Beans. Abaixo demonstro o código referente ao mesmo exemplo contido no livro:

 
 

 
 

 
 

  • package com.corejsf;

     
     

  • import java.io.Serializable;
  • import javax.faces.bean.ManagedBean;
  • // or import javax.inject.Named;
  • import javax.faces.bean.SessionScoped;
  • // or import javax.enterprise.context.SessionScoped;

     
     

  • @ManagedBean(name=”user”) // or @Named(“user”)
  • @SessionScoped
  • public class UserBean implements Serializable {
  • private String name;
  • private String password;

     
     

  • public String getName() { return name; }
  • public void setName(String newValue) { name = newValue; }

     
     

  • public String getPassword() { return password; }
  • public void setPassword(String newValue) { password = newValue; }
  • }

    (figura 2)

 
 

Destacam-se os seguintes pontos:

 
 

  • Um managed bean é um java bean gerenciado pelo framework JSF.
  • O simples bean se torna um componente gerenciado pelo framework através da anotação @ManagedBean contida na linha 7.
  • Um bean tem seus campos (acima: name e password) e seus respectivos getters e setters. A princípio eles servem para armazenar e transportar valores. No caso do JSF os valores são transportados de e para as páginas XHTML.
  • Os valores armazenados em um determinado campo do bean é retornado para a página XHTML através de seu getter.
  • Os valores contidos em controles das páginas XHTML são enviados para o respectivo bean e o mesmo o armazena através de seu setter.
  • O que “liga” a página XHTML ao seu(s) respectivo(s) bean(s) é a expression language. Veja ilustração abaixo:

     
     

     
     

    No caso, dado o trecho de código da página XHTML (contida na figura 1)

     
     

    (figura 3)

     
     

  • O escopo de durabilidade do bean (Request, Session, Application) é definido através da anotação, no caso @SessionScoped contida na linha 8. Para este caso, o framework JSF armazenará este bean na session de um determinado usuário, fazendo com que o mesmo possa ser acessado a qualquer momento.
  • A navegabilidade neste caso se dá pelo atributo action de <h:commandButton> contido na linha 22 da página XHTML (figura 1). Neste caso, esta tag irá reinderizar para um botão na tela <input type=”button”> e ao clicar no mesmo, navegaremos para a página [welcome.xhtml]. O JSF supre automaticamente a extensão do arquivo.

 
 

Navegação por páginas XHTML (exemplo javaquiz)

 
 

Tradicionalmente, em páginas html temos um formulário <form> com o valor action setado para algum recurso no servidor tais como um servlet, ou um script VB (vbscript), ou um recurso CGI, etc , que serão responsáveis por receberem a requisição web, processá-la e devolvê-la como resposta. No framework JSF apesar de termos a tag <h:form>, esta não possui atributos relativos a navegação. O que define a navegação entre as páginas é o atributo ‘action’ da tag <h:commandButton value=”Login” action=”welcome”/>. Esta tag irá reinderizar para um <input type=”button”>

 
 

No exemplo acima (figura 1) o valor contido na tag action simplesmente redireciona para um novo formulário XHTML chamado welcome.xhtml.

 
 

O framework JSF não se limita a fazer redirecionamentos apenas através de nomes de arquivos XHTML. Notemos que a página XHTML ilustrada abaixo faz referência para o bean “quizBean” na expression language contida no atributo action da tag <h:commandButton> conforme destacado.

 
 

 
 

<?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”&gt;

<h:head>

<title>#{msgs.title}</title>

</h:head>

<h:body>

<h:form>

<p>#{quizBean.question}”</p>

<p><h:inputText value=”#{quizBean.response}”/></p>

<p>

<h:commandButton value=”#{msgs.checkAnswer}”

action=”#{quizBean.answerAction}”/>

</p>

</h:form>

</h:body>

</html>

(figura 4, página XHTML)

 
 

 
 

Através do retorno do método answerAction do quizBean e baseado nas configurações contidas no arquivo faces-config.xml (ilustrado na figura 6) conseguimos definir a navegação entre as páginas sem que tenhamos que compilar qualquer código em decorrencia de alguma mudança.

 
 

… (código suprimido)

@ManagedBean // or @Named

@SessionScoped

public class QuizBean implements Serializable {

… (código suprimido)

public String answerAction() {

tries++;

if (problems.get(currentProblem).isCorrect(response)) {

score++;

nextProblem();

if (currentProblem == problems.size()) return “done”;

else return “success”;

}

else if (tries == 1) return “again”;

else {

nextProblem();

if (currentProblem == problems.size()) return “done”;

else return “failure”;

}

}

… (código suprimido)

}

(figura 5, método no bean gerenciado quizBean)

 
 

 
 

 
 

  • <?xml version=”1.0″?>
  • <faces-config xmlns=”http://java.sun.com/xml/ns/javaee
  • xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance&#8221;
  • xsi:schemaLocation=”http://java.sun.com/xml/ns/javaee
  • http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd
  • version=”2.0″>
  • <navigation-rule>
  • <navigation-case>
  • <from-outcome>startOver</from-outcome>
  • <to-view-id>/index.xhtml</to-view-id>
  • </navigation-case>
  • </navigation-rule>
  • <navigation-rule>
  • <from-view-id>/again.xhtml</from-view-id>
  • <navigation-case>
  • <from-outcome>failure</from-outcome>
  • <to-view-id>/failure.xhtml</to-view-id>
  • </navigation-case>
  • </navigation-rule>
  • <navigation-rule>
  • <navigation-case>
  • <from-outcome>failure</from-outcome>
  • <to-view-id>/again.xhtml</to-view-id>
  • </navigation-case>
  • </navigation-rule>
  • <application>
  • <resource-bundle>
  • <base-name>com.corejsf.messages</base-name>
  • <var>msgs</var>
  • </resource-bundle>
  • </application>
  • </faces-config>

    (figura 6, Arquivo faces-config.xml)

 
 

 
 

Na figura 6, entre as linhas 21 a 24, a regra de navegação diz que caso o resultado do método de ação answerAction produza string ‘failure’, o framework redirecionará para página again.xhtml. Já, nas linhas 13 a 19, se tivermos como origem a página again.xhtml e o resultado do método for failure então o framework redirecionará para a página failure.xhtml.

 
 

 
 

 
 

 
 

 
 

Recomendações de leitura:

 
 

Livro: Core Java Server Faces

 
 

Os exemplos apresentados neste post podem ser baixados em:

http://corejsf.com

Capitulo 1 / tomcat / login

Capitulo 3 / tomcat / javaquiz

 
 

Esta entrada foi publicada em Java, Web com as etiquetas . ligação permanente.

Deixe uma Resposta

Preencha os seus detalhes abaixo ou clique num ícone para iniciar sessão:

Logótipo da WordPress.com

Está a comentar usando a sua conta WordPress.com Terminar Sessão / Alterar )

Imagem do Twitter

Está a comentar usando a sua conta Twitter Terminar Sessão / Alterar )

Facebook photo

Está a comentar usando a sua conta Facebook Terminar Sessão / Alterar )

Google+ photo

Está a comentar usando a sua conta Google+ Terminar Sessão / Alterar )

Connecting to %s