App gratuito no Cloudflare Workers + botão PIX de doação

O problema

Construí uma calculadora judicial: uma ferramenta gratuita e de utilidade pública. Para deixá-la acessível na internet, hospedei o projeto em uma VPS pequena — que nada mais é do que um servidor virtual, como se fosse um computador simples alugado na nuvem.

A ferramenta funcionou muito bem por meses. Mas aí veio a surpresa: ela viralizou em um grupo de WhatsApp de advogados e atingiu 5 mil acessos em um único dia. O resultado? O computador virtual não aguentou a carga e caiu. Para resolver, precisei contratar um servidor maior e mais potente. Só que a conta chegou rápido: de repente, eu estava pagando R$ 200 por mês para manter uma ferramenta gratuita no ar, sem ter nenhum retorno financeiro.

O Cloudflare Workers resolveu a primeira parte desse sufoco. Ele é um serviço que roda o seu código direto na nuvem (“no edge”, ou seja, em servidores espalhados pelo mundo bem pertinho do usuário), permitindo até 100 mil requisições diárias sem cobrar nada e sem que você precise cuidar de um servidor físico ou virtual.

Mas ter um lugar “gratuito para hospedar” não resolve o problema de “manter o projeto vivo”, já que eu continuava sem orçamento. Foi aí que decidi adicionar um botão de doação via PIX, mas sem usar um gateway de pagamento (empresas intermediárias que processam cobranças).

Este artigo é o passo a passo completo desse processo: como colocar a aplicação no ar (fazer o deploy) no Workers e como integrar o botão de PIX direto no frontend (a tela visível do site). Sem mensalidade de plataformas como o Mercado Pago, sem taxas por transação e sem burocracia.

O deploy do app no Workers

A parte de infraestrutura (a preparação do ambiente para o site rodar) é bem direta:

Desenvolva localmente. Crie o seu aplicativo em HTML/JS com a API rodando no Worker. Para testar tudo no seu próprio computador antes de colocar na internet, use o comando:

npm run dev

Deploy (colocar o site no ar):

npx wrangler pages deploy dist --project-name seu-app

Para projetos no Workers que são mais complexos (com toda a lógica de backend, que é a parte interna que processa os dados), usa-se o comando wrangler deploy em vez de pages deploy. A diferença entre eles está no foco: o Pages é voltado para páginas estáticas somadas a funções leves; o Workers é focado em APIs puras. (Exploro essa distinção no artigo sobre Pages Functions.)

Segredos, nunca “hardcoded”. “Hardcoded” significa escrever uma informação secreta diretamente no código. Se a sua aplicação consome serviços externos (como inteligência artificial ou envio de e-mails), a chave de acesso deve ficar salva com segurança no servidor do Worker (env.API_KEY), e nunca no frontend. O Cloudflare permite cadastrar esses segredos com segurança no painel, no caminho: Settings → Variables and Secrets. Guardar uma chave no frontend é o mesmo que vazá-la: qualquer pessoa que abrir o DevTools (a ferramenta de inspeção do próprio navegador) consegue visualizar sua chave secreta.

O botão de doação PIX

Esta foi a solução que salvou o projeto. Eu não usei um gateway de pagamento (como Mercado Pago, Stripe ou Asaas). Para doações simples entre pessoas (P2P ou peer-to-peer), usar um gateway é exagero (overkill): você tem que pagar mensalidades, taxas sobre cada transação, configurar webhooks (notificações automáticas entre sistemas) e passar por processos chatos de verificação de identidade (KYC). O PIX copia-e-cola resolve tudo isso de forma muito mais simples.

A lógica é a seguinte: você gera uma única vez o código (payload) do PIX da sua chave (com um valor fixo ou livre), e cola esse texto direto no código HTML da sua página. O visitante clica em “Copiar”, abre o aplicativo do banco dele e faz a transferência. Simples assim.

Gerar a payload PIX

