Cómo configurar un virtualhost en XAMPP para Windows: Guía paso a paso


Victor Arana Flores

19 Jul 2022

En el siguiente articulo te explicaré cómo crear un host virtual en tu ordenador local para acceder al dominio virtual de cada proyecto. Esta práctica permite que tu servidor web Apache local use varios nombres de host, por lo que puedes acceder a cada proyecto a través de una URL separada. Esto es útil para mantener la estructura de carpetas del proyecto local y acceder a los archivos de desarrollo local desde cualquiera de tus computadoras. En este artículo, te enseñaremos cómo crear un host virtual en Windows y cómo configurar Apache para aceptar hosts virtuales.

1) Crear un host local en Windows

El primer paso es configurar el archivo "hosts" de Windows, que mantiene una lista de nombres de dominio que se pueden asignar a direcciones IP. Para hacerlo, sigue estos pasos:

Abre el Bloc de notas como administrador. Haz clic con el botón derecho en el icono del Bloc de notas y selecciona "Ejecutar como administrador".

Abre el archivo "hosts" ubicado en C:\Windows\System32\drivers\etc.

Añade la IP local y el nombre de host que desees virtualizar separados por un espacio o tabulador. Por ejemplo:

127.0.0.1 miproyecto.local.com

Como puede ver, primero se indica la IP local 127.0.0.1, seguida de los nombres de los hosts virtuales, separados por espacios o tabuladores. El resultado se parecerá más o menos a la imagen de abajo. 

 

2) Configurar Apache para aceptar hosts virtuales

El segundo paso es abrir el archivo de configuración de Apache para el host virtual "vhost". El archivo se encuentra en esta ruta en mi Xampp: C:\xampp\apache\conf\extra\httpd-vhosts.conf. Sigue estos pasos para configurar Apache:

  1. Abre el archivo httpd-vhosts.conf con cualquier editor de texto.
  2. Agrega las siguientes líneas al final del archivo:
NameVirtualHost *
<VirtualHost *>
  DocumentRoot "C:\xampp\htdocs"
  ServerName localhost
</VirtualHost>
<VirtualHost *>
  DocumentRoot "C:\miproyecto\httpdocs"
  ServerName miproyecto.local.com
  <Directory "C:\miproyecto\httpdocs">
    Require all granted
  </Directory>
</VirtualHost>

Las primeras líneas indican que el host virtual localhost sigue siendo la carpeta "htdocs" de Xampp, para que puedas conservar los archivos que tienes actualmente en tu host local. Las siguientes líneas crean el host virtual miproyecto.local.com y lo asocian con la carpeta "httpdocs" de tu proyecto. La última línea permite el acceso a la carpeta "httpdocs" a través de tu servidor web Apache.

La lista de códigos en el archivo httpd-vhosts.conf se parece más o menos a esto:

Reiniciar Apache

Una vez que haya realizado los cambios en los archivos de configuración de Apache, es importante reiniciar el servidor Apache para que los cambios tengan efecto. Si ha realizado cambios en el archivo php.ini, también debe reiniciar el servidor. Recuerde que estos pequeños detalles pueden ahorrarle tiempo y evitar frustraciones innecesarias.

Arreglar "¡Acceso prohibido!" Error 403

Es posible que se encuentre con el error 403 "Acceso prohibido" y el mensaje "No tienes permiso para acceder al directorio solicitado..." después de configurar los hosts virtuales en XAMPP. Este error ocurre cuando Apache rechaza las conexiones debido a su configuración de Virtualhost.

Para solucionar este problema, puede cambiar algunas líneas en el bloque "Contenidos". La siguiente configuración debería funcionar para usted:

<Directory "C:\miproyecto\httpdocs">
   Options All
   AllowOverride All
   Require all granted
</Directory>

En muchos sitios web, resuelven el mismo problema y brindan varias otras variantes de configuración que puede probar si encuentra este error de acceso. Le sugiero que consulte el enlace Access Forbidden Error 403 (XAMPP) (Windows 7) que tiene muchas variaciones y configuraciones que han funcionado para muchos otros desarrolladores.

Abriendo el virtual host recién configurado

Una vez que haya configurado su host virtual, simplemente cree un archivo "index.html" o "index.php" y podrá acceder a él desde su navegador utilizando la siguiente dirección:

http://miproyecto.local.com

Permitir el listado de directorio

En algunos casos, es útil permitir la lista de directorios en el host virtual para que se muestre una lista de carpetas y archivos cuando se accede a un directorio que no tiene un documento predeterminado. Para habilitar esto, agregue la siguiente línea de configuración en el elemento "directory":

<Directory "C:\miproyecto\httpdocs">
    Order allow,deny
    Allow from all
    Options Indexes FollowSymLinks
</Directory>

Con estos pasos, habrá configurado sus hosts virtuales en XAMPP y podrá comenzar a desarrollar en un entorno más avanzado. Si desea probar su proyecto en otros sistemas, tabletas o teléfonos a través de una conexión Wi-Fi, puede acceder a él desde cualquier dispositivo en su red local. ¡Sigue desarrollando!


3 comentarios

Inicia sesión para comentar

Comentarios:

  • Juan Roldan

    Juan Roldan hace 1 año

    Hola, la ruta de mi proyecto se encuentra en Google Drive, por lo que mi DocumentRoot queda “G:\Mi unidad\Developer\PHP\pildorasinformaticas\Curso PHP MySQL”, el problema es el espacio en "Mi unidad", por lo que no me funciona, pero no puedo “eliminar” el espacio por ser de Google Drive, alguna idea para que funcione?

  • Alberto Esquenazi

    Alberto Esquenazi hace 1 año

    Hola 
    Muy buen ejemplo. 
    Segui los pasos pero , me da el error de “acceso prohibido ” aunque agregué las lineas que indicarron,
    Estoy corriendo desde xampp con apache 2,4 y php 8.2 con W10 
    alguna idea ?
    desde ya gracias 

  • Ene Castillo

    Ene Castillo hace 2 años

    Saludos Amigos de Coders Free, en mi caso, segui los pasos y el error que me indica el navegador es que La conexión no es privada. ¿Como pudiera solucinarlo?

    • Victor Arana Flores hace 2 años

      Hola Ene, eso no es un error, te está indicando que la conexión no es privada, ya que te conectas por http

      Cuando pases a producción, tienes que instalar un certificado SSL