hernandezblasantonio/pw/documentacion/desarrollo/javaee/tomcat/practicas

Prácticas

Para el desarrollo de las siguientes prácticas ya debes de contar con la instalación y configuración de Apache Tomcat Eclipse. Deten la ejecución de Apache Tomcat mediante Eclipse antes de proceder.

Práctica 01

El objetivo de esta práctica es crear un proyecto web dinámico en Eclipse con contenido estático (HTML, CSS e imágenes) y desplegarlo (deployment) en Apache Tomcat.

  1. En Eclipse accede a File > New > Dynamic Web Project, lo que abrirá la ventana New Dynamic Web Project.

  2. En la ventana New Dynamic Web Project rellena el campo Project (nombre del proyecto) con el valor jee01.

  3. Verifica que en Location el valor establecido sea un directorio dentro de tu Workspace configurado previamente: $HOME/www/eclipse/jee.

  4. Verifica que en Target runtime la opción seleccionada sea el servidor de Apache Tomcat configurado previamente: Apache Tomcat 8.5.34 y da dos clicks al botón Next, lo que te llevará a la ventana de Web Module.

  5. En la ventana de Web Module verifica que el campo Context root (contexto ráiz) tenga por valor el nombre del proyecto y que el campo Content directory (directorio de contenido estático) sea WebContent. Finalmente da click al botón de Finish.

    NOTA: la palabra context es usado en otras ocasiones como sinónimo de proyecto, módulo o aplicación web.

    En el directorio del proyecto contarás con la siguiente estructura:

     alumno@servidor:~ $ tree $HOME/www/eclipse/jee/jee01
 .
 ├── build
 │   └── classes
 ├── src
 └── WebContent
     ├── META-INF
     │   └── MANIFEST.MF
     └── WEB-INF
         └── lib

 7 directories, 1 files

  6. Accede al directorio del proyecto y crea los directorios WebContent/assets/css y WebContent/assets/img:

     alumno@servidor:~ $ cd $HOME/www/eclipse/jee/jee01
 alumno@servidor:~/www/eclipse/jee/jee01 $ mkdir -p WebContent/assets/css WebContent/assets/img

    NOTA: el objetivo del directorio assets es mantener todos los recursos estáticos necesarios (o bienes) para el proyecto: archivos de CSS, imágenes, vídeos, documentos de ofimatica (Word, Excel, PDF), archivos comprimidos (ZIP, RAR, TAR, etc), entre muchos otros.

  7. Descarga a Normalize.css y crea el archivo vácio WebContent/assets/css/main.css:

     alumno@servidor:~/www/eclipse/jee/jee01 $ wget \
   https://raw.githubusercontent.com/necolas/normalize.css/master/normalize.css -P WebContent/assets/css
 alumno@servidor:~/www/eclipse/jee/jee01 $ touch WebContent/assets/css/main.css

  8. Descarga la imágen de patrón disponible en https://www.toptal.com/designers/subtlepatterns/sakura/ y el favicon disponible en https://www.iconfinder.com/icons/98329/java_icon#size=128

     alumno@servidor:~/www/eclipse/jee/jee01 $ wget \
   https://www.toptal.com/designers/subtlepatterns/patterns/sakura.png -P WebContent/assets/img
 alumno@servidor:~/www/eclipse/jee/jee01 $ wget \
   https://www.iconfinder.com/icons/98329/download/png/128 -O WebContent/assets/img/favicon.png

  9. En Eclipse accede a Window > Show View > Project Explorer, en la pestaña resaltada da click derecho sobre el nodo WebContent y selecciona New > HTML file lo que abrirá la ventana New HTML File.

  10. En la ventana New HTML File rellena el campo File name con el valor index.html y da click al botón Finish. Eclipse abrirá inmediatamente el archivo recien creado.

  11. Modifica el contenido del archivo index.html con lo siguiente:

    <!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Práctica 01</title>
  <link rel="icon" href="assets/img/favicon.png">
  <link rel="stylesheet" href="assets/css/normalize.css">
  <link rel="stylesheet" href="assets/css/main.css">
</head>
<body>
  <!-- CONTENIDO -->
  <!-- /CONTENIDO -->
</body>
</html>

  12. En Eclipse accede a Window > Show View > Project Explorer, en la pestaña resaltada da click derecho sobre el nodo ráiz jee01 y selecciona Refresh.

    IMPORTANTE: cuando agregas/modificas algún archivo al proyecto fuera de Eclipse es necesario refrescar la vista Project Explorer.

  13. En Eclipse accede a Window > Show View > Project Explorer, en la pestaña resaltada da dos clicks izquierdos continuos sobre el nodo WebContent > assets > css > main.css lo que abrirá inmediatamente el archivo.

    Modifica el contenido del archivo main.css con lo siguiente:

    body {
  background-image: url("../img/sakura.png");
}

    Al terminal en el directorio del proyecto contarás con la siguiente estructura:

    alumno@servidor:~ $ tree $HOME/www/eclipse/jee/jee01
/home/alumno/www/eclipse/jee/jee01
.
├── WebContent
│   ├── META-INF
│   │   └── MANIFEST.MF
│   ├── WEB-INF
│   │   └── lib
│   ├── assets
│   │   ├── css
│   │   │   ├── main.css
│   │   │   └── normalize.css
│   │   └── img
│   │       ├── favicon.png
│   │       └── sakura.png
│   └── index.html
├── build
│   └── classes
└── src

10 directories, 6 files

Deployment

El despliegue (deployment) de una aplicación se entiende como su instalación dentro de un entorno de ejecución (runtime environment) ó contenedor de aplicaciones (application container) ó servidor de aplicaciones (application server). Apache Tomcat es un entorno de ejecución para Java Servlets y JavaServer Pages.

Para realizar el despliegue del proyecto realiza lo siguiente:

  1. En Eclipse accede a Window > Show View > Project Explorer, en la pestaña resaltada da click derecho sobre el nodo ráiz jee01 y selecciona Run As > Run on Server. Lo anterior abrirá la ventana Run On Server.

  2. En la ventana Run On Server selecciona la opción Choose an existing server, selecciona el servidor de Apache Tomcat previamente configurado, selecciona la opción Always use this server when running this project (para que Eclipse en los proximos despliegues use este mismo servidor de Apache Tomcat) y da click al botón Finish.

    IMPORTANTE: no debe existir algún proceso esperando conexiones en el puerto TCP 8080 (default en Apache Tomcat) ya que de ser así podrías obtener un error como el siguiente:

    Port 8080 required by apache-tomcat-8.5.34 is already in use. The server may already be running in another process, or a system process may be using the port. To start this server you will need to stop the other process or change the port number(s).

Al terminar de llevar a cabo el despliegue accede con un navegador web a http://localhost:8080/jee01

OBSERVACIONES:

  • jee01 es el proyecto en Eclipse.
  • $HOME/www/eclipse/jee/jee01 es el directorio del proyecto, dentro del workspace de Eclipse.
  • jee01 es un contexto en Apache Tomcat.
  • $HOME/www/eclipse/tomcat/apache-tomcat-8.5.34/wtpwebapps/jee01 es el directorio ráiz del contexto, dentro del directorio donde se encuentra instalado Apache Tomcat.
  • Otra forma de ver el despliegue de un proyecto es como la sincronización del directorio del proyecto con el directorio ráiz del contexto.

Si accedes al directorio ráiz del contexto encontrarás una estructura similar al directorio del proyecto en Eclipse:

alumno@servidor:~/www/eclipse/tomcat/apache-tomcat-8.5.34/wtpwebapps/jee01 $ tree
.
├── META-INF
│   └── MANIFEST.MF
├── WEB-INF
│   ├── classes
│   └── lib
├── assets
│   ├── css
│   │   ├── main.css
│   │   └── normalize.css
│   └── img
│       ├── favicon.png
│       └── sakura.png
└── index.html

7 directories, 6 files

Práctica 02

El objetivo de esta práctica es crear Java Servlets que regresen al cliente (navegador web) un documento HTML generado de forma dinámica en el lado del servidor (Apache Tomcat) mediante el lenguaje de programación Java.

A su vez esta práctica consiste en plantear el procesamiento de un formulario HTML.

Los formularios HTML son uno de los puntos principales de interacción entre un usuario y un sitio web o aplicación. Ellos permiten a los usuarios enviar información a un sitio web. La mayor parte de las veces se envía información a un servidor web, pero la pagina web también puede interceptarla para usarla por su lado. Un formulario HTML está hecho de uno o más widgets. Estos widgets puede ser campos de texto (de una linea o multilínea), cajas de selección, botones, checkboxes, o botones de radio. La mayoría del tiempo, estos widgets están junto a un label que describe su propósito. - Mi primer formulario HTML en MDN Web Docs

  1. Realiza los pasos del 1 al 7 expuestos en la Práctica 01 pero tomando en cuenta que ahora el proyecto o contexto será nombrado jee02.

    Contempla el despliegue del proyecto y su ubicación en http://localhost:8080/jee02.

  2. Crea el archivo WebContent/index.html con el siguiente contenido:

     <!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-8">
 <title>Práctica 02</title>
   <link rel="stylesheet" href="assets/css/normalize.css">
   <link rel="stylesheet" href="assets/css/main.css">
 </head>
 <body>
   <div class="contenedor">
     <div class="cabecera">
       <h1>Inicio</h1>
     </div>
     <div class="menu">
       <ul>
         <li><a href=".">Inicio</a></li>
         <li><a href="ServletHtmlDinamico">ServletHtmlDinamico</a></li>
         <li><a href="ServletHtmlFormulario">ServletHtmlFormulario</a></li>
       </ul>
     </div>
     <div class="cuerpo"></div>
   </div>
 </body>
 </html>

Servlets

A continuación se dan los pasos para crear dos servlets:

  • ServletHtmlDinamico: ante solicitudes GET de HTTP regresa un documento HTML al cliente con contenido dinámico.
  • ServletHtmlFormulario: ante solicitudes GET de HTTP regresa un documento HTML al cliente con un formulario de HTML vácio, mientras que ante solicitudes POST de HTTP regresa un documento HTML al cliente con lo ingresado en el formulario de HTML.

