Navegação estática e dinâmica com JSF – Parte I
JSF(ou Java Server Faces) é uma tecnologia que incorpora características de um framework MVC para WEB e também as de um modelo de interfaces gráficas baseado em eventos. Por basear-se no padrão de projeto MVC, uma de suas melhores vantagens é a clara separação entre a visualização e regras de negócio (modelo).
O controller é composto pelo FacesServlet por arquivos de configuração e por um conjunto de manipuladores de ações e observadores de eventos.
O FacesServlet é responsável por receber requisições da WEB, redirecioná-las para o modelo e então remeter uma resposta
Os arquivos de configuração são responsáveis por realizar associações e mapeamentos de ações e pela definição de regras de navegação.
Os manipuladores de eventos são responsáveis por receber os dados vindos da camada de visualização, acessar o modelo, e então devolver o resultado para o FacesServlet
O modelo representa os objetos de negócio e executa uma lógica de negócio ao receber os dados vindos da camada de visualização.
A visualização é composta por component trees (hierarquia de componentes UI), tornando possível unir um componente ao outro para formar interfaces mais complexas.
Após essa breve introdução do que é o Java Server Faces, vamos agora criar um exemplo bem simples com pra demonstrar o uso do mesmo.
Aplicação de exemplo esta dividida em duas partes e embora não seja uma aplicação real, o exemplo permite ter uma noção de alguns recursos do JSF, outros serão explorados em outros tutoriais.
Nessa primeira etapa veremos um exemplo de navegação estática com JSF:
Nossa aplicação será composta de dois formulários, o segundo formulário que ao ser submetido, terá um Bean é instanciado e um método action controller invocado, retornando então uma condição que resultara em uma resposta que será mostrada ao usuário.
Primeiro vamos configurar o arquivo faces-config.xml
<?xml version="1.0"?>
<!DOCTYPE faces-config PUBLIC "-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.1//EN" "http://java.sun.com/dtd/web-facesconfig_1_1.dtd">
<faces-config>
<navigation-rule>
<from-view-id>/registrar1.jsp</from-view-id>
<navigation-case>
<from-outcome>registrar</from-outcome>
<to-view-id>/WEB-INF/respostas/resultado1.jsp</to-view-id>
</navigation-case>
</navigation-rule>
</faces-config>
Agora crie um arquivo .jsp de nome index.jsp:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!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>Registrar</title>
</head>
<body>
<a href="registrar1.faces">Registrar1 - Exemplo de Navegação Estática</a><br>
<a href="registrar2.faces">Registrar2 - Exemplo de Navegação Dinâmica</a>
</body>
</html>
registrar1.jsp
<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title></title>
</head>
<body>
<f:view>
<h1> Criação de nova Conta</h1>
<h:form>
Email: <h:inputText />
Senha: <h:inputSecret />
<h:commandButton value="Submeter" action="registrar" /> </h:form>
</f:view>
</body>
</html>
O arquivo resultado1.jsp deve ser criado dento da pasta WEB-INF, pois assim evitamos que ele seja acessado diretamente pelo usuário. Crie uma pasta de nome resultados em WEB-INF e dentro dela crie o arquivo.
WEB-INF/resultados/resultado1.jsp:
<%@page pageEncoding="UTF-8" contentType="text/html; charset=UTF-8" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Sucesso!!!</title>
</head>
<body>
<CENTER>
<h1>Successo</h1>
<H2>Seu registro foi realizado com sucesso<BR>
(Versão 1)</H2>
</CENTER>
</body>
</html>
Por último, mas não menos importante, vamos agora alterar o web.xml.
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"
version="2.4">
<display-name>Navegacao</display-name>
<!-- servlet -->
<servlet>
<servlet-name>FacesServlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<!-- servlet-mapping -->
<servlet-mapping>
<servlet-name>FacesServlet</servlet-name>
<url-pattern>*.faces</url-pattern>
</servlet-mapping>
<!-- The Usual Welcome File List -->
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
Agora vamos proteger algumas paginas, como você já deve ter percebido protegemos a pagina resultados de acesso direto pelo usuário, você deve então se perguntar, então devo colocar todos os JSPs em WEB-INF ?
A resposta é: NÃO.
Para proteger outras paginas do sistema de acesso direto, simplesmente acrescente as linhas abaixo no seu web.xml:
<security-constraint>
<display-name>
Previnindo acesso direto a paginas JSP
</display-name>
<web-resource-collection>
<web-resource-name>Raw-JSF-JSP-Pages</web-resource-name>
<!-- Adicione o caminho para cada arquivo .jsp -->
<url-pattern>/welcome.jsp</url-pattern>
<url-pattern>/registrar1.jsp</url-pattern>
</web-resource-collection>
<auth-constraint>
<description>Sem regras, apenas bloqueio acesso direto aos JSPs</description>
</auth-constraint>
</security-constraint>
Figura1.
Figura2.
Figura3.
Agora caso algum usuário tente acessar, por exemplo, a pagina registrar1.faces diretamente ele ira se deparar a uma tela semelhante a da Figura 4.
Figura 4.
Na segunda etapa deste artigo quando um usuário submeter o formulário ele terá duas respostas, iremos fazer uma introdução aos Actions controllers.
Este artigo teve como inspiração os livros Core Servlets de Marty Hall.