Replicar dominio con SSL (https) online a local con Virtual Host (Xampp)

virtual host ssl

Seguro cuando desarrollas una web o quieres modificar alguna, siempre lo haces de manera local ingresando a «localhost/» de tu navegador, en esta publicación te enseño a trabajar tu dominio con SSL de manera local.

Ya habíamos comentado en esta publicación lo tedioso que es modificar las rutas de tu web para trabajar en el localhost y luego al terminar volver a modificar las rutas para subirlo al dominio, por eso en esta publicación te muestro como te puedes evitar tantos dolores de cabeza, tan solo replicando el dominio online a local y agregando un certificado SSL (sin validar), asi cuando termines de desarrollar una web solo tendras que copiar archivos al hosting sin modificar ruta alguna, lo mismo con la BD.

Ojo, en esta publicación trabajaremos con XAMPP en Windows, si deseas algo más completo y recomendable, puedes usar Laravel Homestead o Docker.

¿Qué es lo que queremos?

Trabajar de manera local nuestra web con XAMPP sobre el dominio original y con un certificado SSL, así dejar de lado el «localhost/».

Ejemplo: «https://www.misitio.com« o «https://mitisio.com«, de manera local en tu Xampp – Apache.

Ojo, el certificado SSL con el que trabajaremos no estará validado, asi que te saldrá un error de SSL no válido al querer ingresar a tu dominio local por medio del «https://», solo debes darle en continuar para seguir trabajando.

¿Cómo puedo realizarlo?

Realizando los siguientes pasos te muestro la solución.

Crear carpeta en htdocs

Primero tienes que crear una carpeta con el nombre de tu web en la carpeta htdocs donde esta instalado el Xampp.

Abrir y editar archivo «httpd-vhosts.conf»

El archivo se encuentra en la siguiente ruta:

...\xampp\apache\conf\extra\httpd-vhosts.conf

Abrelo y agrega la siguiente información al final de todo el contenido del archivo:

<VirtualHost *:443>
DocumentRoot "C:/xampp/htdocs/MiSitio"
ServerName www.misitio.com
ErrorLog "C:/xampp/htdocs/MiSitio/error_log.log"
SSLEngine on
SSLCertificateFile conf/ssl.crt/server.crt
SSLCertificateKeyFile conf/ssl.key/server.key
</VirtualHost>

Para el ejemplo de la publicación, tomaremos el dominio www.misitio.com como prueba, el cual será reemplazado por su dominio, de igual manera en “DocumentRoot” agregamos la ruta de la carpeta de tu web que creamos. (Paso 1)

Normalmente Xampp por defecto se instala en la partición C:/, por ello en el código puse C:/, pero deben poner la unidad de la partición donde instalarón el Xampp.

Al final deberia quedar así:

Localhost de Xampp

Luego, guardan y cierran el archivo.

Abrir y configurar archivo «hosts» de Windows

El archivo se encuentra en la siguiente ruta:

C:\Windows\System32\drivers\etc\hosts

Abren el archivo y agregan esta información al final:

127.0.0.1  https://www.misitio.com
127.0.0.1  www.misitio.com

Al final deberia quedar así:

Listo, guardan y cierran el archivo.

Ojo, el archivo «hosts» no te permitirá editarlo sino eres administrador, para tal caso, copia el archivo “hosts” al escritorio, luego lo editas, guardas y vuelves a copiar el archivo «hosts» a su ruta original, reemplazándolo.

Ver tu dominio con SSL de manera Local

Ahora abres tu Xampp e inicias Apache, si estaba iniciado, reinicialo.

Copia tu web a la carpeta con el nombre de tu web en el «htdocs» (Paso 1).

Abre tu navegador, ingresa tu dominio https://www.misitio.com, te saldrá un error de seguridad, solo dale en ignorar y continuar, ahora podrás visualizar tu web.

LEER  Configurar correo corporativo en GMAIL GRATIS

Ahora podrás desarrollar tu web sin problemas, al final, solo subes tus archivos terminados al hosting y no tendrás que preocuparte por cambiar las rutas.

Ojo, si tienes algún error no te olvides de ver como esta configurado tu archivo «.htaccess» del hosting, si da algún error, puedes dejar vacio el «.htaccess» o revisar la documentación de tu Framework o CMS con el cual estas trabajando, por mi parte recomiendo nunca eliminar código, solo comentarlo, o en todo caso realizar un backup.

NOTA:

  • Es necesario que tu hosting cuente con un certificado SSL validado para que no tengas el error de seguridad al ver tu web cuando lo subas a tu hosting.
  • Para tener varios dominios virtuales funcionando a la vez, solo agrega cada configuración uno debajo del otro en los archivos «httpd-vhosts.conf» (Xampp) y «hosts» (Windows).
  • Si deseas que tu web sea «https://misitio.com» en lugar de «https://www.misitio.com», solo debes eliminar el www en todas las configuraciones arriba y listo.

2 comentarios de “Replicar dominio con SSL (https) online a local con Virtual Host (Xampp)

Deja una respuesta

Tu dirección de correo electrónico no será publicada.