Aplicaciones web

1. Vamos a probar el servidor web Tomcat y a subir recursos estáticos a él.

a) Instalar y poner en marcha el servidor web Tomcat. Comprobar que está activo accediendo a la siguiente URL desde cualquier navegador:

http://localhost:8080/

b) Crear un fichero pagina.htm en la aplicación raíz (ROOT) instalada por defecto en Tomcat. El contenido de este fichero puede ser el siguiente:

<html>
  <head>
    <title>Pagina principal</title>
  </head>

  <body>
    <h1>Pagina principal</h1>
    <p>Esta es una página de prueba sencilla 
       para probar el servidor web.</p>
  </body>
</html>

Comprobar que se puede acceder correctamente a este recurso introduciendo la siguiente URL:

http://localhost:8080/pagina.htm

2. En este caso vamos a crear un nuevo contexto (aplicación web) en Tomcat, que contendrá únicamente recursos estáticos (HTML). Vamos a dejar el servidor Tomcat en marcha mientras construimos la aplicación.

a) Crear un nuevo subdirectorio en ${tomcat.home}/webapps para nuestra nueva aplicación. Llamaremos prueba a este directorio.

b) Crear la estructura de directorios necesaria dentro del directorio de la nueva aplicación. Introducir el fichero pagina.htm del ejercicio anterior y crear un descriptor de despliegue (web.xml) básico, como el del ejemplo que se muestra en los apuntes, situando cada uno de estos ficheros en el directorio que corresponda.

c) Comprobar si este nuevo contexto se carga correctamente. Para comprobar su correcto funcionamiento podemos acceder a la URL

http://localhost:8080/prueba/pagina.htm

Si no carga correctamente detendremos Tomcat y lo volveremos a arrancar. Comprobar ahora si la aplicación carga correctamente.

d) Empaquetar la aplicación web en un fichero WAR de nombre prueba.war.

e) Eliminar la aplicación prueba de webapps y reiniciar Tomcat. Con el servidor encendido, copiar el fichero prueba.war al directorio webapps de Tomcat y comprobar que podemos acceder correctamente a la aplicación utilizando la URL anterior. NOTA: Si hace falta, esperar unos segundos para dar tiempo a que Tomcat cargue la aplicación automáticamente. Si esto no funciona, reiniciar Tomcat y volver a probar.

f) Mirar el contenido del directorio webapps de Tomcat. ¿Qué ha hecho el servidor con la aplicación web prueba?

g) (OPTATIVO) Abrir el fichero de configuración del servidor Tomcat que se encuentra en ${tomcat.home}/conf/server.xml. Buscamos dentro de este fichero una etiqueta Host que tiene como atributo unpackWARs, que por defecto toma valor true. Cambiar el valor de unpackWARs a false y repetir los apartados (e) y (f) con esta nueva configuración. Probar que la aplicación funciona correctamente accediendo a su URL. Comprobar el contenido del directorio webapps, ¿qué diferencia hay con el caso anterior?

h) Copiar el WAR a otro directorio y eliminar la aplicación web prueba utilizando el manager de Tomcat. Comprobar que en el directorio webapps ya no está nuestra aplicación prueba. Poner en marcha Tomcat y desplegar el WAR utilizando el manager.¿Qué ventajas encuentras a desplegar la aplicación utilizando el manager de Tomcat?

3. Vamos a probar una aplicación web sencilla con elementos dinámicos (servlets), que deberán ser compilados previamente. En este caso no trabajaremos directamente en el directorio de Tomcat, sino que trabajaremos en un directorio de desarrollo y una vez construida la aplicación la desplegaremos en Tomcat. Se pide:

a) Descargar el fichero de plantillas de la sesión y descomprimir su contenido en cualquier directorio. Veremos que crea un directorio HolaMundo que contiene un proyecto de Eclipse con la aplicación a probar.

b) Importar el proyecto desde Eclipse, mediante la opción del menú File > Import .... De esta forma veremos dentro del proyecto de Eclipse todo el contenido de la aplicación.

Abrir estos ficheros para visualizarlos en el editor de código de Eclipse. Comprobar que estamos utilizando perspectiva Java en Eclipse.

c) Abrir la ventana de ant de Eclipse y cargar el fichero build.xml de la aplicación. Deberemos ver en esta ventana la lista de objetivos definidos en este fichero.

d) Ejecutar el objetivo dist de ant y comprobar que se ha generado el fichero WAR de nuestra aplicación en el subdirectorio dist de nuestro directorio de desarrollo.

e) Desplegar este fichero WAR utilizando el manager de Tomcat. Una vez desplegado comprobar que podemos acceder correctamente a la aplicación conectándonos a la siguiente URL:

http://localhost:8080/hola/index.htm

Probar deteniendo y reanudando la aplicación desde el manager, y comprobar que mientras está detenida no podemos acceder a ella.

f) Eliminar la aplicación del servidor utilizando el manager. Volver a desplegar, esta vez utilizando el objetivo deploy de ant desde Eclipse. Comprobar si la aplicación funciona correctamente. Si no es así, reiniciar el servidor Tomcat y volver a probar.

4. Vamos a crear un aplicación web desde cero utilizando el entorno de desarrollo Eclipse. La aplicación consistirá en un conversor web de euros a ptas. Se pide:

