Crea una URL pública de tu localhost utilizando Ngrok

April 15, 2021

Con Ngrok podremos exponer un servidor web que se ejecuta de manera local a Internet. Esto puede resultar útil para testear nuestros proyectos en diversos dispositivos como teléfonos móviles muy fácilmente antes de estar en producción.

Instalación

Debemos abrir una nueva terminal y ejecutar el siguiente comando:

npm i -g ngrok

Otra alternativa es descargar ngork desde su sitio web https://ngrok.com/download.

Ejecutar proyecto en localhost

Para utilizar Ngrok debemos tener nuestro proyecto ejecutándose en localhost, una forma simple de hacer esto es utilizando el modulo SimpleHTTPServer de python.

Para utilizarlo debemos asegurarnos de tener instalado python en nuestro ordenador, de no ser así puedes descargarlo desde su sitio web.

Una vez instalado abrimos una terminal y nos posicionamos en la carpeta donde se encuentra el proyecto a levantar, y ejecutamos el siguiente comando:

En Mac y Linux

python -m SimpleHTTPServer

Windows

python -m http.server

Esto nos levantará un servidor local en el puerto 8000 por defecto, podemos visualizarlo en http://localhost:8000.
Para cambiar el puerto en que se ejecutará solo debemos especificarlo al final del comando:

python -m http.server 4000

Luego de seguir estos pasos ya tendremos nuestro proyecto ejecutándose en localhost.

Iniciar ngrok

Es recomendable crear una cuenta en https://ngrok.com para comenzar, si bien es posible utilizar Ngork sin necesidad de registrarse, al no tener una cuenta tendremos ciertas limitaciones, como por ejemplo el tiempo de duración de nuestras URLS y más.

Si decides no registrarte para obtener una nueva URL solo debes ejecutar en la terminal:

ngrok http 8000

El número final depende del puerto en que estés ejecutando tu proyecto en local.

En caso de tener una cuenta debemos vincularla con nuestro equipo ingresando el token de autenticación en la terminal, este se encuentra en nuestro perfil de usuario en la sección Your Authtoken.



Ingresamos el comando que nos proporciona Ngrok en la terminal:

ngrok authtoken <token de autenticacion>

Luego de realizar esto nuestra cuenta ya estará vinculada.

Proteger URLS con contraseña

Una de las funciones extras a las que tenemos acceso al tener una cuenta de Ngrok es la capacidad de proteger con usuario y contraseña nuestras URLS. El comando para realizar esto es el siguiente:

ngrok http -auth="usuario:contrasena" 8080

Por ejemplo:

ngrok http -auth="emi:239294sA" 300

Esta es una de la muchas funciones que ofrece ngrok para más información puedes consultar su documentación oficial en https://ngrok.com/docs.