Estás en:   ArielOrtiz.info > Desarrollo de aplicaciones distribuidas > Laboratorio 2: Introducción a Apache

Laboratorio 2: Introducción a Apache

Objetivos

Durante esta práctica, los alumnos serán capaces de:

Esta actividad promueve las siguientes habilidades, valores y actitudes: análisis y síntesis, capacidad de resolver problemas, creatividad, y uso eficiente de la informática y las telecomunicaciones.

Descripción de la actividad

NOTA IMPORTANTE: Las actividades de la práctica se pueden elaborar de manera individual o en parejas. El reporte de la práctica de laboratorio debe ser desarrollado de manera individual.

  1. Instala el servidor de Web Apache en tu sistema de Ubuntu Linux. Desde la terminal teclea:
    sudo apt-get install apache2
    
    Verifica que esté funcionando el servidor usando el siguiente URL desde tu navegador: http://localhost/
  2. Configura Apache para que sepa donde encontrar los archivos de tu sitio Web. En $HOME/www/static residirá todo tu contenido estático, y en $HOME/www/cgi-bin estarán los scripts CGI para generar contenido dinámico. Para crear los directorios mencionados, teclea desde la terminal:
    cd
    
    mkdir www
    
    cd www
    
    mkdir static
    
    mkdir cgi-bin
    
  3. Abre el archivo /etc/apache2/sites-enabled/000-default con privilegios de administrador (root). Desde la terminal teclea:

    gksudo gedit /etc/apache2/sites-enabled/000-default
    

    Edita dicho archivo para que Apache pueda utilizar los directorios recién creados. Reemplaza username por el nombre de usuario correcto:

    <VirtualHost *:80>
        # Coloca aquí el correo electrónico del administrador de Apache
        ServerAdmin Webmaster@localhost username@example.com
    
        DocumentRoot /var/www /home/username/www/static
        <Directory />
            Options FollowSymLinks
            AllowOverride None
        </Directory>
        <Directory /var/www/ /home/username/www/static/>
            Options Indexes FollowSymLinks MultiViews
            AllowOverride None
            Order allow,deny
            allow from all
        </Directory>
    
        ScriptAlias /cgi-bin/ /usr/lib/cgi-bin/ /home/username/www/cgi-bin/
        <Directory "/usr/lib/cgi-bin" /home/username/www/cgi-bin>
            AllowOverride None
            Options +ExecCGI -MultiViews +SymLinksIfOwnerMatch
            Order allow,deny
            Allow from all
        </Directory>
    
        ErrorLog ${APACHE_LOG_DIR}/error.log
    
        # Possible values include: debug, info, notice, warn, error, crit,
        # alert, emerg.
        LogLevel warn
    
        CustomLog ${APACHE_LOG_DIR}/access.log combined
    </VirtualHost>
    

    Siempre que se modifique la configuración de Apache es necesario reiniciarlo para que los cambios surtan efecto. Desde la terminal teclea:

    sudo /etc/init.d/apache2 restart

    Además de la opción restart, se puede invocar el comando anterior con las opciones stop y start para detener e iniciar el servidor de Web Apache, respectivamente.

    Al reiniciar, detener e iniciar el servidor Web Apache aparece el siguiente mensaje:

    apache2: Could not reliably determine the server's fully qualified domain name,
    using 127.0.1.1 for ServerName
    

    Para evitar que aparezca este mensaje, se debe crear (usando privilegios de administrador) un archivo de texto llamado name en el directorio /etc/apache2/conf.d, cuyo contenido debe ser la siguiente línea:

    ServerName localhost
    
  4. Crea una hoja de estilos estilos.css y una página de bienvenida index.html para probar que la configuración de tu sitio Web sea correcta. Ambos archivos deben localizarse en el directorio www/static.

    /* Archivo: estilos.css */
    
    body {
        background: #FFF;
        color: #000080;
        font-family: sans-serif;
        font-size: medium;
        margin: 20px;
    }
    
    h1 {
        color: #069;
        font-size: 230%;
        border-bottom: 4px solid #069;
        margin: 10px 0px 20px 0px;
        padding: 0px;
    }
    
    table {
        border-collapse: collapse;
        border: 1px solid #000000;
        padding: 0px;
        margin-bottom: 10px;
        color: #000000;
        background: #E6E6FA;
    }
    
    td {
        border: 1px solid #000000;
        padding: 10px;
        text-align: left;
    }
    
    th {
        border: 1px solid #000000;
        padding: 10px;
        color: #008080;
        background: #B0E0E6;
        text-align: center;
    }
    
    <!-- Archivo: index.html -->
    
    <!DOCTYPE html>
    
    <html lang="es">
    
        <head>
            <meta charset="utf-8"/>
            <link rel="stylesheet" href="/estilos.css"/>
            <title>El Chorrito</title>
        </head>
    
        <body>
    
            <h1>El Chorrito</h1>
    
            <p>
                <strong>Autor: Francisco Gabilondo Soler</strong>
            </p>
            <p>
                La gota de agua que da la nube<br/>
                como regalo para la flor<br/>
                en vapor se desvanece<br/>
                cuando se levanta el sol;<br/>
                y nuevamente al cielo sube<br/>
                hasta la nube que la soltó.<br/>
                La gotita sube y baja,<br/>
                baja y sube<br/>
                al compás de esta canción:<br/>
            </p>
            <p>
                Allá en la fuente<br/>
                había un chorrito,<br/>
                se hacía grandote<br/>
                se hacía chiquito;<br/>
                allá en la fuente<br/>
                había un chorrito,<br/>
                se hacía grandote<br/>
                se hacía chiquito;<br/>
                estaba de mal humor,<br/>
                pobre chorrito tenía calor<br/>
                estaba de mal humor,<br/>
                pobre chorrito tenía calor.
            </p>
        </body>
    
    </html>
    

    Apunta nuevamente tu navegador a http://localhost/. Debes poder ver la página index.html rendereada de la manera esperada.

  5. Ahora revisaremos que los scripts CGI también funcionen correctamente. En el directorio www/cgi-bin coloca el siguiente archivo fuente de JavaScript llamado ahorita.js:

    #!/usr/bin/env node
    
    // Archivo: ahorita.js
    
    'use strict';
    
    // Imprimir encabezados de la respuesta
    console.log('Content-type: text/html; charset=utf-8');
    
    // MUY IMPORTANTE: Imprimir una línea en blanco para delimitar
    // los encabezados del cuerpo de la respuesta.
    console.log();
    
    console.log('<!DOCTYPE html>                                 \n' +
    '                                                            \n' +
    '<html lang="es">                                            \n' +
    '                                                            \n' +
    '    <head>                                                  \n' +
    '        <meta charset="utf-8"/>                             \n' +
    '        <link rel="stylesheet" href="/estilos.css"/>        \n' +
    '        <title>La hora de ahorita</title>                   \n' +
    '    </head>                                                 \n' +
    '                                                            \n' +
    '    <body>                                                  \n' +
    '                                                            \n' +
    '        <h1>La hora de ahorita</h1>                         \n' +
    '                                                            \n' +
    '        <p>                                                 \n' +
    '            La fecha y hora del servidor Web en este        \n' +
    '            momento es: <strong>%s</strong>                 \n' +
    '        </p>                                                \n' +
    '                                                            \n' +
    '        <p>                                                 \n' +
    '            [<a href="">Actualizar</a>]                     \n' +
    '        </p>                                                \n' +
    '                                                            \n' +
    '    </body>                                                 \n' +
    '                                                            \n' +
    '</html>', new Date());
    
    

    Es indispensable que este archivo tenga permisos de ejecución. Teclea desde la terminal (en el directorio www/cgi-bin):

    chmod +x ahorita.js
    

    Usa el siguiente URL desde tu navegador para ver el resultado: http://localhost/cgi-bin/ahorita.js

  6. Escribe un nuevo script CGI en JavaScript llamado ambiente.js que imprima en orden lexicográfico (alfabético) los nombres de todas las variables de ambiente que estén disponibles junto con sus valores asociados, utilizando una tabla de HTML parecida a la siguiente:

    Variable Valor
    DOCUMENT_ROOT /home/username/www/static
    GATEWAY_INTERFACE CGI/1.1
    HTTP_ACCEPT text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
    ... ...

    Las variables de ambiente se pueden obtener en Node.js usando la propiedad env del objeto process.

    El URL para el script debe ser: http://localhost/cgi-bin/ambiente.js

¿Qué se debe entregar?

Para entregar tu trabajo individual, sigue las siguientes instrucciones:

Fecha límite: Martes, Febrero 5.

Evaluación

Esta actividad será evaluada usando los siguientes criterios:

50% Implementación de los requerimientos.
50% Reporte de la práctica de laboratorio.
DA El programa y/o reporte es un plagio.