a) Crear un nuevo proyecto con Eclipse para nuestra aplicación. Durante la creación del nuevo proyecto deberemos:

b) Una vez creado el proyecto añadiremos una clase con un servlet llamado Conversor, en el paquete es.ua.j2ee.web, cuyo código fuente será el que se muestra a continuación:

package es.ua.j2ee.web;

import java.io.*;
import javax.servlet.*;
import javax.servlet.http.*;

public class Conversor extends HttpServlet {

  public void doGet(HttpServletRequest req, 
                    HttpServletResponse res) 
                  throws ServletException, IOException {

    boolean correcto = false;
    float euros = 0.0f;
    int ptas = 0;

    String snum = req.getParameter("numero");
    try {
      euros = Float.parseFloat(snum);
      ptas = (int)(euros * 166.386);
      correcto = true; 
    } catch(NumberFormatException e) {
      correcto = false;
    }

    res.setContentType("text/html");

    PrintStream out = new PrintStream(res.getOutputStream());
    out.println("<HTML>");
    out.println("<HEAD>");
    out.println("<TITLE>Resultado</TITLE>");
    out.println("</HEAD>");
    out.println("<BODY>");

    if(correcto) {
      out.println("<H1>Resultado</H1>");
      out.println("<P>" + euros + " euros son <B>"
                  + ptas + "</B> Ptas</P>");
      out.println("<A HREF=\"" + req.getContextPath()
                  + "/index.htm\">Calcular otra cantidad</A>");
    } else {
      out.println("<H1>Error</H1>");
      out.println("<P>Debe introducir un numero</P>"); 
      out.println("<A HREF=\"" + req.getContextPath() 
                  + "/index.htm\">Volver atras</A>");
    }

    out.println("</BODY>");
    out.println("</HTML>");
    out.close();
  }

  public void doPost(HttpServletRequest req, 
                     HttpServletResponse res)
                   throws ServletException, IOException {
    this.doGet(req, res);
  }
}

c) Crearemos un directorio web donde construiremos la estructura de directorios de la aplicación web (WEB-INF, WEB-INF/lib y WEB-INF/classes). Crearemos el descriptor de despliegue (web.xml) en el directorio que corresponda, con el siguiente contenido:

<?xml version="1.0" encoding="ISO-8859-1"?>

<!DOCTYPE web-app 
 PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
 "http://java.sun.com/dtd/web-app_2_3.dtd">

<web-app>
  <display-name>Mi Aplicacion Web</display-name>
  <description>
    Esta es una aplicacion web sencilla a modo de ejemplo
  </description>

  <servlet>
    <servlet-name>Conversor</servlet-name>
    <servlet-class>es.ua.j2ee.web.Conversor</servlet-class>
  </servlet>
     
  <servlet-mapping>
    <servlet-name>Conversor</servlet-name>
    <url-pattern>/servlet/Conversor</url-pattern>
  </servlet-mapping>
</web-app>

Introduciremos como recurso estático de la web un fichero index.htm con el siguiente contenido:

<html>
  <head>
    <title>Conversor euros-ptas</title>
  </head>
     
  <body>
    <h1>Conversor</h1>
    <p>Introduzca la cantidad en euros:</p>
    <form action="servlet/Conversor" method="GET">
      <input type="text" name="numero" value="0.0">euros
      <input type="submit" value="Calcular">
    </form>
  </body>
</html>

d) Crear un fichero build.xml de ant siguiendo la plantilla de los apuntes, cambiando los valores de las propiedades necesarias para adaptarlo a nuestra aplicación, de forma que el contexto se llame euro.

e) Utilizar el objetivo dist de este fichero de ant para crear en dist el fichero WAR con nuestra aplicación.

f) Desplegar la aplicación web mediante el manager de Tomcat, subiendo el fichero WAR generado en el punto anterior. Comprobar que la aplicación funciona correctamente accediendo a la URL:

http://localhost:8080/euro/index.htm

g) Utilizar el manager de Tomcat para eliminar la aplicación. Desplegar ahora otra vez la aplicación desde Eclipse utilizando el objetivo deploy de ant. Comprobar que la aplicación funciona correctamente utilizando la misma URL que en el punto anterior. Si el servidor no reconoce correctamente la aplicación, reiniciar Tomcat y volver a probar.

h) Vamos a modificar el código fuente de nuestro servlet Conversion.java. Vamos a cambiar la línea donde generamos el título del documento resultante, donde teníamos

out.println("<TITLE>Resultado</TITLE>");

Pondremos:

out.println("<TITLE>Resultado de la conversión</TITLE>");

Guardamos los cambios en Eclipse, y pulsamos sobre el objetivo deploy de ant para volver a desplegar la aplicación sin eliminar la que teníamos anteriormente desplegada. De esta forma estaremos actualizando el contenido de la aplicación en el servidor web.

Probaremos otra vez la aplicación. ¿Ha cambiado el título de la página con el resultado? Si no vemos los cambios, deberemos ir al manager de Tomcat y pulsar sobre Reload en nuestra aplicación. Volvemos a probarla, para asegurarnos de que ahora los cambios se reflejan correctamente en la aplicación.

Con esto podemos ver que conforme vayamos actualizando la aplicación durante el desarrollo de la misma, conviene recargarla cada vez que la actualicemos en el servidor para asegurarnos de que se hayan reconocido los últimos cambios, y no estemos probando la versión anterior.