Cómo Hacer que Apache Modifique Páginas Web Estáticas Dinámicamente con Facilidad

Al mantener un sitio web compuesto únicamente por páginas HTML estáticas, un desafío común es cómo incorporar cambios dinámicamente o scripts externos que sean necesarios para la funcionalidad. Por ejemplo, herramientas de análisis web como Woopra requieren incrustar código JavaScript en cada página, lo cual puede ser incómodo al tratar con múltiples archivos estáticos.

En esta entrada de blog, exploraremos cómo integrar de manera efectiva elementos dinámicos en páginas web estáticas utilizando las capacidades de Apache.

El Desafío

Podrías encontrarte en un escenario donde:

  • Tienes páginas HTML puramente estáticas.
  • Necesitas incluir un fragmento de JavaScript para rastrear análisis web.
  • Agregar este código a cada archivo individual es impráctico.

El primer pensamiento podría inclinarse hacia el uso de inclusiones del lado del servidor (SSI) de Apache junto con reescrituras para automatizar el proceso. Sin embargo, como muchos han descubierto, este enfoque puede a menudo quedarse corto.

Ejemplo de Intento de Solución

Aquí hay una descripción simplificada de tu intento inicial:

  1. Configuraste mod_rewrite en la configuración de Apache para capturar solicitudes de páginas HTML estáticas.

    RewriteEngine On
    RewriteCond %{REQUEST_URI} !=test.shtml
    RewriteCond %{IS_SUBREQ} false 
    RewriteRule (.*)\.html test.shtml?$1.html
    
  2. Creaste un archivo llamado test.shtml que se supone debe incluir el JavaScript necesario y el contenido HTML original.

    <script type="text/javascript">
        var XXXXid = 'xxxxxxx';
    </script>
    <script src="http://xxxx.woopra.com/xx/xxx.js"></script>
    
    <!--#set var="page" value="$QUERY_STRING" -->
    <!--#include virtual="$page" -->
    

Sin embargo, te encontraste con problemas que impidieron el resultado deseado.

La Solución

Para modificar efectivamente archivos estáticos dinámicamente, el método alternativo implica el uso de mod_filter_ext. Este módulo permite el procesamiento de archivos a través de scripts externos, lo que te permite insertar JavaScript u otro contenido dinámico de manera fluida.

Pasos para Implementar la Solución

  1. Habilitar el Módulo Requerido de Apache: Asegúrate de que el módulo mod_filter_ext esté habilitado en tu configuración de Apache. Este módulo te permite definir programas de filtro externos que procesan tipos de archivo específicos.

  2. Crear un Script Externo: Escribe un breve script en Perl que inyecte tu código JavaScript en tus páginas HTML. Aquí hay una estructura básica:

    while (<>) {
        s/<html>/\Q<script>....\E/;
        print $_;
    }
    
    • Este script lee los archivos HTML entrantes y sustituye un marcador de posición por tu código JavaScript.
  3. Configurar Apache para Usar el Script: Actualiza tu archivo de configuración de Apache para registrar el script para archivos HTML. Puedes agregar algo como:

    SetOutputFilter EXT_FILTER
    FilterDeclare EXT_FILTER
    FilterProvider EXT_FILTER pulse html
    FilterChain EXT_FILTER Perl-script-name
    
  4. Probar tu Configuración: Después de haber configurado el filtro, accede directamente a una de tus páginas HTML estáticas. El código JS ahora debería estar incluido dinámicamente en la salida.

Herramientas Adicionales

  • Alternativamente, podrías usar herramientas de línea de comandos como sed para realizar sustituciones de manera similar, aunque la flexibilidad de un script en Perl puede proporcionar más control a largo plazo.

Conclusión

Integrar elementos dinámicos en páginas HTML estáticas puede ser complicado, pero con el uso adecuado de módulos de Apache y scripts externos, se puede lograr de manera efectiva. Ya sea que elijas usar mod_filter_ext u otro método, el objetivo sigue siendo el mismo: simplificar tu flujo de trabajo mientras mantienes tu sitio funcional.

¡No dudes en ponerte en contacto si tienes preguntas o si encuentras desafíos mientras implementas esta solución!