Tag Archive: J2EE


Este es el primero de una serie de tutoriales que pretendo publicar acerca de ir creando aplicaciones utilizando JSF 2.1.Intentaré centrarme en cómo se hacen ciertas tareas e ir creando material nuevo que o bien sea difícil de encontrar en nuestro idioma o no se haya publicado nada al respecto en ningún otro idioma. Por ello, pondré enlaces de recomendada lectura que vean que pueden aclarar conceptos, ya que es una tontería volver a publicar algo que esté bien explicado en otro lado.

Cómo primer objetivo, será entender el ciclo de vida y el proceso de creación de una aplicación sencilla en JSF, pero antes de nada, os recomiendo este enlace de adictos al trabajo  en el que se explican todos los conceptos de JSF sin entrar en mucho detalle.

Vamos a comenzar por crear un proyecto, para esta serie de tutoriales usaremos Netbeans 7.2 que ya viene incluido con soporte para JSF 2.1, un contenedor Tomcat 7.0.22 y soporte para Java EE6. Así que creamos un proyecto del tipo web application

Después hacemos las configuraciones del proyecto y pulsando Siguiente, hasta llegar a la elección de que frameworks queremos utilizar, entonces seleccionamos Java Server Faces

Ahora que tenemos el proyecto creado, vamos a crear un pequeño formulario para crear las estadísticas de un personaje de D&D. Necesitaremos  un backend bean, su diseño en facelet (XHTML) y una clase POJO para representar al personaje. Al final del articulo, encontrareis el proyecto que tiene la siguiente estructura:

Podréis observar las impresiones en consola que se hacen en los diferentes métodos, para que veamos y comprendamos mejor el ciclo de vida JSF aplicado al funcionamiento de una aplicación.

Así que vamos a echarle un ojo a la siguiente imagen del ciclo de vida:

ciclo de vida

Cómo podemos ver, tenemos diferentes fases, que en el enlace de adictos al trabajo se explica muy bien:

  1. Restaurar los conponentes de la vista (restore view). En esta etapa el controlador construye en memoria la estructura de componentes de la página.
  2. Aplicar los valores de la petición.. (apply request values). En esta etapa se recuperan los valores de la request y se asignan a los beans de la página.
  3. Procesamiento de las validaciones (process validations). Se verifican los parámetros de entrada según un conjunto de reglas definidas en un fichero de configuración.
  4. Actualizar los valores del modelo (update model values). Los valores leídos y validados son cargados en los beans.
  5. Invocacion a la aplicación (invoke application). Se ejecutan las acciones y eventos solicitados para la página. Si es necesario se realiza la navegación.
  6. Generación de la página (render response). En esta fase se genera la página que será enviada al usuario con todos sus elementos y valores actualizados.

Entonces, cómo afecta esto a nuestro proyecto?  Al  llamar por primera vez a la página, sólo se ejecutan las dos primeras fases, debido a que no hay información de la petición para relllenar el modelo.  Ahora el usuario rellena los datos y pueden ocurrir dos cosas, que haya algún error de validación, en cuyo caso no pasará del paso de validación y no se rellenará el modelo (nunca se ejecuta el setter) ni se ejecutará ninguna acción (no se ejecuta el método save() ). O bien que todo esté correcto, entonces ejecutará el siguiente paso de actualizar los valores del modelo y si no hay ningún error en este paso, se pasarían a ejecutar las invocaciones de los eventos, en este caso, se ejecutaría el método save().

También se puede ver, que el getter en el backend bean, se llama una vez por cada propiedad de la clase POJO, ya que a través de este getter obtenemos la clase POJO, por lo que si lo estuviéramos obteniendo con una consulta a una base de datos o algún otro método costoso, habrá que guardarlo en una variable del bean.

Por supuesto, esto se puede complicar más, porque habrá que tener en cuenta que ocurre cuando hay listeners  de por medio. Pero eso lo dejamos para otra entrada.

El proyecto entero, podeis descargarlo desde aquí.

