Muchas veces en nuestro trabajo como desarrolladores web necesitamos contar con un certificado de seguridad SSL en localhost o ambiente de pruebas para poder testear nuestro código y subir a producción correctamente, hoy veremos como hacer esto paso a paso.

Actualmente contar con un certificado de seguridad SSL es una obligación para cualquier proyecto en Internet.

Contratar un certificado de seguridad para nuestros proyectos o el de nuestros clientes no es complicado, de hecho es muy sencillo.

El problema viene cuando estamos trabajando en un proyecto en un ambiente local y necesitamos trabajar con https.

Instalar un certificado de seguridad SSL en localhost no es fácil pero tampoco es complicado, digamos que solo requiere un poco de tiempo, seguir instrucciones y listo.

Hoy veremos cómo hacer esto paso a paso creando un certificado falso que nos valdrá para nuestro entorno local, vamos con las instrucciones.

Cabe aclarar que vamos a hacer esto utilizando XAMPP aunque bien las instrucciones pueden adaptarse a otro entorno.

Paso 1

Vamos a crear una carpeta llamada crt en c:/xampp/apache/.

Paso 2

Ahora vamos a descargarnos un par de archivos que nos servirán para crear nuestro certificado de seguridad.

cert.conf

make-cert.bat

Sigue estos enlaces y haz clic sobre el botón Raw y guarda el contenido con el nombre correspondiente de cada enlace (sin extensión .txt).

Estos archivos irán en la carpeta crt que recién creaste.

Paso 3

Para crear el certificado necesitamos editar el archivo cert.conf.

Buscamos todas las ocurrencias del texto {[DOMAIN]} y remplazamos por un nombre de dominio.

En mi caso utilizaré pruebas.dev, tú puedes utilizar otro pero recuerda que cuando haga referencia al mío deberás utilizar el tuyo.

También asegúrate de sustituir las llaves de {{DOMAIN}} con tu dominio de tal modo que quede algo así: pruebas.dev. (a muchos les falla por dejar las llaves).

Paso 4

Una vez tengamos editado nuestro archivo cert.conf vamos a ejecutar el archivo make-cert.bat.

Este archivo es un pequeño script que nos ayudará a crear el certificado de seguridad.

Al ejecutarlo nos preguntará el dominio, colocamos pruebas.dev.

A las demás preguntas podemos simplemente dar enter, presionamos una tecla para salir.

Esto nos habrá generado una carpeta con el nombre de nuestro dominio.

Paso 5

Accedemos a la carpeta pruebas.dev y veremos dos archivos.

server.crt y server.key

Hacemos doble clic sobre server.crt y procedemos a instalar el certificado.

SSL en localhost - 1

Hacemos clic sobre Instalar certificado.

Posteriormente en Ubicación del almacén elegimos Dirección local.

En la opción Colocar todos los certificados en el siguiente almacén en la opción En Almacén de certificados elegimos Examinar.

Seleccionamos Entidades de certificación raíz de confianza y hacemos clic en Aceptar y luego en Siguiente.

Revisamos y hacemos clic en Finalizar.

Ahora el certificado está instalado y nuestro equipo confía en él.

Paso 6

Lo que falta es indicarle a XAMPP que utilice este ssl en localhost.

Primero, necesitamos editar el archivo host de nuestro windows.

Vamos a la ruta C:/Windows/system32/drivers/etc/hosts.

Agregamos al final la linea:

127.0.0.1    pruebas.dev

para enlazar las peticiones de pruebas.dev a nuestra IP local.

Segundo, necesitamos editar el archivo httpd-xampp.conf de nuestro Xampp.

Vamos a la ruta C:/xampp/apache/conf/extra/httpd-xampp.conf.

Agregamos al final la linea:

## pruebas.dev
 <VirtualHost *:80>
     DocumentRoot "C:/xampp/htdocs"
     ServerName pruebas.dev
     ServerAlias *.pruebas.dev
 </VirtualHost>
 <VirtualHost *:443>
     DocumentRoot "C:/xampp/htdocs"
     ServerName pruebas.dev
     ServerAlias *.pruebas.dev
     SSLEngine on
     SSLCertificateFile "crt/pruebas.dev/server.crt"
     SSLCertificateKeyFile "crt/pruebas.dev/server.key"
 </VirtualHost>

Reiniciamos los servicios de Xampp y nuestro navegador web.

Ahora podemos acceder a localhost para ver nuestros proyectos con http:// y a pruebas.dev para ver nuestros proyectos con https://.

SSL en localhost - 2 SSL en localhost - 3

Si esta información sobre cómo crear un certificado de seguridad en localhost te fue de utilidad no olvides compartirla en tus redes sociales o dejarnos un comentario en la sección de abajo si tienes cualquier duda respecto a este tema, será un placer ayudarte.

¡Hasta luego!

Clic para valorar esta información

[Total: 3 Promedio: 5]

Certificado de seguridad SSL en localhost