Arquivo de August 2007

Aug 27 2007

Java Server Faces 1.2 Hello World

Publicado por Henrique Lima e arquivado em Java Server Faces

Requisitos

Será necessário o conhecimento dos seguintes itens para a criarmos nosso primeiro exemplo:

  1. Nível básico de conhecimento de orientação a objetos utilizando Java.
  2. Nível básico de conhecimento na criação de aplicações WEB utilizando Tomcat, de preferência versão 6.0.
  3. Manipulação de bibliotecas jar. (Utilizando IDE ou não).
  4. Nível básico de conhecimento de HTML e XML.

Configurando o ambiente

Para rodar aplicações Java Server Faces 1.2 é necessário um container que implemente a especificação da JSP 2.1.

Para este tutorial iremos utilizar o container Tomcat 6.0.
Download: http://tomcat.apache.org/download-60.cgi

Serão necessários 8 arquivos jars que devem estar no classpath ou no diretorio WEB-INF/lib de sua aplicação WEB, são eles:

Para que o Java Server Faces funcione adequadamente se faz necessário a configuração do Faces Servlet para que este
atenda às requisições das páginas JSF. A Listagem 1 mostra um exemplo de configuração do web.xml.

Listagem 1

<?xml version="1.0" encoding="UTF-8"?><web-app version="2.5"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/webapp_2_5.xsd">
<context-param>
 	<param-name>com.sun.faces.verifyObjects</param-name>

 	<param-value>true</param-value>

</context-param>

<context-param>

 	<param-name>com.sun.faces.validateXml</param-name>

 	<param-value>true</param-value>

</context-param>

<context-param>

 	<param-name>javax.faces.STATE_SAVING_METHOD</param-name>

 	<param-value>client</param-value>

</context-param>

<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>faces/index.jsp</welcome-file>

</welcome-file-list>

</web-app>

Como pode-se observar foram configurados 3 parâmetros de contexto. A utilidade destes será descrita a seguir:

  • com.sun.faces.verifyObjects
    Esta flag é configurada como true quando se quer que implementação do Java Server Faces verifique se os objetos da aplicação
    (conversores, etc) foram criados adequadamente. Seu valor padrão é false, por afetar a performance no início da execução
    da aplicação.
  • com.sun.faces.validateXml
    Esta flag é configurada como true quando se quer que a implementação do Java Server Faces verifique a integridade do arquivo
    faces-config.xml em função do seu DTD correspondente. Seu valor padrão é false.
  • javax.faces.STATE_SAVING_METHOD
    Esta flag é usada para configurar em que lado da aplicação o estado da “view” deve ser salvo.
    Existem 2 valores possíveis: server e client. Quando configurado como client o estado de toda camada de visão será renderizado
    em um campo hidden na página jsp. Seu valor padrão é server.

Criando o Bean Gerenciado (Managed Bean ou Backing Bean)

O Bean Gerenciado é a camada de negócios das aplicações JSF. Sua principal função é compartilhar seus atributos e métodos
com as páginas JSP. Cada campo de um formulário da página JSP é integrado com uma atributo e cada ação e/ou evento
com um método do Bean Gerenciado, resultando numa ótima separação da camada de negócio da camada de visão. Crie no
pacote br.com.jsftutorial o arquivo HelloWorldBean.java conforme demostra a listagem 2.

Listagem 2

package br.com.jsftutorial;public class HelloWorldBean {private String nome;

public HelloWorldBean() {

}

public String getNome() {

return nome;

}

public void setNome(String nome) {

this.nome = nome;

}

public String acao() {

return "sucesso";

}

}

Todo Bean Gerenciado deve possuir o construtor default (sem nenhum argumento), do contrário será lançado uma java.lang.InstantiationException.
Todo atributo integrado à página JSP deverá possuir seus métodos setters e getters mesmo que seu modificador de visibilidade
seja public, como por exemplo o atributo nome do HelloWorldBean.

Configurando o Bean Gerenciado no faces-config.xml

O arquivo faces-config.xml é o arquivo de configuração do Java Server Faces.
Este arquivo deve estar na pasta WEB-INF/ de sua aplicação e contém entre outras configurações as declarações dos Beans Gerenciados que deverão ser instanciados pela
implementação do JSF. Na listagem 3 é apresentado um modelo típico de configuração de um Bean Gerenciado.

Listagem 3

<?xml version='1.0' encoding='UTF-8'?>
<faces-config version="1.2"
 	xmlns="http://java.sun.com/xml/ns/javaee"
 	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

 	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
 	http://java.sun.com/xml/ns/javaee/webfacesconfig_1_2.xsd">

<managed-bean>

<managed-bean-name>hwBean</managed-bean-name>

<managed-bean-class>br.com.jsftutorial.HelloWorldBean</managed-bean-class>

<managed-bean-scope>request</managed-bean-scope>

</managed-bean>

</faces-config>

Entre as tags <faces-config> e </faces-config> se localizam toda a configuração da aplicação JSF.
A configuração necessária para um Bean Gerenciado é bem intuitiva, abaixo segue a descrição das tags utilizadas:

  • managed-bean
    Toda a configuração de um, e apenas um, Bean Gerenciado deve estar contido nesta tag.
  • managed-bean-name
    Nome utilizado para referenciar o Bean Gerenciado nas páginas JSP.
  • managed-bean-class
    O caminho completo para a classe que representa este Bean Gerenciado.
  • Managed-bean-scope
    Indica de qual escopo (scope) este Bean Gerenciado será resgatado. Existem 4 tipos possíveis.

    • none
      Só poderá ser utilizado como propriedade de um outro managed bean.
    • request
      Estará disponível através do request, ou seja, seu tempo de vida acaba após a submissão do formulário.
    • session
      Estará disponível através da session, ou seja, seu tempo de vida é o mesmo que o tempo de vida da session configurada no web.xml.
    • application
      Estará disponível através do objeto application, ou seja, seu tempo de vida é o mesmo da aplicação.

