Cuando trabajamos en proyectos web en modo local, ya sea desde casa o en la oficina y necesitamos acceder a ese mismo proyecto desde otro dispositivo (pc, tablet, smartphone…), podemos conectarnos directamente con el equipo donde se encuentra XAMPP ejecutándose a través de su IP local/nombre_del_proyecto.

Pero para ello tenemos que hacer una configuración previa en el equipo donde vamos a tener instalado XAMPP, el cual actuará de servidor web en nuestra red local.

Artículo también disponible en vídeo, por si prefieres seguirlo de este modo:

1. Asignar una IP fija a nuestro equipo con XAMPP.

Por defecto, todas nuestras redes locales (routers) y equipos informáticos vienen configurados para establecer en ellos IPs dinámicas cada vez que se conectan a la red local. Es decir, cuando un smartphone se conecta por WIFI a tu equipo router, este le asigna una dirección IP disponible dentro del rango establecido en la red.

El encargado de hacerlo es el servidor DHCP. Pero no siempre le va a asignar esa misma dirección IP, ya que otro día puede que esa IP ya haya sido tomada por otro dispositivo previamente, y esto es lo que a nosotros nos interesa, que nuestro equipo con el servidor XAMPP instalado siempre tenga la misma dirección IP en nuestra red local.

Pero antes tenemos que comprobar qué rango de direcciones IP podemos utilizar pasa asignar como IP fija, es decir, qué direcciones no va a asignar automáticamente el servidor DHCP a los dispositivos que se conectan a la red. Para ello tenemos que acceder al panel de control de nuestro router mediante su dirección IP.

¿Pero cual es la dirección IP de mi router?

Por defecto, en la mayoría de routers esta dirección suele ser 192.168.1.1 o 192.168.0.1. Pero para asegurarnos vamos a hacer una comprobación.

Si nos encontramos en Windows, necesitaremos acceder a la consola del sistema ejecutando CMD en el menú de inicio. A continuación tecleamos el comando ipconfig y localizamos la dirección marcada como puerta de enlace predeterminada. Esa es la dirección IP de nuestro router.

Si nos encontramos en Linux, abrimos una terminal y ejecutamos el comando netstat -r y localizamos la dirección marcada como pasarela.

Una vez obtenida la dirección IP de nuestro router, nos vamos al navegador y la tecleamos: http://192.168.X.X

Es posible que nos pida una contraseña para entrar, esta puede que venga en la pegatina del router donde aparecen otros datos como el nombre de la red y la contraseña WIFI, o en la documentación que venía adjunta en la caja. Si no la encontramos o la hemos perdido, probaremos con la contraseña «admin» o «1234». Si no, tendremos que llamar a nuestro proveedor de internet para que nos la facilite.

Una vez tecleada la IP en el navegador aparecerá la pantalla de configuración de nuestro router.

Cada router es dintinto y tiene su propio panel de configuración, pero entendiendo el concepto de lo que vamos a hacer, podremos aplicarlo a cualquier router. Tenemos que comprobar qué rango de direcciones IP asigna por defecto el servidor DHCP.

Como podemos ver en la configuración DHCP de mi router, este asigna direcciones IP automáticas desde la 192.168.1.33 hasta la 192.168.1.254. Por lo que cualquier IP que escoja por debajo de la 33 me servirá como IP fija y estaré tranquilo de que ningún otro dispositivo va a recibirla.

Para el ejemplo voy a escoger la IP: 192.168.1.5 (hay que cambiar únicamente el último número, si modificamos el 192.168.1, la red no funcionará).

No olvidemos también apuntar los servidores DNS, ya que tendremos que especificarlos más adelante.

Ahora que sabemos la IP que vamos a utilizar en nuestro equipo servidor, debemos irnos a la configuración de red para establecerla manualmente.

Si estamos en Windows, tendremos que acceder a la configuración TCP/IP Versión 4 de nuestra red:

Por defecto estará en automático, solo tenemos que cambiar a «Usar la siguiente dirección de IP»:

  • Dirección IP: 192.168.1.5 (la dirección IP fija que vamos a establecer).
  • Mascara de red: 255.255.255.0 (se auto-rellena automáticamente).
  • Puerta de enlace predeterminada: 192.168.1.1 (la dirección de nuestro router).

Al rellenar esto, tendremos también que rellenar las direcciones del servidor DNS. Usaremos las que aparecían en la configuración de nuestro router.

Reiniciamos el equipo y ejecutamos de nuevo un ipconfig para comprobar que el equipo ha cogido correctamente la dirección IP que le hemos establecido.

Donde marca Dirección IPv4 debería aparecer nuestro 192.168.1.5 (la imagen es solo un ejemplo).

Si nos encontramos en Linux, buscamos «Configurar conexiones de red»:

Veremos nuestra conexión de red actual. Seleccionamos la pestaña IPv4. Cambiamos el Método a Manual, y rellenamos los campos Dirección, Mascara de Red y Puerta de enlace, tal y como anotamos anteriormente. También establecemos los servidores DNS, separados por comas.

Guardamos los cambios y no es necesario reiniciar en Linux.

Podemos comprobar si nuestro equipo ha cogido bien la nueva IP, ejecutando en una terminal el comando ifconfig.

2. Modificar las URLs de nuestros proyectos WordPress

Ahora si queremos acceder a nuestros proyectos de WordPress desde otro dispositivo conectado a la red local, tendremos que irnos al wp-admin del proyecto y en la sección de Ajustes Generales cambiar la Dirección de WordPress (URL) sustituyendo localhost por nuestra nueva IP, igualmente la Dirección del sitio (URL), tal y como se ve en la imagen:

En Linux no es necesario cambiar nada más, a partir de ahora desde cualquier dispositivo conectado a la red, accediendo desde su navegador web al IP del servidor y a la carpeta del proyecto, podrá visualizar la web.

En Windows es posible que tengamos que modificar un archivo del servidor Apache.

Abrimos nuestro panel de XAMPP y hacemos clic en la sección de Apache, Config y Apache (httpd-xampp.conf):

Hacia el final del archivo, localizamos un código similar a este (puede variar entre versiones de XAMPP):

#
# New XAMPP security concept
#
<LocationMatch “^/(?i:(?:xampp|security|licenses|phpmyadmin|webalizer|server-status|server-info))”>
Require local
ErrorDocument 403 /error/XAMPP_FORBIDDEN.html.var
</LocationMatch>

Y lo sustituimos por este:

    #
    # New XAMPP security concept
    #

    # Close XAMPP security section here
    <LocationMatch “^/(?i:(?:security))”>
    Order deny,allow
    #Deny from all
    #Allow from ::1 127.0.0.0/8
    Allow from all
    ErrorDocument 403 /error/HTTP_XAMPP_FORBIDDEN.html.var
    </LocationMatch>

    # Close XAMPP sites here
    <LocationMatch “^/(?i:(?:xampp|licenses|phpmyadmin|webalizer|server-status|server-info))”>
    Order deny,allow
    #Deny from all
    #Allow from ::1 127.0.0.0/8
    Allow from all
    ErrorDocument 403 /error/HTTP_XAMPP_FORBIDDEN.html.var
    </LocationMatch>

Reiniciamos el servidor y ya debería funcionar. (Y si no, siempre puedes pasarte a Linux ;))

Eso es todo, espero que os haya sido de utilidad y me dejéis vuestros comentarios si tenéis alguna duda o problema.