Configurar varios sitios con XAMPP en Windows

XAMPP es una distribución que te permite instalar a golpe de un solo click, el Apache, PHP, MySQL, Perl y algunas otras extensiones útiles para el desarrollo web.

Voy a asumir que ya tienes instalado y funcionando el XAMPP en tu PC. Por ahora, solo puedes acceder al sitio web por defecto en XAMPP que ha sido creado en la instalación bajo http://localhost

En el mundo del desarrollo web es súmamente importante ser organizado, y con ello, saber organizar sus proyectos, carpetas y archivos (en este orden).

Y también, sería interesante poder probar nuestros proyectos individualmente en la misma carpeta en donde desarrollamos, por ejemplo:

http://miproyecto/

Y no tener que recurrir a:

http://localhost/miproyecto/

Aparte de esto, la primera opción nos permite tener un mejor control de cada proyecto, de los archivos, etc. Mienstra que con la segunda forma, todos los archivos deberían ir a parar a una carpeta predeterminada del XAMPP.

Antes de empezar

Primero que nada, debes conocer algunas cosas que te ayudarán a entender básicamente como funciona un servidor web.

Para manejarnos, vamos a asumir que:

• Tienes instalado el XAMPP en c:\xampp (carpeta XAMPP)
• Tienes instalado MS Windows en c:\windows (carpeta Windows)

Y deberás crear

• Tienes una carpeta c:\sitios-web (carpeta Sitios Web)

Un URL consta de cuatro partes:

[protocolo]://[servidor]:[puerto]/[recurso]

• Protocolo: es el mecanismo por el cual deseamos acceder al [recurso] en [servidor]. En nuestro caso, el http.
• Servidor: puede ser el nombre DNS o la dirección IP del servidor al que deseamos conectarnos.
• Puerto: es el número de puerto en donde escucha nuestro servidor. Este puede ir de 0 a 65536. Por defecto, cada protocolo tiene asignado un puerto en particular, por eso no es necesario indicarlo siempre. En el caso del http, el puerto es 80. Es equivalente entonces escribir: http://www.google.com que http://www.google.com:80
• Recurso: es el recurso al cual queremos acceder del servidor. Este recurso puede ser desde una página, un script, una aplicacion, un video, un mp3, etc.

Así que si analizamos http://localhost debemos primero saber ¿qué es localhost?

localhost es un nombre de máquida (convención del protocolo TCP/IP) que hace referencia a la máquina misma en donde se está ejecutando la aplicación que llama al localhost. localhost es traducido internamente por la IP 127.0.0.1, conocida como la IP Local o la IP localhost. Es una dirección IP especial que apunta siempre a tu equipo.

El protocolo TCP/IP admite que cada nombre de host (locahost, google.com, yahoo.com, pablo.enlapc.com) debe estar relacionada con una dirección IP, y estos se resuelven gracias al DNS (Sistema de Nombres de Dominio), que no es más que una simple base de datos que se encarga de traducir Nombre de Host a IP y viceversa.

Cada equipo tiene una pequeña base de datos interna: el archivo hosts. Es un arhcivo de texto que en Windows, lo encontrarás en:

c:\windows\system32\drivers\etc\hosts

Lo puedes abrir con cualquier editor de textos (Notepad) y verás básicamente una línea como:

127.0.0.1 localhost

Esto significa que asocia el localhost a la IP 127.0.0.1 . Si agregas una línea como:

127.0.0.1 mi-pc

Crearás una nueva entrada DNS, y podrás acceder a tu PC bajo: http://mi-pc y al mismo tiempo con http://localhost . Asi que ya aprendiste otra cosa: una misma IP puede tener asignados varios nombres de host

Pero no se te ocurra borrar la entrada 127.0.0.1 localhost porque tendrás muchos problemas: tu máquina simplemente no podrá ser identificada por las aplicaciones que ejecutes en ella y usen el protocolo TCP/IP (es decir Messenger, navegadores de Intenet, lectores RSS, reproductores de video/audio online, etc).

Ahora vamos a otro tema:

Apache es un servidor web. En forma muy abstracta, su función es “servir” recursos ante una petición HTTP. Esos recursos pueden ser variados, desde contenidos estáticos (imágenes, páginas html, etc.) a contenidos dinámicos generados por scripts (tanto PHP, Perl u otros). Cuando está ejecutándose en tu equipo, esta listo para recibir peticiones en el puerto 80 de tu PC.

Al escribir http://localhost en tu navegador web, estarás enviando una petición a tu propia PC implícitamente al puerto 80. Allí es donde el servidor estará escuchando por peticiones bajo el protocolo HTTP. Una petición HTTP tiene básicamente datos como:

• Host
• Tipo de petición (GET, POST, etc.)
• Recurso que se solicita (nombre del archivo, carpeta, etc.)
• Datos que se están enviado al servidor (parámetros)

El trabajo del servidor web es identificar el tipo de petición, procesarla de ser necesario, buscar el recurso en el disco de tu máquina, pasarle los parámetros al recurso si es que existen, y devolver una respuesta (RESPONSE) que puede ser una página, datos, una imagen, una película, lo que se te ocurra también bajo el protocolo HTTP. O simplemente un código de error HTTP para que el navegador muestre un mensaje de error (como el 404, página no encontrada).

Veamos aquí lo más importante: estos recursos son leídos desde una carpeta, procesados por Apache y envíados al cliente que lo solicita. Por tanto, cuando hacemos http://localhost/mipagina.html se asumiría que en algún lugar existe un archivo llamado mipagina.html ¿pero donde? En el DocumentRoot (raíz de documentos).

El DocumentRoot es el directorio en donde guardamos todos los recursos (página, scripts, imágenes, mp3, video, etc.) que queremos que estén disponible para los clientes, los usuarios de nuestros sitio web.

Por defecto, el DocumentRoot que contamos al instalar el XAMPP, está dentro del Directorio XAMPP (c:\xampp) y se llama htdocs. O sea que en c:\xampp\htdocs deberíamos copias nuestras páginas para que estas pueden ser accesibles mediante nuestro navegador web.

Pero, como para mi gusto esto es un tanto incómodo, vamos a configurar Apache y nuestro equipo, para que se capaz de responder a otros nombres de servidor, que identifiquen a nuestros proyectos y podamos poner nuestros archivos en el directorio que querramos.

Organizándonos

Primero que nada, vamos a establecer que todos nuestros sitios web en carpetas individuales dentro de la carpeta Sitios Web (c:\sitios-web). Por ejemplo para el proyecto Librería de Pepe, crearemos una carpeta:

c:\sitios-web\libreria-pepe

Trataremos de no usar espacios y solamente dígitos numéricos y caracteres ASCII para los nombres así nos ahorramos potenciales problemas.

La configuración de Apache

Apache es muy flexible y configurable hasta el infinito. Esto para muchos es un dolor de cabeza, pero es solo cuestión de tiempo hasta conocer como más o menos trabaja.

Cuando comenté más arriba del archivos hosts, te contaba que es posible tener varios nombres de host para una misma dirección IP. Esto es lo que nos va a permitir trabajar con un nombre distinto para cada proyecto.

Gracias al HTTP 1.1, Apache puede trabajar con el concepto de host virtuales (virtual-hosts). Solo hay que indicarle a Apache que para determinado nombre de hosts, busque los recursos en una determinada carpeta y listo .

XAMPP 2.2.2 trae el Apache 2 (versión 2) y su configuración cambia un poco con respecto al Apache 1.3, al menos en XAMPP.

Todos los archivos de configuración están dentro de la Carpeta XAMPP, en c:\xampp\apache\conf y aquí nos interesan dos archivos:

• httpd.conf (archivo principal de configuración)
• extra\httpd-vhosts.conf (archivo de configuración de host virtuales)

Del httpd.conf no necesitamos tocar nada, a menos que quieras aprender y modificar algunos parámetros para cambiar el comportamiento de Apache. Te recomiendo leer la documentación al respecto.

Si tenemos que agregar información en el archivo que está en el directorio extra, el httpd-vhost.conf. Aquí es donde configuramos todos los hosts virtuales.

El # al principio de línea en los archivos de configuración de Apache (y de muchos otros programas), se interpreta como un comentario. Es muy frecuente deshabilitar características de Apache comentando la línea, sin borrarla, para tenerla disponible en un futuro si es necesario.

Encontrarás la línea:

#NameVirtualHost 127.0.0.1:80

Deberás quitarle el comentario, para que te quede:

NameVirtualHost 127.0.0.1:80

Con esto harás que Apache sea capaz de trabajar con hosts virtuales. Ahora nos queda crear un host virtual.

Nuestro primer host virtual en Apache

Recordemos que teníamos un proyecto Librería de Pepe, y íbamos a usar como DocumentRoot la carpeta c:\sitios-web\libreria-pepe. Y usaremos libreria-pepe como nombre de host para este proyecto, a fin de que al tipear http://libreria-pepe, Apache sepa donde buscar los recursos que tiene que servir.

Primer paso: crear la entrada en hosts

En nuestro archivo hosts (nuestra base de datos local de nombres DNS), deberás crear una entrada como la siguiente:

127.0.0.1 libreria-pepe

Segundo paso: crear el host virtual en Apache

Editar el archivo httpd-vhost.conf y agrega lo siguiente:

libreria-pepe:80>
DocumentRoot "c:/sitios-web/libreria-pepe”
ServerName libreria-pepe
ServerAdmin micorreo@electronico.com
<Directory "c:/sitios-web/libreria-pepe“>
Options Indexes FollowSymLinks
Order allow,deny
Allow from all
#Más directivas de configuración de Apache
   </Directory>
</VirtualHost>


Guardas el archivo.

Tercer paso: reinicializar Apache.

Desde la consola de XAMPP, para el servidor HTTP y vuelve a iniciarlo. Esto es para que Apache vuelva a cargar toda la configuración. Si todo salió bien, Apache se iniciará normalmente.

Cuarto paso: Probar

Crea dentro de la carpeta c:\sitios-web\libreria-pepe\ una archivo html con el nombre index.html con el contenido que quieras, por ej:

Bienvenido a la librería de pepe



;


Y ahora, ve a tu navegador favorito (espero que Firefox) y escribe:

http://libreria-pepe/index.html

Debería aparecer:

Hola mundo!

Bienvenido a la librería de pepe

Y de ahora en más…

Solo repite los pasos que te he ido indicando:

1. Crear la carpeta para tu proyecto
2. Crear la entrada en el archivo hosts con el nombre para tu servidor
3. Crear las entradas en httpd-vhost.conf (solo tienes que cambiar los valores que aparecen en negrita por los valores correspondiente al actual proyecto)
4. Reiniciar Apache
5. Probar