Usando o ngrok

O ngrok é uma ferramenta fácil de usar que permite criar um túnel seguro na máquina local junto com um URL público que pode ser usado para testar o projeto local ou para compartilhar o trabalho para revisar com um cliente ou colega de equipe.É possível configurar HTTP ou HTTPS e, devido à popularidade desta ferramenta, se algo parar de funcionar, há vários artigos que descrevem diferentes maneiras de resolver o problema.Este artigo aborda algumas maneiras fáceis de instalar o ngrok e o que fazer se não conseguir que o aplicativo da web se comunique com o ngrok.

ngrok

Nossos amigos do ngrok escreveram um excelente artigo dedicado ao suporte de webhooks do Frame.io via ngrok.Confira aqui.

Instalar o ngrok

Você pode usar o ngrok de algumas maneiras diferentes

Instalar por meio do instalador do ngrok

  1. Acesse o site do ngrok e siga as instruções: https://ngrok.com/download
  2. Se quiser os recursos oferecidos ao conectar uma conta, siga estas instruções para obter uma conta e token.

Não é necessário obter uma conta ou adicionar o token, mas confira a página de download para ver se é algo que você quer ou precisa.

Observação:

Se usar esse método, o ngrok executa do local onde você o armazena, a menos que o torne disponível em todo o sistema.

Instalar com o Homebrew

Este é meu método favorito para instalar o ngrok.Se você tem o Homebrew instalado, tudo que precisa fazer é digitar homebrew cask install ngrok.O ngrok é instalado para você e pode ser usado de qualquer lugar!O melhor de tudo é que não é preciso digitar ./ngrok no terminal no início de cada comando, pode simplesmente digitar ngrok.Saiba mais sobre esta opção aqui.

Usar o ngrok

Depois de configurar o ngrok, escolha uma porta como 3000 e execute a partir de uma linha de comando do terminal com o comando ngrok http 3000.Não é preciso usar a porta 3000, mas esta é uma porta comumente usada para escolher na configuração.Se você configurar o ngrok para executar de uma pasta específica, você deve estar na pasta onde colocou o ngrok e usar o comando ./ngrok http 3000.

Inicie seu servidor para seu projeto escutar na mesma porta e você poderá acessar seu trabalho usando o endereço público fornecido pelo ngrok.

Solucionar problemas do ngrok com seu aplicativo da web – Barra final

Um problema que você pode enfrentar com o ngrok é não conseguir se conectar ao seu servidor quando configurar um URL do ngrok para uso com seu aplicativo da web.O que é frustrante sobre esse problema é que o ngrok não registrará que você enviou algo para ele.Você pode abrir o localhost:4040 para ver o que está acontecendo, e ele não mostrará nada.(localhost:4040 é fornecido pelo ngrok para que você possa monitorar qualquer solicitação recebida ao seu servidor.)O ngrok parece combinar endereços com /(.) em vez de (/.), então se você não incluir uma barra final no final do seu endereço e não vir nada nas ferramentas de monitoramento do ngrok, é porque o ngrok não está encontrando uma combinação para o endereço que você lista.

Aqui está um exemplo de adição de uma barra final: http://something.ngrok.io/ Você também pode escrever seus aplicativos de amostra para resolver um ponto de acesso que inclui uma barra.Apenas lembre-se de que para o aplicativo Frame.io alcançar seu servidor, se seu aplicativo de exemplo usar o ponto de acesso /actions, você precisa adicionar o ponto de acesso /actions no final do seu endereço ngrok.Por exemplo, se o endereço ngrok for http://something.ngrok.io, você precisaria fornecê-lo na configuração da Ação personalizada como http://something.ngrok.io/actions.Isso pode ser diferente para outros aplicativos da web, então experimente com o final do endereço ngrok se você não conseguir fazer as coisas funcionarem imediatamente.

Posso usar algo além do ngrok?Experimente o Glitch!

O Glitch é uma alternativa bem legal ao ngrok e é mais rápido de configurar.O Glitch permite criar uma conta e então criar seus próprios aplicativos usando os servidores deles com um URL publicamente acessível.Você pode colaborar com outras pessoas, tornar seu código público ou privado e escolher entre uma ampla variedade de linguagens e plataformas.Confira https://glitch.com/create para ver o que está disponível.Quando você configurar seu projeto no Glitch, para alguns aplicativos da web, o problema da barra final se aplica.No caso do Frame.io, quando você configura uma Ação personalizada em developer.frame.io, precisa incluir a barra final no final do URL fornecido pelo Glitch.Você não precisa adicionar mais nada, nem mesmo para o ponto de acesso /actions.

Há algo configurado que eu poderia experimentar agora?

Sim. Se você não quiser usar o ngrok ou criar seu próprio projeto no Glitch, configuramos um aplicativo de exemplo para você experimentar aqui: https://frameio-custom-action.glitch.me.Lembre-se de incluir uma barra final quando adicionar este endereço na área de Ações personalizadas de developer.frame.io.

Recursos

Esta seção lista os recursos listados ao longo do artigo: