IA dentro do app: chave de API, custo por uso e onde a chave nunca fica

Nesta aula

Colocar IA dentro do seu app é fácil. Colocar sem vazar a chave que paga a conta é o que importa.

Até agora você usou a IA para construir. Agora o app vai usar a IA por dentro: um botão que resume um texto, classifica uma mensagem, sugere uma resposta. Para isso o app precisa de uma chave de API, e essa chave é dinheiro. O erro mais comum que vejo em projetos feitos por quem não programa é a chave dentro de um arquivo que o navegador baixa. Nesta aula você entende o que é a chave, como se paga, onde ela nunca pode ficar, e faz um botão de resumo funcionar do jeito certo.

• Ao final, você vai saber o que é uma chave de API, como o custo por uso funciona e como colocar um limite.
• Vai entender por que a chave nunca vai no código que o navegador baixa, e qual é a alternativa.
• Vai sair com um botão "resumir" funcionando no seu computador, com a chave guardada fora do código.

Chat e API: a mesma IA, dois jeitos de pagar

Quando você usa o Claude, o ChatGPT ou o Gemini pelo site ou pelo aplicativo, está usando o chat: uma assinatura mensal (ou o plano gratuito) para uma pessoa conversar. Quando o seu app precisa chamar o modelo, ele usa a API: uma porta para programas, cobrada por uso. São contas separadas. Ter assinatura do chat não dá uso de API, e vice-versa.

A API funciona assim: o seu app manda um pedido (o texto a resumir e as instruções) para o servidor do provedor, junto com a chave que identifica a sua conta. O provedor processa e devolve a resposta. Cada ida e volta é cobrada pelo tamanho do que foi enviado e recebido, medido em tokens (pedaços de palavra). Textos maiores e respostas longas custam mais. Modelos mais capazes custam mais por token do que modelos menores.

Como não ter surpresa na conta

• Limite mensal na conta. Todo provedor sério permite definir um teto de gasto. Faça isso antes de criar a chave. É o cinto de segurança.
• Confira o preço atual. Não vou citar valores: mudam com frequência e variam por modelo. A página oficial de preços do provedor tem a tabela.
• Modelo pequeno para tarefa pequena. Resumir um e-mail não precisa do modelo mais caro. Peça à IA para usar "o modelo mais barato que faz essa tarefa bem" e teste a qualidade.
• Conte as chamadas. Um botão que a equipe clica cem vezes por dia são cem chamadas. Faça a conta antes de liberar.

A regra que não tem exceção: a chave nunca vai no que o navegador baixa

Aqui está o ponto central da aula. Tudo o que está num arquivo HTML, CSS ou JavaScript de um site publicado é baixado pelo navegador de cada visitante. Qualquer pessoa pode abrir o código-fonte (botão direito, "exibir código-fonte") e ler. Se a chave está lá, ela está pública. Não importa se está "escondida" no meio do código, em letras trocadas, ou numa linha que "ninguém vai ver". Bots varrem a internet procurando exatamente isso, e uma chave vazada é usada em minutos, na sua conta.

A IA sabe dessa regra, mas se você pedir "coloque a chave no index.html para funcionar", ela pode obedecer, com um aviso que você talvez não leia. Por isso a regra é sua, não dela.

Então onde a chave fica?

Do lado que o visitante não vê: um programa que roda num servidor (ou no seu computador, para uso local). O navegador manda o texto para esse programa; o programa, que tem a chave, chama o provedor e devolve a resposta ao navegador. O visitante nunca vê a chave. Esse programa intermediário tem nomes técnicos (proxy, backend, função serverless), mas a ideia é só essa: um porteiro que guarda a chave.

O pedido: botão que resume um texto, com a chave fora do código

Você vai pedir duas coisas: a página com o botão, e o servidor pequeno que guarda a chave e chama o provedor. A IA escolhe a tecnologia do servidor; você define as regras. Antes, crie a chave na página oficial do provedor (na área de API da sua conta) e defina o limite mensal. Copie a chave para um lugar seguro, como o gerenciador de senhas. Ela aparece só uma vez.

Repare em "NUNCA pode aparecer em nenhum arquivo desta pasta" e no pedido final de confirmação. Você está fazendo a IA auditar o próprio trabalho. Depois, faça a sua auditoria: abra cada arquivo no editor e use a busca (Ctrl + F) procurando por um pedaço da chave. Não pode aparecer.

Se o seu provedor for outro (OpenAI, Google), troque o nome da API e da variável no pedido; a estrutura é a mesma. Se preferir não ter chave nenhuma, peça a versão com Ollama: "em vez da API, chame um modelo local do Ollama que já está rodando nesta máquina".

Rodar, testar, ver o custo

Siga as instruções que a IA deu: definir a variável de ambiente, iniciar o servidor (um comando no terminal), abrir a página pelo endereço local que ela indicar (algo como http://localhost:3000; "localhost" quer dizer "este computador"). Cole um e-mail inventado e clique em resumir. Depois de alguns testes, abra o painel do provedor e veja o consumo. É a primeira vez que você vê o custo de uma chamada de verdade, e vale a pena olhar.

O que enviar para a IA, e o que não enviar

Quando o app manda um texto para o provedor, esse texto sai do seu computador e vai para os servidores dele. É o mesmo cuidado de colar texto no chat: nada de dado sensível de terceiros sem necessidade e sem base para isso. Para o botão de resumo do contador, isso significa: e-mails de clientes contêm dados pessoais e às vezes financeiros. Duas atitudes práticas:

• Anonimizar antes de enviar, quando possível: o app pode trocar CPFs e números de conta por "[CPF]" e "[CONTA]" antes de chamar a IA. Peça isso: "antes de enviar, substitua padrões de CPF, CNPJ e números de conta por marcadores".
• Ler a política de dados do provedor: se ele usa o que você envia pela API para treinar modelos, e por quanto tempo guarda. Isso está na documentação de cada um e muda entre chat e API. Confira a versão atual.

Na aula 10, o checklist de segurança junta isso com o resto. Por enquanto, a regra: o app manda o mínimo necessário, e nunca manda o que você não mandaria por e-mail para um estranho.