Marina passou duas semanas construindo, com ajuda de IA, um simulador de orçamento em HTML. Um arquivo só. O gestor carrega sua planilha, o navegador processa tudo e a ferramenta mostra cenários. Ficou excelente.

Na sexta-feira, ela precisou entregar a ferramenta para 30 gestores. E travou em uma pergunta:

Ela pensou em três saídas:

• Mandar por e-mail. Em uma semana, o arquivo já estava encaminhado para gente que não devia ter, e havia três versões diferentes rodando.
• Subir em um site qualquer. Funcionou, mas o link era público. Bastava alguém copiá-lo.
• Pedir para a TI hospedar. A resposta foi “entra na fila, prazo de 6 semanas”.

Marina não errou. Ela só não tinha um método. Este ebook é o método que ela precisava.

* Condição do plano gratuito da Cloudflare na data de criação deste ebook. Confirme a política atual no site da Cloudflare.

Barreira 1: quem é você?

A Cloudflare Access pede o e-mail e confere se ele está na lista de autorizados. Se estiver, envia um código de uso único para essa caixa de entrada. Só quem tem acesso ao e-mail consegue digitar o código. A sessão dura 24 horas.

Barreira 2: de onde você está vindo?

Um pequeno programa (o “middleware”) confere o endereço de rede (IP) de quem chega. Se não for o da empresa, a resposta é “Acesso negado”, mesmo com e-mail e código válidos. Ele também adiciona selos de segurança nas páginas.

E os dados?

Aqui está o ponto mais importante: como o HTML é autocontido, os arquivos (CSVs, planilhas) que cada pessoa carrega são processados somente no navegador dela. Nada viaja, nada é guardado em servidor.

Um HTML autocontido carrega tudo dentro dele: visual, lógica e imagens. Não puxa nada de fora e não envia nada para fora. Teste simples: abra o arquivo sem internet. Se funciona igual, está no caminho certo.

Auditoria em 5 minutos, sem ser programador

Abra o arquivo no Bloco de Notas, aperte Ctrl + F e procure:

Organize a pasta

minha-ferramenta/
  ├── index.html          ← sua ferramenta (renomeie para index.html)
  └── functions/
        └── _middleware.js ← trava de rede (capítulo 6)

1. Acesse dash.cloudflare.com/sign-up.
2. Use um e-mail corporativo funcional/departamental (ex.: controladoria@suaempresa.com.br) e uma senha forte, evitando amarrar o ativo ao e-mail pessoal de um único analista.
3. Confirme o e-mail, ative a verificação em duas etapas (2FA) e cadastre um segundo administrador de contingência em Manage Account → Members.

dash.cloudflare.com/sign-up

Criar conta

E-mail

admin@suaempresa.com.br

Senha

••••••••••••

Criar conta

Print real: criação da conta gratuita na Cloudflare

Ilustração: ① e-mail funcional ② senha forte ③ criar conta + 2FA

1. Menu Workers e Pages → Criar aplicativo → Pages → Upload direto.
2. Dê um nome (ex.: orcamento-2026).
3. Arraste a pasta com o index.html e clique em Implantar.
4. Você recebe um endereço como orcamento-2026.pages.dev.

Workers e Pages › Criar

Criar um projeto

Nome: orcamento-2026

Arraste aqui a pasta com o index.html

Implantar site

Publicado: orcamento-2026.pages.dev

Print real: Cloudflare Pages: upload direto da pasta com o index.html

Ilustração: ① arraste a pasta ② implante

1. Abra Zero Trust (ou one.dash.cloudflare.com).
2. Escolha o nome da equipe (ex.: minhaempresa).
3. Selecione o plano Free. Se pedirem forma de pagamento, confirme que o plano escolhido é o gratuito (R$ 0 até 50 usuários).

Print real: Zero Trust: escolha do plano Free

1. Access → Applications → Add an application → Self-hosted.
2. Preencha o nome e a Session Duration (24 horas).
3. Role até a seção Destinations: é nela que você define o endereço protegido (próximo passo).

Zero Trust › Access › Applications › Add

Configure a aplicação

Application name

Orçamento 2026

Sessão

24 hours

Next

Print real: Zero Trust › Access: configuração da aplicação

Ilustração: ① nome ② duração

1. Na seção Destinations, em Public hostnames, clique em Add public hostname para abrir uma linha de endereço (marca 1).
2. No campo Subdomain (opcional), digite "*" para que a segurança seja garantida em todos os subdomínios.
3. Abra o menu Domain (marca 3) e selecione, na lista, o domínio da sua conta (marca 4).
4. Deixe Path em branco para proteger o site inteiro. Se criar uma linha por engano, remova-a pelo ícone da lixeira.

Access › Applications › Destinations

Destinations

Public hostnames

Subdomain (optional)

orcamento

Domain

suaempresa.com.br

Path (optional)

Path

+ Add public hostname

Print real: (1) adicionar hostname, (2) subdomínio, (3) lista de domínios, (4) domínio escolhido

Ilustração: ① adicionar ② subdomínio ③ domínio

1. Nome da política: Equipe autorizada. Action: Allow.
2. Em Include → Emails, digite os e-mails autorizados (ou Emails ending in @suaempresa.com.br).
3. Opcional: em Require → IP ranges, informe o IP fixo da empresa.
4. Mantenha One-time PIN ativado e clique em Save.

Access › Applications › Policies

Política: Equipe autorizada

Action: Allow

Include: Emails

maria@suaempresa.com.br

joao@suaempresa.com.br

Require: IP ranges (opcional)

203.0.113.10/32

Login methods

One-time PIN

Print real: política de acesso com e-mails autorizados e One-time PIN

Ilustração: ① e-mails ② rede da empresa ③ código por e-mail

1. Abra uma janela anônima e cole o endereço.
2. Digite um e-mail autorizado e receba o código de 6 dígitos.
3. Digite o código: a ferramenta abre.
4. Teste um e-mail não autorizado: o código não deve chegar.

Sua caixa de entrada

De: Cloudflare Access
Assunto: Seu código de acesso

482 913

Print real: o código de uso único chega por e-mail

Ilustração: ① o código de uso único chega por e-mail

Crie dentro da pasta da ferramenta uma pasta functions e, nela, um arquivo chamado _middleware.js com este texto. Troque apenas os IPs (IPv4 e prefixo IPv6) e o endereço oficial nas primeiras linhas.

// 1) TROQUE pelos IPs fixos ou prefixos de sub-rede (IPv4 e IPv6) da sua empresa
// Aceita IP exato ("203.0.113.10"), sub-rede IPv4 ("198.51.100.") ou prefixo IPv6 ("2804:14c:80:")
const REDES_PERMITIDAS = ["203.0.113.10", "198.51.100.", "2804:14c:80:"];
const HOST_OFICIAL = "orcamento-2026.pages.dev"; // ou "orcamento.suaempresa.com.br"

export async function onRequest(context) {
  const url = new URL(context.request.url);
  const ip = (context.request.headers.get("CF-Connecting-IP") || "").trim();
  const emailAutenticado = context.request.headers.get("Cf-Access-Authenticated-User-Email");

  // 2) Impede bypass por URLs de preview e exige autenticação prévia na Barreira 1
  if (HOST_OFICIAL && url.hostname !== HOST_OFICIAL && !emailAutenticado) {
    return new Response("Acesso negado: utilize o endereço oficial autenticado (403)",
      { status: 403 });
  }

  // 3) Confere se o IP (IPv4 ou IPv6) é exato ou pertence ao bloco da empresa
  const autorizado = REDES_PERMITIDAS.some(regra =>
    (regra.endsWith(".") || regra.endsWith(":")) ? ip.startsWith(regra) : ip === regra
  );
  if (!ip || !autorizado) {
    return new Response("Acesso negado: rede não autorizada (403)",
      { status: 403 });
  }

  // 4) Carrega a ferramenta + selos de segurança, isolamento e privacidade
  const r = await context.next();
  const s = new Response(r.body, r);
  s.headers.set("X-Content-Type-Options", "nosniff");
  s.headers.set("X-Frame-Options", "DENY");
  s.headers.set("Referrer-Policy", "no-referrer");
  s.headers.set("Permissions-Policy", "camera=(), microphone=(), geolocation=()");
  s.headers.set("Cache-Control", "no-store, no-cache, must-revalidate");
  s.headers.set("Content-Security-Policy",
    "default-src 'self' 'unsafe-inline' data: blob:; connect-src 'none'; object-src 'none'; base-uri 'self'; form-action 'none'; frame-ancestors 'none'");
  return s;
}

Publique de novo (Criar nova implantação) e teste: dentro da empresa abre; no 4G do celular deve aparecer “Acesso negado (403)”.

A rotina em 4 movimentos

Erros comuns

Onde isso já funciona

Checklist final

• HTML auditado (sem chamadas de rede e sem credenciais).
• Conta Cloudflare funcional com verificação em duas etapas (2FA) e 2 administradores.
• Protocolo Zero Exposição aplicado (política ativa antes do arquivo sensível).
• Aplicação Access com sessão de 24 h e subdomínios de preview bloqueados.
• Política com e-mails autorizados e código único (One-time PIN) ativos.
• Trava de IP/sub-rede (IPv4/IPv6) e validação de Host testadas dentro e fora da rede corporativa.
• Teste em janela anônima aprovado.
• Logs de acesso conferidos, processo de revogação validado e Rota 2 mapeada para escala acima de 50 usuários.

Glossário rápido