Los siguientes pasos son llevados a cabo dentro de la vista Project Explorer en Eclipse:

  1. Accede a Window > Show View > Project Explorer, en la pestaña resaltada da click derecho sobre el nodo jee02 > Java Resources > src y selecciona New > Servlet lo que abrirá la ventana Create Servlet.

  2. En la ventana Create Servlet, rellena los siguientes campos con los datos indicados:

    • Java package: io.bitbucket.NombreDeUsuario.jee02.servlets

      NOTA: sustituye NombreDeUsuario con tu nombre de usuario en Bitbucket.

    • Class name: ServletHtmlDinamico

    Da click al botón Finish.

    Eclipse abrirá inmediatamente el archivo jee02 > Java Resources > src > io.bitbucket.NombreDeUsuario.jee02.servlets > ServletHtmlDinamico, de acuerdo a la vista Project Explorer.

  3. Modifica el contenido del archivo jee02 > Java Resources > src > io.bitbucket.NombreDeUsuario.jee02.servlets > ServletHtmlDinamico con lo siguiente: ServletHtmlDinamico.java.txt.

    OBSERVACIÓN: sustituye NombreDeUsuario con tu nombre de usuario en Bitbucket.

  4. Una vez más, en Eclipse accede a Window > Show View > Project Explorer, en la pestaña resaltada da click derecho sobre el nodo Deployment Descriptor: jee02 > Servlets y selecciona New > Servlet lo que abrirá la ventana Create Servlet.

  5. En la ventana Create Servlet, rellena los siguientes campos con los datos indicados:

    • Java package: io.bitbucket.NombreDeUsuario.jee02.servlets

      NOTA: sustituye NombreDeUsuario con tu nombre de usuario en Bitbucket.

    • Class name: ServletHtmlFormulario

    Da click al botón Finish.

    Eclipse abrirá inmediatamente el archivo jee02 > Java Resources > src > io.bitbucket.NombreDeUsuario.jee02.servlets > ServletHtmlFormulario, de acuerdo a la vista Project Explorer.

  6. Modifica el contenido del archivo jee02 > Java Resources > src > io.bitbucket.NombreDeUsuario.jee02.servlets > ServletHtmlFormulario con lo siguiente: ServletHtmlFormulario.java.txt.

    OBSERVACIÓN: sustituye NombreDeUsuario con tu nombre de usuario en Bitbucket.

  7. Guarda los cambios hechos en el proyecto y si ya has hecho su despliegue accede a él en el URL http://localhost:8080/jee02/, en caso contrario realiza su despliegue e ingresa a él.

Códificación UTF-8 en solicitudes GET y POST