Desde hace unos meses que comencé a enredar con Icefaces 3, me topé con un problema al utilizar uno de los componentes más potentes para formularios. Se trata del componente  ace:dateTimeEntry,  para tener una bonita presentación a la hora de introducir fechas y horas en los formularios. El componente, dispone de dos formatos de presentación, el primero establece el calendario en bruto en la página y el segundo, y más útil, nos muestra un campo de texto que al recibir el foco, muestra un popup con el calendario para introducir la fecha. Un ejemplo de uso de esta esta segunda forma de renderización es la siguiente:

<ace:dateTimeEntry id="cal"
value="#{bean.persona.fechaNacimiento}"
timeZone="Canada/Mountain"
pattern="dd/MM/yyyy"
navigator="true"
yearRange="1940:1980"
renderAsPopup="true"/>

Con el atributo renderAsPopup , conseguimos que se renderice como un popup. Para el resto de opciones, aunque se explican por sí solas, podeis ver cómo funcionan en el showcase de icefaces. Una vez presentado el componente, vamos a ver el problema que me surgía y hasta la semana pasada no he conseguido dar con el origen. Cuando renderizaba el componente de esta forma,  el popup se mostraba, pero al realizar una navegación y volver al formulario, el popup con el calendario dejaba de mostrarse.  Después de mucho darle vueltas al porqué y preguntar en el foro de icesoft(sin mucho éxito), conseguí dar con el problema. Lo primero que hay que tener en cuenta, esque en Icefaces trabaja completamente con Ajax, con lo cual, cuando realizamos una actualización de sección, solo refresca la partede la página que ha cambiado. Para ello, el servidor envia como respuesta un XML con los cambios que ha habido. Entonces, en algunas páginas, esta respuesta, hacía cambiar el body entero, con una respuesta parecida a esta:

<div><partial-response></div>
<div><changes></div>
<update id="javax.faces.ViewBody"><body title=""><div id="header">...

En el momento que aparece <update id=”javax.faces.ViewBody”>, se nos fastidia el popup de dateTimeEntry, debería de aparecer un id de los que hayamos puesto nosotros. Tras revisar y revisar el código, el fallo está en algo bastante tonto, pero no trivial. Resulta que en las plantillas, para organizar las secciones de cada página, lo tenía dividido utilizando divs y algún que otro table, sin asignarle un id.  Y JSF, para detectar los cambios que hay en el DOM cuando cambiamos de navegación, utiliza los id para localizar que parte tiene que sustituir, así que asignandole un id, debería bastar, pero aún así, se dan comportamientos extraños. Por lo que lo mejor, es utilizar las etiquetas propias de JSF para organizar el código, que luego se sustituira en el cliente por un div.

De forma que para arreglar este error y evitar otros posibles funcionamientos erráticos, habría que sustituir (si tenemos algo parecido) esto:


<div id="content">

<ui:insert name="content"></ui:insert>

</div>

&nbsp;

&nbsp;

Por esto otro:


<h:panelGroup layout="block" id="content">

<ui:insert name="content"></ui:insert>

</h:panelGroup>

Y siempre, siempre, siempre, asignarle un id a los panelGroup, para que JSF encuentre correctamente donde tiene que sustituir al hacer cambios en el DOM.

Tras unos días jugueteando con OpenXava, he visto las posibilidades que tiene, para crear aplicaciones muy rapidamente. Así que he decidido compartir unos pequeños tips, para crear configurar un entorno que nos permita empezar a crear rápidamente aplicaciones.

Paso 1: Descargar OpenXava

El primer paso y más obvio, es descargar OpenXava, actualmente en su versión 4m2. Podeis hacerlo directamente desde su página o pulsando en el enlace que os ofrezco.

Paso 2: Descargar Eclipse

Bueno, este paso no siempre es necesario si ya teneis un Eclipse descargado, solo aseguraos de que es la versión con soporte para JEE, para poder tener las vistas y librerías necesarias. Podeis descargarlos Aqui

Paso 3: Leeros la documentación oficial

Antes de seguir paso a paso, recomiendo que leais la guía de referencia que viene en la wiki de OpenXava, sobre como crear el primer proyecto. Aunque los pasos que daremos aqui, serán algo diferentes.