Existem ferramentas de código aberto e APIs gratuitas (como a gerencianet/pix-dict) onde você informa a sua chave PIX (seu telefone, e-mail ou uma chave aleatória) e o valor desejado. O sistema gera para você o texto no padrão oficial do BR Code (a payload copia-e-cola). Como esse texto é gerado uma única vez e não muda (é estático), você pode colá-lo direto no HTML do seu site.

Segurança: nunca compartilhe uma chave PIX pessoal (como seu CPF) em um lugar público onde qualquer um possa te identificar. Se você usa o CPF como chave, crie uma chave aleatória no aplicativo do seu banco só para essa finalidade. Eu não vou colocar a minha chave real neste artigo exatamente por esse motivo.

O HTML

<div class="pix-donation-card">
  <h3>Apoie este projeto! ☕</h3>
  <p>Esta ferramenta ajudou você? Considere fazer uma doação de qualquer valor.</p>

  <img src="URL_DO_SEU_QR_CODE_FIXO" alt="QR Code PIX">

  <div class="pix-copy-area">
    <input type="text" value="00020126...SUA_PAYLOAD_FIXA..." id="pixKey" readonly>
    <button onclick="copiarPix()">Copiar Código PIX</button>
  </div>
</div>

<script>
function copiarPix() {
  const pixInput = document.getElementById("pixKey");
  pixInput.select();
  document.execCommand("copy");
  alert("Chave PIX copiada! Abra o app do seu banco.");
}
</script>

O texto da chave que fica no campo value é estático: gerado uma vez só e colado no código HTML. Não existe nenhum processamento de servidor (backend) envolvido na doação, apenas na ferramenta em si. O visitante copia o código, faz o pagamento no banco dele e você recebe o valor. A taxa é zero (já que o PIX é gratuito para pessoas físicas e para muitos tipos de contas jurídicas).

Onde colocar

No meu caso, posicionei o card de doação depois que o resultado da calculadora é entregue ao usuário. Ele usa a ferramenta, obtém a informação que precisava e só então vê a opção de doar. Esse é o momento de maior goodwill (boa vontade) do usuário, pois a ferramenta acabou de resolver o problema dele. Colocar o pedido de doação antes de entregar o resultado funciona como uma barreira (paywall) e afasta os visitantes.

Por que essa combinação funciona

A união do Cloudflare Workers com o PIX funciona perfeitamente para projetos independentes por um motivo simples: ambos eliminam os intermediários.

Workers elimina a necessidade de manter e pagar por um servidor dedicado (oferecendo um limite gratuito imenso e ajuste automático para suportar muitos acessos).
PIX copia-e-cola elimina o gateway de pagamento que cobraria mensalidades e comissões sobre cada doação recebida.

Juntas, essas duas ferramentas permitem que uma aplicação gratuita continue existindo sem gerar custos para quem a criou, além de receber doações diretas. Para um projeto que viralizou no WhatsApp e recebeu 5 mil acessos em um único dia, essa arquitetura é a diferença entre “ter que tirar o site do ar por causa dos custos” ou “manter a ferramenta funcionando para todos”.

O que aprendi

A grande lição desse processo é: nem toda infraestrutura precisa de um servidor dedicado, e nem todo pagamento precisa de uma plataforma intermediária. Quando estamos criando algo sério, a tentação é tentar copiar a estrutura de empresas gigantes — contratando servidores VPS, plataformas de pagamento e bancos de dados gerenciados. Mas, para projetos independentes e com pouca ou nenhuma receita, cada um desses serviços representa um custo fixo que pode encerrar o projeto antes mesmo dele crescer. O plano gratuito do Cloudflare e o PIX direto na conta seguem a mesma ideia: aproveitar recursos gratuitos e eficientes que já existem, em vez de pagar por uma complexidade desnecessária.

E a segunda lição, mais prática sobre a experiência do usuário: as doações acontecem quando o processo é sem atrito (frictionless) e surge no momento certo. Um botão de doação logo na página inicial, antes de a pessoa testar a ferramenta, é totalmente ignorado. Já um botão posicionado logo após a entrega do resultado, que permite copiar o código com apenas um clique, gera conversão. O momento em que você pede ajuda é tão importante quanto a forma como você recebe.