Para poder decodificar (o interpretar) los parámetros enviados por el cliente en la codificación UTF-8 se lleva a cabo lo siguiente en Apache Tomcat, una sola vez:

  1. Accede en Eclipse a Window > Show View > Project Explorer, en la pestaña resaltada abre el archivo Servers > apache-tomcat-8.5.34-config > web.xml y agrega lo siguiente al final, una línea antes del cierre del elemento <web-app>:

     <filter>
     <filter-name>setCharacterEncodingFilter</filter-name>
     <filter-class>org.apache.catalina.filters.SetCharacterEncodingFilter</filter-class>
     <init-param>
         <param-name>encoding</param-name>
         <param-value>UTF-8</param-value>
     </init-param>
 </filter>
 <filter-mapping>
     <filter-name>setCharacterEncodingFilter</filter-name>
     <url-pattern>/*</url-pattern>
 </filter-mapping>

  2. Reinicia a Apache Tomcat y realiza el despliegue de tu proyecto.

Fuente: https://wiki.apache.org/tomcat/FAQ/CharacterEncoding

IMPORTANTE:

  • Uno debe reconocer que elementos y atributos forman parte de HTML4/XHTML y cuales de HTML5.
  • Recordar que aún cuando HTML5 ofrece nuevos elementos o atributos para un formulario HTML, una aplicación web atiende solicitudes por parte de un cliente (navegador web) el cual posiblemente no ofresca el soporte de estos nuevos elementos o atributos.
  • Los datos capturados por el usuario en un formulario son secuencia de caracteres.
  • Observa los registros en la pestaña Network o Red en las herramientas de desarrollador de Firefox y por cada una de ellas la información encontrada en la pestaña Parameters o Parámetros.

Validación de un documento HTML

Puedes hacer uso del complemento html-validator para el navegador web Firefox y determinar si el código HTML generado en el servidor es válido.

Dar formato al código HTML

Puedes notar que el código de HTML entregado por el Java Servlet no cuenta con una estructura que facilite su lectura, puedes hacer uso de la pestaña Inspector en las herramientas de desarrollo de Firefox para resolver esto.

Lecturas

Videos

Práctica 03

El objetivo de esta práctica es trabajar con Cookies en Java Servlets y poder almacenar información en el cliente (navegador web). Uso de la clase javax.servlet.http.Cookie.

  1. Realiza los pasos del 1 al 7 expuestos en la Práctica 01 pero tomando en cuenta que ahora el proyecto o contexto será nombrado jee03.

    Contempla el despliegue del proyecto y su ubicación en http://localhost:8080/jee03.

  2. Crea el archivo WebContent/index.html con el siguiente contenido:

     <!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-8">
 <title>Práctica 03</title>
   <link rel="stylesheet" href="assets/css/normalize.css">
   <link rel="stylesheet" href="assets/css/main.css">
 </head>
 <body>
   <div class="contenedor">
     <div class="cabecera">
       <h1>Inicio</h1>
     </div>
     <div class="menu">
       <ul>
         <li><a href=".">Inicio</a></li>
         <li><a href="creacion-y-entrega-de-cookies">ServletCreacionEntragaCookies</a></li>
         <li><a href="lectura-de-cookies">ServletLecturaCookies</a></li>
         <li><a href="modificacion-de-cookies">ServletModificacionCookies</a></li>
         <li><a href="borrado-de-cookies">ServletBorradoCookies</a></li>
       </ul>
     </div>
     <div class="cuerpo"></div>
   </div>
 </body>
 </html>

Cookies

Crea lo siguiente en Eclipse:

NOTA: sustituye NombreDeUsuario con tu nombre de usuario en Bitbucket.

Guarda los cambios hechos en el proyecto y si ya has hecho su despliegue accede a él en el URL http://localhost:8080/jee03/, en caso contrario realiza su despliegue e ingresa a él.

Administración de Cookies

Puedes hacer uso de los complementos Cookie Manager, Cookie Quick Manager, Cookie Editor o Cookiebro para el navegador web Firefox y poder crear, editar, o borrar cookies.

Práctica 04

El objetivo de esta práctica es trabajar con Sesión (Sesión de HTTP) en Java Servlets y poder rastrear al cliente (navegador web) en cuanto a las solicitudes realizadas mediante un Token de sesión HTTP (Cookie JSESSIONID). Uso de la interfaz javax.servlet.http.HttpSession.

  1. Realiza los pasos del 1 al 7 expuestos en la Práctica 01 pero tomando en cuenta que ahora el proyecto o contexto será nombrado jee04.

    Contempla el despliegue del proyecto y su ubicación en http://localhost:8080/jee04.

  2. Crea el archivo WebContent/index.html con el siguiente contenido:

     <!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-8">
 <title>Práctica 04</title>
   <link rel="stylesheet" href="assets/css/normalize.css">
   <link rel="stylesheet" href="assets/css/main.css">
 </head>
 <body>
   <div class="contenedor">
     <div class="cabecera">
       <h1>Inicio</h1>
     </div>
     <div class="menu">
       <ul>
         <li><a href=".">Inicio</a></li>
         <li><a href="crear-o-iniciar-sesion">ServletCrearIniciarSesion</a></li>
         <li><a href="leer-atributos-de-sesion">ServletLeerAtributosSesion</a></li>
         <li><a href="modificar-atributos-de-sesion">ServletModificarAtributosSesion</a></li>
         <li><a href="invalidar-o-cerrar-sesion">ServletInvalidarCerrarSesion</a></li>
       </ul>
     </div>
     <div class="cuerpo"></div>
   </div>
 </body>
 </html>

Session

Crea lo siguiente en Eclipse:

NOTA: sustituye NombreDeUsuario con tu nombre de usuario en Bitbucket.

Guarda los cambios hechos en el proyecto y si ya has hecho su despliegue accede a él en el URL http://localhost:8080/jee04/, en caso contrario realiza su despliegue e ingresa a él.

Mantener activa una sesión (session keep alive)

Una sesión suele tener un tiempo de vida máximo, 15 mins. por ejemplo, por lo que si el cliente (navegador web) no realiza alguna solicitud en dicho tiempo la sesión es invalidada o cerrada por el servidor.

Puedes hacer uso de complementos como mSession Keeper o Session Alive para forzar a que el navegador web Firefox mantenga la sesión abierta haciendo solicitudes al servidor en segundo plano y de manera automática.

Práctica 05

El objetivo de esta práctica consiste en crear un conjunto de clases de Java que permitan generar distintos formatos de texto plano para la serialización de datos como respuesta de HTTP:

  • CSV (Comma-Separated Values): es un tipo de documento en formato abierto sencillo para representar datos en forma de tabla, en las que las columnas se separan por comas y las filas por saltos de línea.
  • JSON (JavaScript Object Notation): es un formato de texto ligero para el intercambio de datos.
  • XML (eXtensible Markup Language): es un meta-lenguaje que permite definir lenguajes de marcas, utilizado para almacenar datos en forma legible.

Para lo anterior se define un servlet quien encamina la solicitud a una clase para que esta última se encargue de generar el documento en el formato solicitado:

Ejemplos:

  • /serializacion-de-datos?formato=csv
  • /serializacion-de-datos?formato=xml
  • /serializacion-de-datos?formato=json

Los datos son mantenidos en memoria en una colección y obtenidos para generar una representación de los mismos mediante el formato solicitado.

  1. Realiza los pasos del 1 al 7 expuestos en la Práctica 01 pero tomando en cuenta que ahora el proyecto o contexto será nombrado jee05.

    Contempla el despliegue del proyecto y su ubicación en http://localhost:8080/jee05.

  2. Crea el archivo WebContent/index.html con el siguiente contenido:

     <!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-8">
 <title>Práctica 05</title>
   <link rel="stylesheet" href="assets/css/normalize.css">
   <link rel="stylesheet" href="assets/css/main.css">
 </head>
 <body>
   <div class="contenedor">
     <div class="cabecera">
       <h1>Inicio</h1>
     </div>
     <div class="menu">
       <ul>
         <li><a href=".">Inicio</a></li>
         <li><a href="serializacion-de-datos?formato=csv">serializacion-de-datos?formato=csv</a></li>
         <li><a href="serializacion-de-datos?formato=xml">serializacion-de-datos?formato=xml</a></li>
         <li><a href="serializacion-de-datos?formato=json">serializacion-de-datos?formato=json</a></li>
       </ul>
     </div>
     <div class="cuerpo"></div>
   </div>
 </body>
 </html>

Serialización

Crea lo siguiente en Eclipse:

NOTA: sustituye NombreDeUsuario con tu nombre de usuario en Bitbucket.

Guarda los cambios hechos en el proyecto y si ya has hecho su despliegue accede a él en el URL http://localhost:8080/jee05/, en caso contrario realiza su despliegue e ingresa a él.

Práctica 06

El objetivo de esta práctica es integrar librerías externas a un proyecto web. Las librerías a integrar serán:

Las anteriores librerías son solo a modo de ejemplo, existen otras tantas que ofrecen una funcionalidad similar: OpenPDF, Apache PDFBox, PDF Clown, JXLS o JExcelAPI (Java Excel API).

  1. Realiza los pasos del 1 al 7 expuestos en la Práctica 01 pero tomando en cuenta que ahora el proyecto o contexto será nombrado jee06.

    Contempla el despliegue del proyecto y su ubicación en http://localhost:8080/jee06.

  2. Crea el archivo WebContent/index.html con el siguiente contenido:

     <!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-8">
 <title>Práctica 06</title>
   <link rel="stylesheet" href="assets/css/normalize.css">
   <link rel="stylesheet" href="assets/css/main.css">
 </head>
 <body>
   <div class="contenedor">
     <div class="cabecera">
       <h1>Inicio</h1>
     </div>
     <div class="menu">
       <ul>
         <li><a href=".">Inicio</a></li>
         <li><a href="impresion-de-documento?formato=xls">impresion-de-documento?formato=xls</a></li>
         <li><a href="impresion-de-documento?formato=xlsx">impresion-de-documento?formato=xlsx</a></li>
         <li><a href="impresion-de-documento?formato=pdf">impresion-de-documento?formato=pdf</a></li>
       </ul>
     </div>
     <div class="cuerpo"></div>
   </div>
 </body>
 </html>

Librerías externas

Crea el directorio $HOME/Downloads/jars/repositorio para mantener un repositorio de librerías de Java (archivos con extensión JAR).

  • Apache POI:

    1. Accede a https://poi.apache.org/download.html y descarga el archivo con nombre poi-bin-*.tar.gz en $HOME/Downloads/jars/repositorio/apache-poi.

      En este caso se ha descargado el archivo poi-bin-3.17-20170915.tar.gz.

    2. Descomprime el contenido del archivo descargado en el directorio donde se encuentra.

      Obtendrás el directorio $HOME/Downloads/jars/repositorio/apache-poi/poi-3.17.

    3. En Eclipse accede a Window Preferences > Java > User Libraries, da clic al botón New, en el campo User library name ingresa poi-3.17 y da clic al botón OK.

      En la ventana de User Libraries selecciona poi-3.17, da clic al botón Add External JARs..., dirijete al directorio $HOME/Downloads/jars/repositorio/apache-poi/poi-3.17 y selecciona/agrega los archivos:

      • poi-*.jar
      • poi-excelant-*.jar
      • poi-ooxml-*.jar
      • poi-ooxml-schemas-*.jar
      • poi-scratchpad-*.jar
      • lib/commons-codec-*.jar
      • lib/commons-collections*.jar
      • lib/commons-logging-*.jar
      • ooxml-lib/curvesapi-*.jar
      • ooxml-lib/xmlbeans-*.jar

  • iText 7 Community:

    1. Accede a https://github.com/itext/itext7/releases y descarga el archivo con nombre itext7-*.zip en $HOME/Downloads/jars/repositorio/itext7.

      En este caso se ha descargado el archivo itext7-7.0.7.zip.

    2. Descomprime el contenido del archivo descargado en el directorio itext7-7.0.7 (crealo) donde se encuentra.

      Obtendrás el directorio $HOME/Downloads/jars/repositorio/itext7/itext7-7.0.7

    3. En Eclipse accede a Window Preferences > Java > User Libraries, da clic al botón New, en el campo User library name ingresa itext7-7.0.7 y da clic al botón OK.

      En la ventana de User Libraries selecciona itext7-7.0.7, da clic al botón Add External JARs..., dirijete al directorio $HOME/Downloads/jars/repositorio/itext7/itext7-7.0.7 y selecciona/agrega los archivos:

      • barcodes-*.jar
      • font-asian-*.jar
      • forms-*.jar
      • hyph-*.jar
      • io-*.jar
      • kernel-*.jar
      • layout-*.jar
      • pdfa-*.jar
      • pdftest-*.jar
      • sign-*.jar
      • styled-xml-parser-*.jar
      • svg-*.jar

  • Simple Logging Facade for Java (SLF4J):

    1. Accede a https://www.slf4j.org/download.html y descarga el archivo con nombre slf4j-*.tar.gz en $HOME/Downloads/jars/repositorio/slf4j.

      En este caso se ha descargado el archivo slf4j-1.7.25.tar.gz.

    2. Descomprime el contenido del archivo descargado en el directorio donde se encuentra.

      Obtendrás el directorio $HOME/Downloads/jars/repositorio/slf4j/slf4j-1.7.25

    3. En Eclipse accede a Window Preferences > Java > User Libraries, da clic al botón New, en el campo User library name ingresa slf4j-1.7.25 y da clic al botón OK.

      En la ventana de User Libraries selecciona slf4j-1.7.25, da clic al botón Add External JARs..., dirijete al directorio $HOME/Downloads/jars/repositorio/slf4j/slf4j-1.7.25 y selecciona/agrega los archivos:

      • jcl-over-slf4j-*.jar
      • jul-to-slf4j-*.jar
      • log4j-over-slf4j-*.jar
      • osgi-over-slf4j-*.jar
      • slf4j-android-*.jar
      • slf4j-api-*.jar
      • slf4j-ext-*.jar
      • slf4j-jcl-*.jar
      • slf4j-jdk14-*.jar
      • slf4j-log4j12-*.jar
      • slf4j-migrator-*.jar
      • slf4j-nop-*.jar
      • slf4j-simple-*.jar

En Eclipse:

  • En la vista Project Explorer, da clic drecho sobre el proyecto jee06, selecciona la opción de Properties, dirijete a Java Build Path > Libraries, da clic al botón Add Library.... Ante la ventana Add Library selecciona User Library da clic al botón Next, selecciona las 3 librerías (User Libraries) recien creadas-agregadas en Eclipse, da clic al botón Finish y finalmente al botón Apply.

  • En la vista Project Explorer, da clic drecho sobre el proyecto jee06, selecciona la opción de Properties, dirijete a Deployment Assembly y da clic al botón Add. Ante la ventana New Assembly Directive selecciona Java Build Path Entries, da clic al botón Next, selecciona las 3 librerías (User Libraries) recien creadas-agregadas en Eclipse, da clic al botón Finish y finalmente al botón Apply.

Crea lo siguiente en Eclipse:

NOTA: sustituye NombreDeUsuario con tu nombre de usuario en Bitbucket.

Guarda los cambios hechos en el proyecto y si ya has hecho su despliegue accede a él en el URL http://localhost:8080/jee06/, en caso contrario realiza su despliegue e ingresa a él.

Práctica 07

El objetivo de esta práctica es hacer uso de la librería externa ofrecida por PostgreSQL para permitir la comunicación de una aplicación (escrita en el lenguaje de programación Java) con una instancia de dicho sistema gestor de base de datos: PostgreSQL JDBC Driver.

Java Database Connectivity (JDBC) es una API que permite la ejecución de operaciones sobre bases de datos desde el lenguaje de programación Java, independientemente del sistema operativo donde se ejecute o de la base de datos a la cual se accede, utilizando el dialecto SQL del modelo de base de datos que se utilice. - Wikipedia

  1. Realiza los pasos del 1 al 7 expuestos en la Práctica 01 pero tomando en cuenta que ahora el proyecto o contexto será nombrado jee07.

    Contempla el despliegue del proyecto y su ubicación en http://localhost:8080/jee07.

  2. Crea el archivo WebContent/index.html con el siguiente contenido:

     <!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-8">
 <title>Práctica 07</title>
   <link rel="stylesheet" href="assets/css/normalize.css">
   <link rel="stylesheet" href="assets/css/main.css">
 </head>
 <body>
   <div class="contenedor">
     <div class="cabecera">
       <h1>Inicio</h1>
     </div>
     <div class="menu">
       <ul>
         <li><a href=".">Inicio</a></li>
         <li><a href="conexion-a-postgresql">conexion-a-postgresql</a></li>
       </ul>
     </div>
     <div class="cuerpo"></div>
   </div>
 </body>
 </html>

Integración de PostgreSQL JDBC Driver al proyecto

En base a lo expuesto en la Práctica 06:

  1. Accede a https://jdbc.postgresql.org/download.html y descarga el archivo con nombre postgresql-*.jar.

    En este caso se ha descargado el archivo postgresql-42.2.2.jar el cual corresponse a PostgreSQL JDBC 4.2 Driver, 42.2.2.

    NOTA: en dicha página encontrarás las indicaciones sobre que versión de la librería se ha usar en base a la versión del JDK que uno use: If you are using Java 8 or newer then you should use the JDBC 4.2 version.

  2. En Eclipse, crea una User Library (postgresql-42.2.2), agrégala al proyecto jee07 en Java Build Path y Deployment Assembly.

Declaración del JDBC Data Sources JNDI Resource en el entorno de ejecución (Apache Tomcat)

En Eclipse da clic derecho sobre el proyecto jee07 en la vista Project Explorer y selecciona Java EE Tools > Generate Deployment Descriptor Stub. Lo anterior creará el archivo WebContent/WEB-INF/web.xml que es el Descriptor de Despliegue.

Agrea lo siguiente al descriptor de despliegue una línea antes de la etiqueta de cierre del elemento <web-app>:

<resource-ref>
  <description>Recurso para el acceso a PostgreSQL disponible mediante JNDI</description>
  <res-ref-name>jdbc/PostgreSQL</res-ref-name>
  <res-type>javax.sql.DataSource</res-type>
  <res-auth>Container</res-auth>
</resource-ref>

Guarda los cambios hechos al descriptor de despligue.

Configuración del JDBC Data Sources JNDI Resource en el contexto (Proyecto jee07)

En Eclipse crea el archivo WebContent/META-INF/context.xml con el siguiente contenido:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE Context>
<Context>
  <Resource
    name="jdbc/PostgreSQL"
    auth="Container"
    type="javax.sql.DataSource"
    driverClassName="org.postgresql.Driver"
    maxActive="10"
    maxIdle="5"
    username="✖ ✖ ✖ ✖ ✖"
    password="✖ ✖ ✖ ✖ ✖"
    url="✖ ✖ ✖ ✖ ✖" />
</Context>

En el elemento <Resource>:

  • El atributo username estable el nombre de usuario con el cual se accederá a PostgreSQL.

  • El atributo password estable la contraseña del usuario con el cual se accederá a PostgreSQL.

  • El atributo url del elemento <Resource> tiene como valor una cadena de carácteres en la cual se indican algunos parámetros para la conexión a PostgreSQL. Puedes encontrar más información y ejemplos en: https://jdbc.postgresql.org/documentation/head/connect.html Sintaxis:

    jdbc:postgresql://dirección IP o nombre de host:puerto TCP/base de datos

    Por ejemplo:

    • Si trabajas en tu entorno local y te conectas a la base de datos postgres en el puerto TCP 5432:

      url="jdbc:postgresql://localhost:5432/postgres"

    • Si trabajas en tu entorno local y te conectas a la base de datos changoleon en el puerto TCP 5432:

      url="jdbc:postgresql://127.0.0.1:5432/changoleon"

    • Si despliegas tu aplicación a tu entorno de producción, suponiendo que tu base de datos es chilaquil y PostgreSQL espere conexiones en el puerto TCP 9696:

      url="jdbc:postgresql://localhost:9696/chilaquil"

NOTAS:

  • En el archivo META-INF/context.xml se configura un recurso, el cual es controlado por Apache Tomcat y puesto a disposición de las clases que requieran dicho recurso.

  • La clase que requiera del recurso lo localiza (a esto se le conoce como JNDI, Java Naming Directory Interface) en el contexto y hace uso de las clases para realizar 3 pasos: abrir una conexión, crear una sentencia de SQL y ejecutar una sentencia de SQL, obteniendo un conjunto de resultados. Una vez obtenido el conjunto de resultados, cierra el conjunto de resultados, la sentencia de SQL y la conexión a PostgreSQL.

OBSERVACIONES:

  • Para el correcto funcionamiento es necesario que una instancia de PostgreSQL ya se encuentre en ejecución y de realizar las modificaciones necesarias al archivo META-INF/context.xml

  • Con respecto a la instancia de PostgreSQL leer la sección de sgbd para PostgreSQL.

Crea lo siguiente en Eclipse:

NOTA: sustituye NombreDeUsuario con tu nombre de usuario en Bitbucket.

Guarda los cambios hechos en el proyecto y si ya has hecho su despliegue accede a él en el URL http://localhost:8080/jee07/, en caso contrario realiza su despliegue e ingresa a él.

Lecturas

Práctica 08

El objetivo de esta práctica es hacer uso Filters y Listeners ante solicitudes, respuestas y/o eventos que se presentán durante la ejecución de la aplicación (contexto) en el entorno de ejecución).

  1. Realiza los pasos del 1 al 7 expuestos en la Práctica 01 pero tomando en cuenta que ahora el proyecto o contexto será nombrado jee08.

    Contempla el despliegue del proyecto y su ubicación en http://localhost:8080/jee08.

  2. Crea el archivo WebContent/index.html con el siguiente contenido:

     <!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-8">
 <title>Práctica 08</title>
   <link rel="stylesheet" href="assets/css/normalize.css">
   <link rel="stylesheet" href="assets/css/main.css">
 </head>
 <body>
   <div class="contenedor">
     <div class="cabecera">
       <h1>Inicio</h1>
     </div>
     <div class="menu">
       <ul>
         <li><a href=".">Inicio</a></li>
         <li><a href="servlets/a">servlets/a</a></li>
         <li><a href="servlets/b">servlets/b</a></li>
         <li><a href="servlets/c">servlets/c</a></li>
         <li><a href="crear-o-iniciar-sesion">crear-o-iniciar-sesion</a></li>
         <li><a href="invalidar-o-cerrar-sesion">invalidar-o-cerrar-sesion</a></li>
       </ul>
     </div>
     <div class="cuerpo"></div>
   </div>
 </body>
 </html>

Crea lo siguiente en Eclipse:

NOTA: sustituye NombreDeUsuario con tu nombre de usuario en Bitbucket.

Guarda los cambios hechos en el proyecto y si ya has hecho su despliegue accede a él en el URL http://localhost:8080/jee08/, en caso contrario realiza su despliegue e ingresa a él.

Es importante que en todo momento prestes atención a lo impreso en la Consola de Eclipse y determines quien (Filter o Listener) está imprimiendo dichos mensajes.

Lecturas

Práctica 09

El objetivo de esta práctica es hacer uso del elemento <form enctype="multipart/data-form" ...> y del elemento <input type="file"> para permitir subir un archivo desde el cliente (navegador web) al servidor (Apache Tomcat) haciendo uso de:

La presente práctica se entrega en el archivo jee09.war el cual debe ser descargado e importado a Eclipse:

  1. En Eclipse accede a File > Import lo cual abrirá la ventana Import.

    Busca en la ventana Import el nodo Web > WAR file, seleccionalo y da click en el botón Next.

  2. Ante la ventana WAR Import:

    • En el campo WAR file ingresa la ubicación completa del archivo jee09.war previamente descargado.
    • En el campo Web project se habrá mostrado el valor jee09, determinado a partir del nombre del archivo WAR.
    • En el campo Target runtime selecciona el Apache Tomcat en prácticas previamente configurado.

    Da click al botón Finish para terminar y que Eclipse creee un proyecto a partir del archivo WAR.

Como usuario alumno crea el directorio /var/tmp/tomcat/jee09/archivos-subidos/ y realiza lo siguiente al archivo de configuración de la instancia de Apache Tomcat en Eclipse:

En server.xml agrega lo siguiente, entre el cuerpo del elemento <Host appBase="webapps" ...> (línea 140 aprox.):

<Context docBase="/var/tmp/tomcat/jee09/archivos-subidos" path="/jee09/archivos-subidos" />

Guarda los cambios hechos en el proyecto y si ya has hecho su despliegue accede a él en el URL http://localhost:8080/jee09/, en caso contrario realiza su despliegue e ingresa a él.

Sugerencia

Mediante un programa para descomprimir archivos en formato ZIP estudia el contenido del archivo jee09.war:

alumno@servidor:~ $ file jee09.war
jee09.war: Zip archive data, at least v2.0 to extract
alumno@servidor:~ $ xarchiver jee09.war
alumno@servidor:~ $ ark jee09.war

Lecturas

Práctica 10

El objetivo de esta práctica consiste en:

  1. Plantear la separación entre atender una solicitud GET o POST de HTTP, obtener datos de una fuente de datos y generar una representación de los datos.

  2. Hacer uso de un motor de plantillas (template engine) para generar una representación de los datos. Esto se ejemplifica con el uso de:

    • JSP: JavaServer Pages

      JavaServer Pages (JSP) es una tecnología que ayuda a los desarrolladores de software a crear páginas web dinámicas basadas en HTML y XML, entre otros tipos de documentos. JSP puede ser visto como una abstracción de alto nivel de los servlets Java. Las JavaServer Pages son traducidas a servlets en tiempo real; cada servlet es guardado en caché y rehusado hasta que la JSP original es modificada. Dicho en otras palabras un JSP son páginas java para un ambiente web. - Wikipedia

      JSP es un acrónimo de Java Server Pages, que en castellano vendría a decir algo como Páginas de Servidor Java. Es, pues, una tecnología orientada a crear páginas web con programación en Java. Las páginas JSP están compuestas de código HTML/XML mezclado con etiquetas especiales para programar scripts de servidor en sintaxis Java. - desarrolloweb.com (2002)

    • Thymeleaf: a modern server-side Java template engine for both web and standalone environments.

      Thymeleaf es una librería Java que implementa un motor de plantillas de XML/XHTML/HTML5 (también extensible a otros formatos) que puede ser utilizado tanto en modo web como en otros entornos no web. - Wikipedia

    • Apache FreeMarker: a Java library to generate text output (HTML web pages, e-mails, configuration files, source code, etc.) based on templates and changing data.

    • Mustache (mustache.java): implementation of mustache.js for Java. Influenciado por http://mustache.github.io.
    • Trimou: a Mustache templating engine implementation written in Java. Influenciado por http://mustache.github.io.

Otras opciones como motores de plantillas:

La presente práctica se entrega en el archivo jee10.war el cual debe ser descargado e importado a Eclipse, similar a lo llevado a cabo en los dos pasos para la Práctica 09.

En Eclipse se deberá integrar las siguientes librerías externas (User Libraries):

Al final obtendrás algo similar a esto en Eclipse:

  • Java Build Path para el proyecto jee10:

    images/jee10-01.png

  • Web Deployment Assembly para el proyecto jee10:

    images/jee10-02.png

Guarda los cambios hechos en el proyecto y si ya has hecho su despliegue accede a él en el URL http://localhost:8080/jee10/, en caso contrario realiza su despliegue e ingresa a él:

images/jee10-03.png

Observaciones

  • JavaServer Pages no es un motor de plantillas sin embargo su uso es principalmente para la generación de un documento a partir de contenido estático (código de HTML/XML) y contenido dinámico (código de Java). Sería más correcto compararlo al lenguaje de programación PHP o bien a ASP Clásico.

  • Todos los motores de plantillas usados en el proyecto jee10 generán HTML, algunos de ellos pueden generar XML, JSON, CSV, CSS, JavaScript, etc.

  • Independientemente del tipo de solicitud HTTP realizada (GET o POST) se hace uso de un motor de plantilla para generar la respuesta.

  • La clase io.bitbucket.hernandezblasantonio.jee10.generadores.Datos es usado por todas las solicitudes GET o POST de tal forma que todos los motores de plantillas presentan la misma información. Este punto es para ver que similitudes o diferencias existen entre los distintos motores de plantillas.

  • Posiblemente las respuestas generadas mediante Java y JSP sean las más fáciles de abordar por la familiaridad de su sintaxis.

  • Uno de los objetivos finales sería evitar tener lógica de programación (código) en aquello que se use para generar la presentación de la información.

Lecturas

Práctica 11

El objetivo de esta práctica consiste en realizar el deployment de una aplicación web escrita en Java al servicio de hospedaje Heroku.

Suponiendo que ya tienes una cuenta de usuario en Heroku y ya cuentas con la instalación de Heroku CLI realiza lo siguiente:

  1. Verifica la instalación de JAVA (JRE/JDK): which java, java -version y javac -version.

    Verifica que la variable de entorno JAVA_HOME tengan un valor acorde a la instalación de JAVA:

    alumno@servidor:~ $ echo $JAVA_HOME
/usr/lib64/java

  2. Verifica la instalación de Heroku CLI:

    alumno@servidor:~ $ which heroku
/home/alumno/.local/opt/heroku-cli/heroku/bin/heroku
alumno@servidor:~ $ heroku --version
heroku/7.0.94 linux-x64 node-v10.4.1

    Puedes iniciar sesión en Heroku, si no lo has hecho aún, con el comando heroku login.

  3. Instala el plugin heroku-cli-deploy para Heroku CLI:

    alumno@servidor:~ $ heroku plugins:install heroku-cli-deploy
Installing plugin heroku-cli-deploy... installed v0.4.2

    Con el comando heroku plugins puedes obtener una lista de los plugins de Heroku CLI que ya has instalado.

  4. Crea una app (aplicación) en Heroku accediendo a https://dashboard.heroku.com/new-app y rellena el formulario presentado tomando en cuenta lo siguiente:

    • App name: el nombre de tu app, por ejemplo jee11 ($APP más abajo).
    • Choose a region: selecciona United States.

    Al finalizar da click al botón Create app. Serás enviado al dashboard de tu app, por ejemplo: https://dashboard.heroku.com/apps/$APP.

    Accediendo a https://dashboard.heroku.com/apps/$APP/settings, en la sección Domains and certificates, podrás obtener el URL mediante el cual podrás acceder a tu aplicación web, por ejemplo: https://$APP.herokuapp.com

  5. Realiza el deployment de una aplicación web en Java haciendo uso de un archivo WAR.

    Como prueba puedes hacer uso del archivo WAR de ejemplo ofrecido por Apache Tomcat: sample.war.

    alumno@servidor:~ $ wget https://tomcat.apache.org/tomcat-8.5-doc/appdev/sample/sample.war

    Mediante Heroku CLI realiza el deployment de sample.war ($APP.WAR más abajo) estableciendo la versión de Apache Tomcat a usar en Heroku ($TOMCAT más abajo):

    alumno@servidor:~ $ heroku war:deploy $APP.WAR --app $APP --webapp-runner $TOMCAT
Uploading $APP.WAR
-----> Packaging application...
       - app: $APP
       - including: webapp-runner.jar
       - including: $APP.WAR
-----> Creating build...
       - file: slug.tgz
       - size: 16MB
-----> Uploading build...
       - success
-----> Deploying...
remote: 
remote: -----> heroku-deploy app detected
remote: -----> Installing JDK 1.8... done
remote: -----> Discovering process types
remote:        Procfile declares types -> web
remote: 
remote: -----> Compressing...
remote:        Done: 66.7M
remote: -----> Launching...
remote:        Released v3
remote:        https://$APP.herokuapp.com/ deployed to Heroku
remote: 
-----> Done

    Para este ejemplo el comando ejecutado ha sido: heroku war:deploy sample.war --app jee11 --webapp-runner 8.5.34.1

    NOTA: este proceso puede durar alrededor de 5 minutos.

    Al terminar accede al URL dado por Heroku:

    images/jee11-01.png