Paso 4: Pasar a un workspace más quirurgico.

Si seguimos los pasos de la guía de referencia, esta nos indica que cambiemos el workspace al que viene dentro de la carpeta que descargamos, pero esto no siempre es deseable, ya sea por prefrencias personales, para mantener un orden, o porque después realmente, los ejemplos de openxava no nos interesa tenerlos por ahi pululando.
Así que vamos a personalizar nuestro entorno para empezar a crear aplicaciones OpenXava.

Del arbol de directorios de la carpeta de OpenXava que nos descargamos, dentro del workspace que viene, solo son necesarias dos carpetas de proyectos, que son la de OpenXava y OpenXavaPlantilla.
OpenXava es el proyecto base, sobre el que se apoyaran todas nuestras aplicaciones, y OpenXavaPlantilla, como su nombre indica, es la plantilla para crear nuevos proyectos.
Lo que tenemos que hacer, es copiar esas dos carpetas al workspace que queramos, ya sea el que utilizamos habitualmente, o en uno nuevo y vacio, para dedicarlo solo a las aplicaciones que desarrollemos con este framework.

Una vez tenemos esto, solo tenemos que arrancar Eclipse, y señalar a este nuevo workspace creado.  En caso de que no reconozca los dos proyectos, tendremos que crear un nuevo proyecto desde los directorios copiados.
File > New > Project… > Java Project
Y marcamos la opción de Create Project from existing source, y buscamos la carpeta, le asignamos un nombre al proyecto, preferiblemente el mismo que la carpeta contenedora (vamos, OpenXava y OpenXavaPlantilla)
Con esto, ya tenemos nuestro entorno listo.

Paso 5: Asociar el servidor tomcat a Eclipse

El último paso para tener nuestro entorno listo, es asociar el servidor tomcat a eclipse. Haciendo esto, nos ahorramos tener que estar lanzando los scripts para lanzar/parar el servidor, ya que podemos hacerlo directamente desde Eclipse, y también podremos utilizar el depurador. Lo primero, es poner la carpeta de Tomcat que viene con OpenXava en un lugar que nos resulte apropiado, eso a conveniencia de cada uno.  Ahora solo nos queda asociar el servidor, para ello abrimos la pestaña de servidores ( Window > Show view > Others… > Servers), dentro de la pestañita, pulsamos con el botón derecho y New > Server , ahora seleccionamos Apache Tomcat 6.0 y le damos a siguiente, nos pedirá configurar un RuntimeTime Enviorment para ese server, así que le indicamos un nombre y buscamos la carpeta del tomcat que copiamos, y le damos a finalizar.

Con estos pasos, ya tenemos nuestro entorno listo para crear una nueva aplicación con OpenXava y poder ejecutarla en nuestro servidor. Próximamente, publicaré como crear la primera aplicación OpenXava utilizando MySQL como gestor de base de datos.

Enlaces:

Buscando en la red herramientas de desarrollo rápido, para que nos endendamos, un tipo de herramienta que nos genere código y nos ayude a crear aplicaciones lo más rápido posible. Según la wikipedia, netbeans sería una herramienta de desarrollo rápido, y la verdad que este famoso IDE nos ayuda muchisimo a crear aplicaciones con unos pocos clicks y unas cuantas lineas de código que escribamos nosotros.

La herramienta que he encontrado, se llama OpenXava y nos permite crear aplicaciones web de gestión en escasos minutos. Nos podemos olvidar de tener que generar las tablas para la base dedatos, así como todo el tema de inserción modificación y eliminación de la base de datos. OpenXava se encarga de estas gestiones mediante JPA, aparte, también nos crea la parte de vista y controlador. Practicamente nos hace todo el trabajo, nosotros solo tenemos que escribir unas clases POJO y añadirles unas anotaciones para la persistencia, y en pocos segundos, obtendremos una aplicación funcional, ahorrandonos muchas horas y muchos quebraderos de cabeza.

Os recomiendo que le echeis un vistazo a sus ejemplos, para que veais su potencial:

http://www.openxava.org/web/guest/demos

Bueno, después de unas cuantas semanas sin postear, volvemos con las pilas recargadas. Vamos a empezar con un pequeño tutorial, para introducir informes creados con Jasper Reports en nuestras aplicaciones webs usando el framework Struts 2.

Para este tutorial, vamos a presuponer que se saben crear informes con jasper report (mejor, si utilizamos la herramienta iReport) y que tenemos ya montada una aplicación con Struts 2.

Lo primero que tenemos que hacer, es importar tantos las librerías de Jasper repots como el plugin para struts 2. El jar del pluggin lo podreís encontrar, con las librerias de struts 2, se llama struts2-jasperreports-plugin-2.1.x.jar , como veis, es muy facil identificarla.  Para ver que librerias necesitais de jasper report, podeis remitiros a la documentación oficial.

Una vez importadas las librerias, lo siguiente, sería abrir nuestro fichero de configuración struts.xml y hacer que el package en el que está la acción que nos mostrará el report, incluya el soporte para interpretar los informes:


<package name="default" namespace="/" extends="struts-default,json-default,jasperreports-default">

 <action name="Certificados">
 <result name="success" type="jasper">
 <param name="location">informes/report3.jasper</param>
 <param name="dataSource">resultados</param>
 <param name="format">PDF</param>
 <param name="reportParameters">params</param>
 </result>

 <result name="informe2" type="jasper">
 <param name="location">informes/peticion_justificacion.jasper</param>
 <param name="connection">conexion</param>
 <param name="format">PDF</param>
 <param name="reportParameters">params</param>
 </result>
 </action>
 </package>

Como podemos ver, el paquete, extiende la clase jasperreports-default , con lo que las acciones podrán devolver resultados del tipo jasper, para poder imprimir nuestros informes.  Después de eso, podeis ver dos acciones, y es de notar que el tipo es  jasper, con lo cual, ya se entiende, que es un informe.  Las acciones,  tienen que llevar los siguientes parámetros de forma obligatoria:

  • location: es la localización del informe compilado que queremos que se ejecute como resultado.
  • datasource : podemos especificar el nombre de una propiedade de la acción, que deberá devolver una colección de beans, de la cual queremos extraer las propiedades.
  • connection: pondremos el nombre de una propiedade de la acción que devuelva una conexión a la base de datos, que usará el report para conectarse y ejecutar la sentencia que lleve este implicita.

Entre datasource y connection, solo hace falta especificar una de las dos. En el código de ejemplo, hay dos parámetros más:

  • format: Será el formato de salida del informe, podrá ser PDF o cualquier otro que permita Jasper Report, (ver la documentación oficial)
  • reportParameters: Será un mapa, con una lista de parámetros que se utilizará dentro del report, por ejemplo para parametrizar la consulta del report.

Ahora solo nos queda ver, el código de una acción, que como veremos a continuación, puede llegar a ser muy simple:


public class CertificadosAction extends ActionSupport implements ApplicationAware{
private Collection resultados;
private Map<String,Object> app;
private Map<String,Object> params;

@Override
public String execute(){
ProxyBD proxy = (ProxyBD)app.get("db"); // Un objeto que envuelve la conexión
resultados = proxy.getDatos();
params = new HashMap<String,Object>();

params.put("param1","dato 1");
params.put("fecha",new Date());

return SUCCESS;
}

public Connection getConexion(){
ProxyBD proxy = (ProxyBD)app.get("db");
return  proxy.getConnection();
}

public Map getParams(){
return params;
}
public Collection getResultados(){
return resultados;
}

public void setApplication(Map<String, Object> arg0) {
app = arg0;
}
}

Como se puede ver, para un informe sencillo, el código de la acción es realmente reducido, incluso para informes más complejos, no es necesario complicar mucho más la acción. Se puede ver, que tiene varios atributos,  uno los resultados, que sería el datasource para el informe, otro son los parámetros adicionales que se desean enviar al report y por último, la conexión, de forma que esta misma acción, se puede reutilizar para diferentes report, dependiendo del resultado de la acción.

De momento, esto es todo por ahora,  en próximas entregas veremos como tratar con subreports sin perder la cabeza y algún que otro truquillo más.

Enlaces: