Web Sites Dinámicos con XML, XSLT y JSP

Los tiempos en que los Web Sites con documentos estáticos tenían éxito se han acabado. Hoy en día la frecuencia de actualización y la veracidad son un factor importante para el éxito de una site. Hay muchos mecanismos para producir contenido dinámico. En el lado del servidor tenemos CGI, PHP y servlets, el navegador tiene JavaScript y Applets Java.

Todas esas técnicas tienen en común que las páginas no se pueden crear sin ningún conocimiento de programación. Antes el diseño Web era un dominio de los artistas gráficos y los maquetadores, hoy en día los programadores especializados también son necesarios para construir una site completa. Esta mezcla de creatividad y tecnología frecuentemente hace que aparezcan problemas: bien el diseño necesita integrarse en el código o el código aparece en documentos HTML.

Los problemas de coordinación resultan en que el fuerte acoplamiento de estas dos disciplinas debería minimizarse tanto como sea posible. En el resto de este artículo presentaremos un método, que facilita la tarea de proporcionar datos dinámicos y los integra en el sitio Web. Lo único que necesitamos es un servidor Web que soporte la ejecución de Java Server Pages (JSP).

Brevemente digamos que los JSPs son documentos HTML en los que se puede integrar código Java. Cuando un JSP se solicita por primera vez, el servidor Web (o más precisamente el motor JSP/servlet) lo compila y lo convierte en un servlet Java. Este contiene implícitamente código HTML. La ejecución del código genera los datos dinámicos y se combina con el HTML enviándolo de vuelta al navegador Web.

Esta aproximación en solitario no alcanza nuestro objetivo de separar la programación del diseño. Por lo tanto no generamos HMTL directamente sino que realizamos un paso extra grabando los datos dinámicos en XML. Para poder crear HTML para el navegador, lanzaremos sobre los datos XML un procesador XSLT (Extensible Stylesheet Language Transformation), que, junto con los datos XML dinámicos, toma un hoja de estilo XSLT estática.

Software

Como se mencionó anteriormente, los básico para nuestra aproximación es un servidor Web con soporte de JSP. Usaremos para nuestro ejemplo el servidor y motor servlet más popular y fácil de instalar: Tomcat. Proporciona además de un contenedor servlet, un entorno de ejecución de JSP. La gran ventaja de Tomcat es que puede operar en modo independiente y por lo tanto como servidor Web completo y también puede operar con servidores Web dedicados como Apache, Microsoft Internet Information Server y Netscape Enterprise Server. Como Tomcat está escrito en Java, requiere una versión 1.1 o superior del entorno de ejecución Java. Para configurarlo todo:

  • Descarga e instala Java
  • Descarga Tomcat
  • Configura las variables de entorno TOMCAT_HOME y JAVA_HOME
  • Arranca Tomcat usando startup.sh o startup.bat
  • Apunta tu navegador a la página de inició: http://localhost:8080
  • Crea el siguiente árbol de directorios debajo de TOMCAT_HOME/webapps:
    • xslt
    • xslt/xml
    • xslt/WEB-INF
    • xslt/WEB-INF/lib
  • Descarga Xalan
  • Desempaqueta Xalan y copia xerces.jar, xalan.jar, y bsf.jar en el directorio xslt/WEB-INF/lib
  • Descarga Jakarta Taglib
  • Desempaqueta Taglib y copia xsl.jar en el directorio xslt/WEB-INF/lib, y xsl.tld en el directorio xslt/WEB-INF
  • Crea el fichero xslt/WEB-INF/web.xml con este contenido:
    <taglib>
        <taglib-uri>http://jakarta.apache.org/taglibs/xsl-1.0</taglib-uri>
        <taglib-location>/WEB-INF/xsl.tld</taglib-location>
    </taglib>
    
  • Rearranca Tomcat

Ejemplo

El enlace entre la página JSP y la hoja de estilo XSLT son los datos. Definimos un formato de agenda de teléfonos en XML de esta forma, y lo grabamos como xslt/xml/book.xml:

<book>
	<phone>
		<name>Police</name>
		<number>110</number>
	</phone>
	<phone>
		<name>Fire Brigade</name>
		<number>112</number>
	</phone>
</book>

La siguiente página JSP se usará como fuente de datos, grábala como xslt/book.jsp:

<%@taglib uri="http://jakarta.apache.org/taglibs/xsl-1.0" prefix="xsl"%>
<html>
<head><title>Phone Book</title></head>
<body>
<xsl:InsertWithXSL xml="/xml/book.xml" xsl="/xml/book.xsl" />
</body>
</html>

La primera línea referencia la librería de etiquetas xsl y la directiva xsl:InsertWithXSL invoca al procesador XSLT y obtiene los datos resultantes de la aplicación de book.xsl sobre book.xml.

Diseño HTML

Ahora empieza el trabajo del diseñador Web, que necesita grabar la hoja de estilo XSLT como xslt/xml/book.xsl para que la pueda referenciar la página JSP:

<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="book">
	<table>
	<tr><th>Name</th><th>Phone</th></tr>
	<xsl:for-each select="phone">
		<tr>
			<td><xsl:value-of select="name" /></td>
			<td><xsl:value-of select="number" /></td>
		</tr>
	</xsl:for-each>
	</table>
</xsl:template>
</xsl:stylesheet>

Esta hoja de estilo pasa por todas las entradas de la agenda de teléfonos y muestra los nombres y los números de teléfono en una simple tabla HTML.

Si se ha conectado todo correctamente, la página resultante de solicitar http://localhost:8080/xslt/book.jsp mostrará esto:

Name Phone
Police 110
Fire Brigade 112

Conclusión

La técnica presentada aquí utiliza XML y XSLT para la creacción de sitios Web dinámicos. Esta sencilla página JSP se puede mejorar fácilmente para generar datos XML desde una base de datos, o para analizar HTML directo de otras sites y convertirlo en XML. Las posibilidades son infinitas...

COMPARTE ESTE ARTÍCULO

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