Permitindo acesso externo à aplicações locais com Ngrok

Fala, galera! Nesse tutorial lhe ensino como você pode usar a ferramenta chamada Ngrok, para permitir o acesso externo às suas aplicações que estão rodando em ambiente local.

Figura 1 – Logo ngrok.

O ngrok, permite que você exponha aplicações em execução na sua máquina local à Internet. Você só precisa informar ao ngrok em qual porta sua aplicação está sendo executada, então, ele se encarrega de fazer todo o redirecionamento e lhe disponibiliza um link de acesso público à sua aplicação. Você pode conhecê-lo melhor através do seu site oficial https://ngrok.com/.

Recursos do ngrok:

  • Túneis seguros – Você tem suporte à servir sua aplicação utilizando HTTPS(SSL).
  • Inspeção de requisições – Monitore as requisições que estão sendo feitas para a sua aplicação.
  • Proteção com senha – Garanta a proteção de suas aplicações definindo uma senha para acessá-la.

Para este tutorial estou utilizando como sistema operacional, o Ubuntu 18.04. Mas você pode segui-lo por completo para qualquer plataforma, pois o procedimento é o mesmo.

Eu tenho rodando na minha máquina uma aplicação Laravel, que está sendo servida na porta 8000 do meu localhost – (http://localhost:8000).

Figura 2 – Aplicação Laravel rodando em ambiente local

Só precisamos agora baixar o ngrok para nossa máquina, e descompactar o executável para utilizá-lo:

Acesse https://ngrok.com/download, e faça o download de acordo com seu sistema operacional, e descompacte o executável. Como dito a cima, você baixa apenas um executável do ngrok, assim, você não precisa instalá-lo em sua máquina.

Agora, vamos de fato iniciar o ngrok para permitir o acesso externo à nossa aplicação Laravel, que está rodando localmente na porta 8000.

Em seu terminal, ou prompt de comando, navegue até a pasta onde extraiu o executável do ngrok:

cd /home/rafael/ngrok

Vamos então usar o ngrok para criar um túnel HTTP, redirecionando as requisições recebidas, para o nosso localhost em uma porta específica, no meu caso 8000, mas você deve definir essa porta conforme a porta que sua aplicação está escutando.

./ngrok http 8000
Figura 3 – Saída do comando de iniciar o ngrok

Pronto! Já temos nossa aplicação sendo acessível externamente e com HTTPS(SSL), através do seguinte endereço: https://942d8af8.ngrok.io, conforme você pode visualizar na imagem acima.

Vamos então acessar o endereço para confirmar se tudo está funcionando perfeitamente.

Figura 4 – Acessando aplicação local externamente.

Nossa aplicação já está agora disponível ao público. 🙂

Como você deve ter visualizado ao iniciar o ngrok, a sessão tem duração de 8 horas, sendo necessário iniciar novamente, para obter um novo endereço.

Para resolver isso precisamos apenas criar uma conta gratuitamente no ngrok e adicionar o token à nossa máquina.

Crie sua conta no ngrok acessando https://dashboard.ngrok.com/user/signup.

Com sua conta criada, você deve navegar até a opção Auth no menu lateral, e irá visualizar o seu token de autenticação.

Figura 5 – Dashboard ngrok

Já com o seu token em mãos, pare o serviço atual do ngrok que está rodando, utilizando o comando “Ctrl + C”. E informe ao ngrok qual é o seu token de autenticação, com o comando:

./ngrok authtoken SEU_TOKEN_DEVE_VIR_AQUI

Pronto, seu ambiente local, está autenticado com o token de sua conta. Agora apenas inicie novamente o serviço do ngrok, que sua aplicação já estará com um link definitivo até que você pare manualmente.

Figura 6 – ngrok rodando sem limites de sessão.

Espero que tenham gostado desse tutorial. Qualquer dúvida é só deixar nos comentários. Não se esqueça de compartilhar este tutorial pra ajudar a outras pessoas.

Até a próxima.