Imagina manipular as requisições para o seu site sem precisar ter uma instância de servidor web? Fazer testes A/B, redirecionar tráfego sem precisar editar uma linha de um apache ou Nginx. Essas são só algumas das qualidades da edge computing.
Edge Computing e Workers
É um termo para classificar scripts que rodam próximo ao cliente que fez a requisição. A Cloudflare foi a primeira empresa que lançou essa nova estratégia lá em 2017 e desde então outras empresas também suportam essa forma de host e desenvolvimento. Os principais ganho dessa estratégias são:
- Performance: por conta das respostas aconterecem perto da geografia do cliente o tempo de carregamento fica abaixo dos 50ms!!
- Valor: Existe uma camada gratuita para um Cloudflare Worker que cobre muitos casos de uso, e caso precise pagar, começa em apenas 5 doláres/mês
- Facilidade: Tudo que precisa ser feito é saber escrever javascript! E toda manipulação de chamadas de servidor será feita usando a mesma implementação da API de Web Worker que os navegadores já usam, ou seja, sem precisar se preocupar com servidor web nunca mais!
Exemplo: Redirecionar subdomínio para rotas.
Um bom exemplo personalizado que precisei fazer foi criar a rota deste blog aqui! Originalmente o endereço dele é um subdomínio da Cloudflare rhamses-blog.pages.dev mas eu queria que fosse acessado via rhams.es/blog
Criando uma instância do Cloudflare Pages
A primeira etapa que fiz foi criar uma instância no serviço Cloudflare pages. Originalmente o blog estava hospedado na netlify.com mas por motivos de compatibilidade com a minha stack, preferi transferir tudo para a Cloudflare. O processo de criação é praticamente o mesmo, basta linkar com o seu perfil do github, ou subir diretamente os arquivos finais. Quando o processo concluir, terei um subdomínio do site hospedado no Cloudflare.
Criando um Service Worker para redirecionamento
E agora sim chegamos ao ponto da questão! Para criar um service worker tudo o que precisamos fazer é escrever javascript e seguir as convenções da Web Worker API.
Na interface web é possível testar a chamada através do mini navegador no canto direito e inspecionar o seu retorno no console que fica na parte inferior do mesmo lado.
Para acompanhar o código que escrevi para criar o redirecionamento deste exemplo criei um gist com todos os comentários necessários, mas em resumo o que estamos fazendo é:
- Interceptar a requisição do cliente que digitou
rhams.es/blog - Alterar a chamada para o domínio original
rhamses-blog.pages.dev - Montar a página HTML e devolve-la para o cliente.
- Tudo isso em menos de 50ms!!!
Service Worker criado, e agora?
Para completar a configuração é preciso unir o seu domínio com o worker recém criado. Se o domínio já estiver dentro do Cloudflare pode facilitar se o objetivo for associar o worker direto com um domínio ou subdomínio. Neste caso é necessário criar uma regra de redirecionamento que completa este ciclo.
Você pode acessar de duas maneiras: Via Workers Routes dentro da página do domínio
ou através do menu routes dentro da página do Web Worker que criamos anteriormente.
Aqui configuro para que toda a chamada ocorrida, seja http ou https, para *rhams.es/blog*seja redirecionada para o Worker criado.
Atenção para o wildcard(*) no começo e no final sem barra
Dessa forma, se tudo foi criado certo, agora todo o acesso do blog poderá ser feito via https://rhams.es/blog e toda a estratégia de SEO, sitemaps funcionam olhando para essa URL em definitivo.
Cuidados especiais
- Para este tipo de deploy precisei reconfigurar meu blog para rodar abaixo da rota
/blogao invés da raiz do domínio como estava anteriormente. - Toda alteração de rotas demora alguns segundos para fazer efeito, então não se assuste se algo não atualizar na hora.
- Fique atento as configurações de DNS e sempre use as rotinas pré programadas da Cloudflare para Não ter problemas, principalmente com certificados.
- Veja os exemplos para se inspirar agora!
