Encurtador de link fácil em JavaScript, Cloudflare Workers e Telegram Bot

E se você precisar criar um link curto rapidamente? Claro - use um encurtador de link. E se você também tornar este link legível? Ainda usa seu próprio domínio? E seria melhor fazer isso sem servidores adicionais. Parece que existe uma resposta.






Fundo

A ideia de um "encurtador de link fácil" surgiu quando eu estava procurando uma opção de redirecionamento usando um domínio para uma das salas da nova rede social Clubhouse . A essência da ideia do reencaminhamento de chamadas da sala era reiniciar uma sala com o mesmo nome, mas sempre online . Era necessário resolver o problema de mudar constantemente o endereço da sala estacionando tal link para o subdomínio.





A decisão veio por si só, já que o site foi pré-plantado no Cloudflare. Inicialmente, usei a função “Regras da Página”, que permite definir, entre outras coisas, regras de redirecionamento, mas logo surgiu a ideia de tornar esse redirecionamento mais flexível e mutável sem a necessidade de entrar nas configurações do serviço. Claro, o Telegram Bot se tornou a solução.





Formulação do problema

Para cumprir nosso plano, vários problemas precisam ser resolvidos:





  • Como redirecionar de um subdomínio específico?





  • Onde salvar links por chave (abreviação) - valor (endereço de encaminhamento)?





  • Como criar tais abreviações?





Como você deve ter adivinhado, as respostas a essas perguntas estão no próprio título do artigo. Portanto, proponho passar para a parte prática.





Condições prévias

Para uma descrição mais detalhada, observarei as condições básicas necessárias para a implementação do nosso projeto:





  • Domínio conectado ao Cloudflare;





  • Conhecimentos gerais de JavaScript;





  • Bot do Telegram criado;





  • Documentação para Cloudflare Workers e Telegram Bot API .





Como cumprir as pré-condições necessárias não é abordado neste artigo. A solução para esses problemas permanece com o leitor.





Treinamento

, , — « ?». :





1. – Cloudflare KV.





Cloudflare KV — Worker' « - ». , Cloudflare.





: Workers KV, , .





Página Cloudflare KV
Cloudflare KV

. , . , , .





Dentro do nosso cofre

2. Worker .





«Create worker», Worker («Save and Deploy») .





É assim que a página do novo Worker se parece
Worker'

«Settings» Telegram , .





Configurações do trabalhador
Worker'

3. -





, url.mydomain.com



, «-» -.





Página de trabalhadores para nosso domínio
Workers

, «Workers» «Route» -.





Adicionando um novo redirecionamento

, , (path - ) .



.





, DNS DNS .





Novo registro DNS que conterá o encurtador de link
DNS

! .





. , Cloudlfare. Worker. «Quick edit» .





Editor de código

:













(URL path) . 404.





addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request))
})

/**
 * Respond to the request
 * @param {Request} request
 */
async function handleRequest(request) {
  const requestUrl = new URL(request.url);
  const path = requestUrl.pathname.substring(1); //   "/"
  return await redirect(path)
}

/**
 * Make redirect
 * @param {string} shortName
 */
async function redirect(shortName) {
  //        
  const url = await db.get(shortName);
  if (url) {
    //   
    return Response.redirect(url)
  }
  //    
  return new Response(null, {status: 404})
}

      
      



, , :





Existe um contato!
!

. . Telegram URL. , Telegram User ID . . webhook'.





addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request))
})

const ADMIN = 11111111; //   Telegram User ID

/**
 * Respond to the request
 * @param {Request} request
 */
async function handleRequest(request) {
  const requestUrl = new URL(request.url);
  const path = requestUrl.pathname.substring(1);
  //        
  if (path == BOT_TOKEN) {
    return await bot(await request.json())
  }

  return await redirect(path)
}

/**
 * Make redirect
 * @param {string} shortName
 */
async function redirect(shortName) {
  const url = await db.get(shortName);
  if (url) {
    return Response.redirect(url)
  }
  return new Response(null, {status: 404})
}

/**
 * Create new shorten URL
 * @param {Object} update
 */
async function bot(update) {
  //     
  if (update.message.from.id != ADMIN) {
    return new Response("OK", {status: 200})
  }
  //    "shortname url"
  const [shortName, url] = update.message.text.split(" ");
  //    
  await db.put(shortName, url);
  const response = {
    //         
    "method": "sendMessage",
    //        -  
    "text": ` ${url}     url.mydomain.com/${shortName}`,
    //   ,     ADMIN (  ), 
    //  update.message.chat.id      
    //     
    "chat_id": update.message.from.id
  }

  return new Response(
    JSON.stringify(response), 
    {
      status: 200,
      headers: new Headers({"Content-Type": "application/json"})
    }
  )
}

      
      



, , :





Parece viável

( ):





Trabalhando

– Telegram Bot Webhook. , :





https://api.telegram.org/bot[BOT_TOKEN]/setWebhook?url=url.domain.com/[BOT_TOKEN]







Telegram API :





{"ok":true,"result":true,"description":"Webhook was set"}
      
      



. , , .



« !»





« » .





, Cloudflare Worker'. , :





  • 1000 ( );





  • leitura do banco de dados até 100.000 vezes ao dia (número máximo de visitas);





  • o próprio script pode ser executado até 100.000 vezes por dia (o número de mensagens para o bot e visitas a links encurtados);





  • o script deve ser executado no máximo 1000 vezes por minuto.





Essas restrições devem ser suficientes para uso pessoal, dê sua opinião sobre isso nos comentários.








All Articles