Introducción a la Tecnología JavaServer Faces

Esta secci�n describe el proceso de desarrollo de una sencilla aplicaci�n JavaServer Faces. Veremos qu� caracter�sticas contiene una t�pica aplicaci�n JavaServer Faces, y qu� hace cada rol en el desarrollo de la aplicaci�n.

.�Pasos del Proceso de Desarrollo

Desarrollar una sencilla aplicaci�n JavaServer Faces requiere la realizaci�n de estos pasos:

  • Desarrollar los objetos del modelo, los que contendr�n los datos.
  • A�adir las declaraciones del bean controlado al fichero de configuraci�n de la aplicaci�n.
  • Crear las p�ginas utilizando las etiquetas de componentes UI y las etiquetas "core".
  • Definir la navegaci�n entre las p�ginas.

Estas tareas se pueden realizar simult�neamente o en cualquier orden. Sin embargo, la gente que realice las tareas necesitar� comunicarse durante el proceso de desarrollo. Por ejemplo, el autor de las p�ginas necesita saber los nombres de los objetos del modelo para poder acceder a ellos desde la p�gina.

Este ejemplo nos pedir� que adivinemos un n�mero del 0 al 10, ambos inclusives. La segunda p�gina nos dir� si hemos acertado. El ejemplo tambi�n chequea la validez de nuestra entrada.

.�Desarrollar los Objetos del Modelo

Desarrollar los objetos del modelo es responsabilidad del desarrollador de aplicaciones. El autor de las p�ginas y el desarrollador de aplicaciones podr�an necesitar trabajar juntos para asegurarse que las etiquetas de componentes se refieren a las propiedades del objeto apropiado, que las propiedades del objeto son de los tipos apropiados, y para tener cuidado de otros detalles.

Aqu� tenemos la clase UserNumberBean.java que contiene los datos introducidos en el campo de texto de la p�gina greeting.jsp:

package guessNumber;
import java.util.Random;

public class UserNumberBean {
    Integer userNumber = null;
    Integer randomInt = null;
    String response = null;
    
    public UserNumberBean () {
        Random randomGR = new Random();
        randomInt = new Integer(randomGR.nextInt(10));
        System.out.println("Duke�s Number: "+randomInt);
    }

    public void setUserNumber(Integer user_number) {
        userNumber = user_number;
        System.out.println("Set userNumber " + userNumber);
    }

    public Integer getUserNumber() {
        System.out.println("get userNumber " + userNumber);
        return userNumber;
    }

    public String getResponse() {
        if(userNumber.compareTo(randomInt) == 0)
            return "Yay! You got it!";
        else
            return "Sorry, "+userNumber+" is incorrect.";
    }
}

Como podemos ver, este bean es como cualquier otro componente JavaBeans. Tiene un m�todo set o accesor y un campo privado o propiedad. Esto significa que podemos concebir referenciar beans que ya hayamos escrito desde nuestras p�ginas JavaServer Faces.

Dependiendo del tipo de componente que referencia una propiedad del objeto del modelo, esta propiedad puede ser de cualquiera de los tipos b�sicos primitivos y los tipos referencia. Esto incluye cualquiera de los tipos num�ricos, String, int, double, y float. La tecnolog�a JavaServer Faces convertir� autom�ticamente el dato al tipo especificado por la propiedaded del objeto del modelo.

Tambi�n podemos aplicar una conversi�n a un componente para convertir los valores de los componentes a un tipo que no est� soportado por el componente.

En el UserNumberBean, la propiedad userNumber es del tipo Integer. La implementaci�n de JavaServer Faces puede convertir el String de los par�metros de la solicitud que contiene este valor a un Integer antes de actualizar la propiedad del objeto del modelo cuando utilicemos una etiqueta input_number. Aunque este ejemplo lo convierte a un Integer, en general, deber�amos utilizar tipos nativos en vez de utilizar las clases envoltura (int en lugar de Integer).

.�A�adir las Declaraciones del Bean Controlado

Despu�s de desarrollar los beans utilizados en la aplicaci�n, necesitamos a�adir declaraciones para ellos en el fichero de configuraci�n de la aplicaci�n. Cualquier miembro del equipo de desarrollo puede realizar la trarea de a�adir las declaracones al fichero de configuraci�n de la aplicaci�n. Aqu� tenemos la declaraci�n de bean controlado para UserNumberBean:


<managed-bean>
    <managed-bean-name>UserNumberBean</managed-bean-name>
        <managed-bean-class>
            guessNumber.UserNumberBean
        </managed-bean-class>
    <managed-bean-scope>session</managed-bean-scope>
</managed-bean>

La implementaci�n de JavaServer Faces procesa este fichero en el momento de arrancada de la aplicaci�n e inicializa el UserNumberBean y lo almacena en el �mbito de sesi�n. Entonces el bean estar� disponible para todas las p�ginas de la aplicaci�n. Para aquellos que est�n familiarizados con versiones anteriores, esta facilidad de "bean controlado" reemplaza la utilizaci�n de la etiqueta jsp:useBean.

.�Crear las P�ginas

La creacci�n de las p�ginas es responsabilidad del autor de p�ginas. Esta tarea implica distribuir los componentes UI en las p�ginas, mapear los componentes a los datos de los objetos del modelo, y a�adir otras etiquetas importanes (como etiquetas del validador) a las etiquetas de los componentes. Aqu� tenemos la p�gina greeting.jsp con las etiquetas de validador (menos los HTML que lo rodea):


<HTML>
<HEAD> <title>Hello</title> </HEAD>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<body bgcolor="white">
<h:graphic_image id="wave_img" url="/wave.med.gif" />
<h2>Hi. My name is Duke.
I'm thinking of a number from 0 to 10.
Can you guess it?</h2>
<f:use_faces>
    <h:form id="helloForm" formName="helloForm" >
        <h:graphic_image id="wave_img" url="/wave.med.gif" />
        <h:input_number id="userNo" numberStyle="NUMBER"
            valueRef="UserNumberBean.userNumber">
            <f:validate_longrange minimum="0" maximum="10" />
        </h:input_number>
        <h:command_button id="submit" action="success"
            label="Submit" commandName="submit" /><p>
        <h:output_errors id="errors1" for="userNo"/>
    </h:form>
</f:use_faces>

Esta p�gina demuestra unas cuantas caracter�sticas importantes que utilizaremos en la mayor�a de nuestras aplicaciones JavaServer Faces:

  • La etiqueta form:

    Esta etiqueta representa un formulario de entrada, que permite al usuario introducir alg�n dato y enviarlo al servidor, normalmente pulsando un bot�n. Las etiquetas que representan los componentes que conforman el formulario se anidan dentro de la etiqueta form. Estas etiquetas son h:input_number y h:command_button.

  • La etiqueta input_number:

    Esta etiqueta representa un componente que es un campo de texto, dentro del que el usuario introduce un n�mero. Esta etiqueta tiene tres atributos: id, valueRef, y numberStyle. El atributo id es opcional y corresponde al identificador ID del componente. Si no incluimos uno, la implementaci�n JavaServer Faces generar� uno autom�ticamente.

    El atributo valueRef utiliza una expresi�n de referencia para referirse a la propiedad del objeto del modelo que contiene los datos introducidos en el campo de texto. La parte de la expresi�n que hay antes del "." debe corresponder con el nombre definido por el elemento managed-bean-name del bean controlado en el fichero de configuraci�n. La parte de la expresi�n que hay despu�s del "." debe corresponder con el nombre del elemento property-name correspondiente en la declaraci�n del propio bean controlado. En este ejemplo, no se declararon elementos property-name porque no se inicializaron propiedades en la arrancada de la aplicaci�n para este ejemplo.

    El atributo numberStyle indica el nombre del patr�n de estilo de n�mero definido seg�n la clase java.text.NumberFormat. Los valores v�lidos son: currency, integer, number, o percent.

  • La etiqueta validate_longrange:

    La etiqueta input_number tambi�n contiene una etiqueta validate_longrange, que es una del conjunto de etiquetas validadores est�ndar incluido con la implementaci�n de referencia de JavaServer Faces.

    Este validador chequea si el valor local de un componente est� dentro de un cierto rango. El valor debe ser cualquier cosa que se pueda convertir a long. Esta etiqueta tiene dos atributos, uno que especifica un valor m�nimo y otro que especifica un valor m�ximo. Aqu�, la etiqueta se utiliza para asegurarnos de que el n�mero introducido en el campo de texto es un n�mero entre el 0 y el 10.

  • La etiqueta command_button:

    Esta etiqueta representa el bot�n utilizado para enviar los datos introducidos en el campo de texto. El atributo action especifica una salida que facilita al mecanismo de navegaci�n la decisi�n de qu� p�gina abrir luego. La siguiente p�gina describe esto en m�s detalle.

  • La etiqueta output_errors:

    Esta etiqueta mostrar� un mensaje de error si el dato introducido en el campo de texto no cumple con las reglas especificadas por el validador. El mensaje de error se muestra en el lugar de la p�gina donde hayamos situado la etiqueta output_errors.

.�Definir las Navegaci�n por las P�ginas

Otra posibilidad que tiene el desarrollador de la aplicaci�n es definir la navegaci�n de p�ginas por la aplicaci�n, como qu� p�gina va despu�s de que el usuario pulse un bot�n para enviar un formulario.

El desarrollador de la aplicaci�n define la navegaci�n por la aplicaci�n mediante el fichero de configuraci�n, el mismo fichero en el que se declarar�n los beans manejados. Aqu� est�n las reglas de navegaci�n definidas para el ejemplo guessNumber:


<navigation-rule>
    <from-tree-id>/greeting.jsp</from-tree-id>
    <navigation-case>
        <from-outcome>success</from-outcome>
        <to-tree-id>/response.jsp</to-tree-id>
    </navigation-case>
</navigation-rule>
<navigation-rule>
    <from-tree-id>/response.jsp</from-tree-id>
        <navigation-case>
        <from-outcome>success</from-outcome>
        <to-tree-id>/greeting.jsp</to-tree-id>
    </navigation-case>
</navigation-rule>

Cada regla de navegaci�n define c�mo ir de una p�gina (especificada en el elemento from-tree-id) a otras p�ginas de la aplicaci�n. El elemento navigation-rule puede contener cualquier n�mero de elemento navigation-case, cada uno de los cuales define la p�gina que se abrir� luego (definida por to-tree-id) bas�ndose en una salida l�gica (definida mediante from-outcome).

La salida se puede definir mediante el atributo action del componente UICommand que env�a el formulario, como en el ejemplo guessNumber:


<h:command_button id="submit"
    action="success" label="Submit" />

La salida tambi�n puede venir del valor de retorno del m�todo invoke de un objeto Action. Este m�todo realiza alg�n procesamiento para determinar la salida. Un ejemplo es que el m�todo invoke puede chequear si la password que el usuario ha introducido en la p�gina corresponde con la del fichero. Si es as�, el m�todo invoke podr�a devolver "success"; si no es as�, podr�a devolver "failure". Un salida de "failure" podr�a resultar en la recarga de la p�gina de logon. Una salida de "success" podr�a resultar en que se mostrara una p�gina con las actividades de la tarjeta de cr�dito del usuario, por ejemplo.

COMPARTE ESTE ARTÍCULO

COMPARTIR EN FACEBOOK
COMPARTIR EN TWITTER
COMPARTIR EN LINKEDIN
COMPARTIR EN WHATSAPP
ARTÍCULO ANTERIOR