Existem outras tags que adicionam funcionalidades ao Bean Gerenciado, aconselho a utilizar o
Java (TM) EE 5 tutorial capítulo 5 item Backing Beans que pode ser acessado
através da url http://java.sun.com/javaee/5/docs/tutorial/doc/.

Criando o index.jsp

Crie a página index.jsp na pasta de arquivos WEB (mesma altura que WEB-INF/ e META-INF/) de sua aplicação com o conteúdo da Listagem 4.

Listagem 4

<%@page contentType="text/html"%><%@page pageEncoding="UTF-8"%>

<%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>

<%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Java Server Faces Tutorial</title>

</head>

<body>

	<f:view>


<h:form id=”formulario”>

<b>Nome:</b>

<h:inputText id=”nome” value=”#{hwBean.nome}” required=”true” requiredMessage=”O campo nome deve ser preenchido!”/>

<h:commandButton value=”GO” action=”#{hwBean.acao}” /><br>

<h:message for=”nome” errorStyle=”color:red”/>

</h:form>

</f:view>

</body>

</html>

Nas linhas 3 e 4 temos as declarações das taglibs core e html do Java Server Faces que serão utilizadas para criarmos os
componentes na página JSP.

A tag <f:view> deve conter os componentes JSF.

A tag <h:form> é análogo a tag <form> do html.

Através da tag <h:inputText> será criado um componente input do html e do tipo text (<input type=”text”>).
O atributo value permite integrar o valor deste componente a uma propriedade do Managed Bean, ou seja, quando o formulário for
submetido o valor deste componente será copiado para a propriedade “nome” do Managed Bean configurado no faces-config.xml
cujo o nome foi configurado como hwBean (<managedbean-name>hwBean</managed-bean-name>). O atributo
required determina que o formulário não poderá ser submetido caso este campo não seja preenchido.
O atributo requiredMessage determina a mensagem de erro que será apresentada caso, ao submeter o formulário, este componente não seja preenchido.

Através da tag <h:commandButton> será criado um componente button do html (<input type=”button”>).
O atributo action determina o método do Managed Bean que será executado quando este botão for pressionado.

A tag <h:message> é um componente utilizado para apresentar as mensagens ao usuário. O atributo “for” deve ser
preenchido com o id do componente que desejamos que esta mensagem seja integrada, ou seja, serão apresentadas as
mensagens referentes apenas ao campo cujo o id é “nome” do formulário. O atributo errorStyle permite aplicarmos um estilo
CSS ao componente quando a mensagem for de erro.

Criando o resultado.jsp

Crie a página resultado.jsp na pasta de arquivos WEB (mesma altura que WEB-INF/ e META-INF/) de sua aplicação com o conteúdo da Listagem 5.

Listagem 5

<%@page contentType="text/html"%><%@page pageEncoding="UTF-8"%>

<%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>

<%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Java Server Faces Tutorial</title>

</head>

<body>

<f:view>

Ola, <h:outputText value="#{hwBean.nome}" />!

</f:view>

</body>

</html>

Criando o fluxo do aplicativo

Para determinarmos o fluxo do aplicativo adicionamos uma “navigation rule” ao faces-config.xml.
Ao executarmos o método acao() do Managed Bean, a String “sucesso” será retornada e pela “navigation rule” determinamos que a página resultado.jsp
deverá ser apresentada. A listagem 6 demonstra o conteúdo do faces-config.xml.

Listagem 6

<?xml version='1.0' encoding='UTF-8'?>
<faces-config version="1.2"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/webfacesconfig_1_2.xsd">


<managed-bean>

<managed-bean-name>hwBean</managed-bean-name>

<managed-bean-class>br.com.jsftutorial.HelloWorldBean</managed-bean-class>

<managed-bean-scope>none</managed-bean-scope>

</managed-bean>

<navigation-rule>

<navigation-case>

<from-outcome>sucesso</from-outcome>

<to-view-id>/resultado.jsp</to-view-id>

</navigation-case>

</navigation-rule>

</faces-config>


Após a submissão do formulário, a propriedade “nome” do Managed Bean terá o valor digitado no componente <h:inputText> do index.jsp,

então a página resultado.jsp será apresentada (conforme configurado no faces-config.xml).

Para testar a aplicação inicie o tomcat e acesse a url: http://localhost:8080/HelloJSF/faces/index.jsp


Próximos Passos


Existem ainda diversos recursos e componentes do JSF, aconselho a leitura da referência da API,

acessando a url http://java.sun.com/javaee/javaserverfaces/reference/api/index.html.

Além disso, existem outras ótimas implementações que disponibilizam novos componentes e

recursos como a utilização de Ajax e DOM na renderização das páginas. Recomendo o estudo do IceFaces e do Ajax4Jsf, ambos open source.


Conclusão


Apesar de muita discussão sobre a qualidade dos diversos frameworks open source do mercado, Java Server Faces se apresenta

como uma ótima opção no desenvolvimento de interfaces para aplicações JEE. Com a inclusão deste framework na JEE 5,

existe uma grande tendência ao crescimento de sua utilização o que torna indispensável o conhecimento de seus recursos e

de suas diversas implementações. Neste tutorial foi abordado o conceito básico do funcionamento deste framework e em

uma nova oportunidade voltarei a escrever sobre esta tecnologia. Até lá.

			


			

				Comments
Nenhum comentário »