Cómo crear hosts virtuales en XAMPP

La creación de hosts virtuales o virtualhosts es prácticamente imprescindible cuando trabajas en múltiples proyectos a la vez, de modo que cada host tenga su configuración propia y un dominio local asignado. Para crear un host virtual debes configurar Apache para que acepte la creación de hosts virtuales y, tras esto, ya podrás crear todos los que quieras.

El proceso de creación de hosts virtuales en XAMPP es muy aparecido al que sigues cuando usas una instalación normal de Apache, estando la única diferencia en los directorios y en la localización de los archivos de configuración.

Hosts virtuales en Windows con XAMPP

Primero veremos cómo crear hosts virtuales en Windows y, tras esto, veremos también cómo crearlos en cualquier versión de Linux.

Archivo httpd.conf

Lo primero que debes hacer es incluir el archivo httpd-vhosts.conf en la configuración de Apache, que es en donde definiremos los hosts virtuales. Para ello sigue los pasos que ves a continuación. Decir que solamente deberás realizar esta configuración la primera vez que agregas un host virtual.

1. Accede al directorio de instalación de XAMPP, que por defecto está en el directorio c:/xampp. Luego navega hasta el directorio apache -> conf y edita el archivo httpd.conf con cualquier editor de texto, como Notepad++ o el bloc de notas. También puedes editar este archivo desde el panel de configuración de XAMPP, haciendo clic en la opción Config del servicio Apache.
2. Debes buscar la siguiente línea, en la sección # Virtual hosts:
   

   #Include conf/extra/httpd-vhosts.conf

3. Debes borrar el comentario de la línea eliminando el caracter sostenido # del inicio de la misma:
   

   Include conf/extra/httpd-vhosts.conf

4. Luego desplázate hasta el bloque <Directory />, que por defecto tendrá los siguientes valores, a no ser que los hayas cambiado previamente:
   

   <Directory />
     Options Indexes FollowSymLinks
     AllowOverride None
   </Directory>

5. Modifica la opción AllowOverride y asignale el valor All:
   

   <Directory />
     Options Indexes FollowSymLinks
     AllowOverride All
   </Directory>

6. Por último guarda el archivo y reinicia XAMPP desde su panel de control.
   

A continuación agregaremos los detalles del host virtual.

Archivo httpd-vhosts.conf

Lo primero que debes hacer es editar el archivo httpd-vhosts.conf, que por defecto podrás encontrar en la ruta C:\xampp\apache\conf\extra\httpd-vhosts.conf y agregar el siguiente código, reemplazando dominio.localhost en la opción ServerName por el nombre del dominio que quieras usar con tu host virtual y c:/ruta/directorio en la opción DocumentRoot por la ruta absoluta hasta la carpeta en donde están los archivos de tu proyecto:

<VirtualHost *:80>
  ServerName dominio.localhost
  DocumentRoot "c:/ruta/directorio"
</VirtualHost>

A modo de recomendación, el dominio local que escojas debería tener la extensión .localhost para evitar posibles problemas con tu navegador.

Siguiendo el esquema que hemos visto, crearemos el host virtual miproyecto.localhost y lo asociaremos con el directorio C:/Users/edu/hosts/miproyecto. La configuración sería la siguiente:

<VirtualHost *:80>
  ServerName miproyecto.localhost
  DocumentRoot "C:/Users/edu/hosts/miproyecto"
</VirtualHost>

Para acceder el host desde tu navegador tendrías que acceder a la URL miproyecto.localhost, ya que es el valor de la opción ServerName. Apache buscará los archivos de este proyecto en el directorio C:/Users/edu/hosts/miproyecto especificado en la opción DocumentRoot.

Luego guarda el archivo,

Archivo de hosts

Todavía tenemos que agregar el dominio que hemos especificado el archivo de hosts del sistema operativo para que lo reconozca como local. Para ello debes acceder al directorio C:\WINDOWS\system32\drivers\etc\, abrir el archivo /hosts y agregar la siguiente línea:

127.0.0.1 miproyecto.localhost

Finalmente guarda el archivo y reinicia MAMP.

Si accedes a la URL miproyecto.localhost ya deberías ver el proyecto o los contenidos del directorio que hemos especificado en la creación del host.

Hosts virtuales en Linux con XAMPP

Ahora veremos cómo crear hosts virtuales en Linux. Esto debería funcionar tanto si tienes XAMPP instalado en Ubuntu como si está instalado en Linux Mint o cualquier otra distribución de Linux. Para este proceso de configuración usaremos el editor gedit, pero podrías usar cualquier otro, como kate o nano. Lo único que necesitarás para seguir este tutorial son ciertos conocimientos básicos acerca de la terminal de comandos de Linux.

Archivo httpd.conf

Lo primero que debes hacer es abrir la terminal de comandos y editar el archivo httpd.conf con cualquier editor de texto:

sudo gedit /opt/lampp/etc/httpd.conf

Debes buscar la siguiente línea, en la sección # Virtual hosts:

#Include etc/extra/httpd-vhosts.conf

Tienes que eliminar el caracter de sostenido # del inicio de la línea para borrar con ello el comentario y que así Apache lea el archivo indicado cuando se inicie:

Include etc/extra/httpd-vhosts.conf

Ahora, debes buscar la opción AllowOverride del bloque <Directory /> y modificar la opción AllowOverride para que tenga el valor All:

<Directory />
  ..
  AllowOverride All
</Directory>

Luego guarda el archivo.

Archivo httpd-vhosts.conf

Para agregar el host virtual debes editar el archivo httpd-vhosts.conf, cosa que puedes hacer mediante este comando:

sudo gedit /opt/lampp/etc/extra/httpd-vhosts.conf

Los hosts virtuales siguen siempre el mismo esquema, así que agrega el código que ves a continuación, reemplazando dominio.localhost por el dominio que quieras usar con tu virtualhost y /ruta/directorio por la ruta completa hasta la carpeta en donde están los archivos de tu proyecto:

<VirtualHost *:80>
  ServerName dominio.localhost
  DocumentRoot "/ruta/directorio"
</VirtualHost>

Se recomienda que el dominio que escojas tenga la extensión .localhost para evitarte posibles problemas de incompatibilidad con el navegador.

Por ejemplo, vamos a crear el host virtual miproyecto.localhost y lo vamos a enlazar con el directorio /opt/lampp/htdocs/miproyecto.localhost. La configuración sería la siguiente:

<VirtualHost *:80>
  ServerName miproyecto.localhost
  DocumentRoot "/Users/edu/hosts/miproyecto.localhost"
</VirtualHost>

Finalmente guarda el archivo.

Archivo de hosts

Abre la terminal de comandos y ejecuta el siguiente comando para abrir el archivo de configuración de hosts de macOS:

sudo gedit /etc/hosts

Seguramente se te pida tu contraseña de administrador cuando lo abras.

Debes agregar la línea siguiente al final del archivo:

127.0.0.1 miproyecto.localhost

Por último guarda el archivo y luego reinicia XAMPP

Tras reiniciarlo, ya deberías ver el proyecto de tu directorio si accedes a la URL miproyecto.localhost.

Y esto ha sido todo.

---