Base64
7 ferramentas
O que é codificação?
A codificação é o processo de converter dados de uma representação para outra. No desenvolvimento web, a codificação é usada para transmitir dados com segurança através de canais projetados para um conjunto de caracteres limitado. Por exemplo, imagens binárias precisam ser convertidas em texto antes de serem incorporadas em documentos HTML ou enviadas em e-mails.
A codificação de caracteres define como os caracteres de texto mapeiam para bytes. A codificação Base64 converte dados binários em texto ASCII. A codificação URL torna o texto arbitrário seguro para uso em URLs. Compreender essas três camadas de codificação evita erros sutis e vulnerabilidades de segurança.
História da codificação de caracteres
A codificação de caracteres é o mapeamento entre caracteres e suas representações binárias:
Código Padrão Americano de 7 bits. 128 caracteres: letras inglesas, dígitos, pontuação e códigos de controle.
ASCII estendido para línguas da Europa Ocidental. Adicionou 128 caracteres. Não adequado para scripts não latinos.
Conjunto de caracteres universal cobrindo todos os sistemas de escrita do mundo. Define pontos de código para mais de 149.000 caracteres.
Codificação de largura variável do Unicode usando 1–4 bytes por caractere. Compatível com ASCII. A codificação dominante na web.
Codificação de largura variável usando 2 ou 4 bytes por caractere. Usado internamente pelo Windows, Java e strings JavaScript.
Codificação de largura fixa: sempre 4 bytes por caractere. Raramente visto na web.
Por que o UTF-8 ganhou
O UTF-8 tornou-se dominante porque é compatível com ASCII, é autossincronizante e eficiente em espaço para texto latino. Qualquer documento ASCII é um documento UTF-8 válido. Essa compatibilidade retroativa tornou a migração gradual possível sem quebrar sistemas existentes.
Codificação Base64
Base64 converte dados binários em uma representação de texto usando apenas 64 caracteres ASCII imprimíveis: A–Z, a–z, 0–9, + e /. Isso é necessário quando dados binários devem viajar através de canais que só lidam com texto. O nome "Base64" vem justamente do fato de que o alfabeto tem 64 símbolos, cada um representando exatamente 6 bits de dados.
Como funciona
Base64 agrupa os bytes de entrada em blocos de 3 bytes (24 bits) e codifica cada bloco como 4 caracteres Base64 (6 bits cada). Essa relação 3:4 é a razão pela qual Base64 aumenta o tamanho dos dados em aproximadamente 33%. Se a entrada não for múltipla de 3 bytes, caracteres de preenchimento = são adicionados para completar o último grupo:
| Entrada | Bytes hex | Base64 |
|---|---|---|
| "Man" | 77 61 6E | TWFu |
| "Ma" | 4D 61 | TWE= |
| "M" | 4D | TQ== |
Os caracteres de preenchimento = indicam quantos bytes faltavam para completar o último grupo de 3 bytes. Um = significa que um byte de preenchimento foi necessário; == significa que dois bytes foram necessários. O Base64 padrão sempre produz saída com comprimento múltiplo de 4. Algumas implementações, como a variante Base64url usada em JWT, omitem o preenchimento por ser implícito pelo comprimento da string.
Codificação URL
URLs só podem conter um conjunto limitado de caracteres ASCII seguros. Qualquer caractere fora desse conjunto deve ser codificado em porcentagem antes de ser colocado em uma URL.
A codificação de porcentagem substitui cada byte inseguro por % seguido de dois dígitos hexadecimais representando o valor desse byte. Um espaço se torna %20, um e comercial se torna %26, e assim por diante.
Caracteres comumente codificados
| Caractere | Codificado | Notas |
|---|---|---|
| Space | %20 | Mais comum; usado em envios de formulário como + em application/x-www-form-urlencoded |
| & | %26 | Separador de string de consulta; deve ser codificado quando usado como valor literal |
| = | %3D | Separador chave-valor em strings de consulta; codificar quando usado como dado |
| + | %2B | Interpretado como espaço em application/x-www-form-urlencoded; codificar para preservar + |
| # | %23 | Identificador de fragmento; codificar quando usado como dado literal |
| / | %2F | Separador de segmento de caminho; codificar quando usado como dado literal |
| : | %3A | Separador de esquema; codificar em contextos de caminho e consulta |
| @ | %40 | Usado em mailto: e auth; codificar quando usado como dado literal |
encodeURI vs encodeURIComponent
JavaScript fornece duas funções de codificação com escopos diferentes. encodeURI codifica uma URL completa — preserva os caracteres que têm significado estrutural em URLs como :, /, ?, # e @. encodeURIComponent codifica um componente de URL — codifica todos os caracteres exceto A-Z, a-z, 0-9, -, _, ., ~. Use sempre encodeURIComponent para valores individuais e encodeURI para URLs completas.
Onde a codificação aparece no desenvolvimento web
O cabeçalho Authorization: Basic codifica credenciais como Base64(usuário:senha). Isso é codificação para conveniência de transporte, NÃO segurança. Base64 é trivialmente reversível — qualquer pessoa que intercepte o cabeçalho pode decodificá-lo imediatamente. Sempre use HTTPS com Basic Auth para garantir que as credenciais sejam protegidas pela camada de transporte.
URIs de dados incorporam conteúdo de arquivo diretamente em HTML ou CSS: data:image/png;base64,.... Codificar imagens elimina solicitações HTTP adicionais, mas aumenta o tamanho do documento em cerca de 33%. Essa técnica é mais adequada para ícones pequenos e imagens críticas que devem ser renderizadas sem latência de rede.
O e-mail foi projetado para ASCII de 7 bits. Anexos binários como imagens e PDFs são codificados em Base64 pelo MIME antes da transmissão. O cliente de e-mail decodifica os anexos de forma transparente ao exibir a mensagem. Isso explica por que arquivos enviados por e-mail chegam com tamanho ligeiramente maior do que o original.
Os tokens JWT usam codificação Base64url para as três partes: cabeçalho, payload e assinatura. Isso torna os tokens seguros para URLs sem necessidade de codificação de porcentagem adicional. A variante Base64url substitui + por - e / por _, e omite o preenchimento = para produzir strings mais compactas.
Qualquer dado fornecido pelo usuário em strings de consulta URL deve ser codificado em porcentagem. Deixar de codificar & ou = em um valor corrompará silenciosamente a análise da string de consulta. Use sempre encodeURIComponent em valores individuais.
Nomes de domínio não ASCII são codificados usando Punycode (prefixo xn--) para compatibilidade com o sistema DNS. O navegador exibe a forma Unicode, mas envia a forma Punycode para os resolvedores DNS.
Perguntas frequentes
Não. Base64 é codificação, não criptografia. É uma transformação reversível sem chave secreta — qualquer pessoa que veja uma string Base64 pode decodificá-la instantaneamente usando qualquer ferramenta online. Esse equívoco é perigoso: desenvolvedores que armazenam senhas ou dados sensíveis em Base64 pensando estar protegidos estão completamente enganados. Nunca use Base64 como medida de segurança.
Base64 processa entrada em grupos de 3 bytes. Se a entrada não for múltipla de 3, preenchimento = é adicionado para completar o último grupo. Um = significa um byte de preenchimento; == significa dois. Algumas implementações, como Base64url para JWT, omitem o preenchimento porque o comprimento da string já indica implicitamente quantos bytes foram codificados.
Base64url é uma variante segura para URLs que substitui + por - e / por _, e tipicamente omite o preenchimento =. Isso torna Base64url diretamente utilizável em URLs e cabeçalhos HTTP sem precisar de codificação de porcentagem adicional. Além de JWT, Base64url é usado em fluxos de autenticação OAuth 2.0, identificadores de sessão e em parâmetros do PKCE (Proof Key for Code Exchange).
Use encodeURIComponent para valores individuais como parâmetros de consulta ou segmentos de caminho. Use encodeURI para uma string URL completa onde você quer preservar os caracteres de estrutura de URL. Em caso de dúvida, prefira encodeURIComponent.
UTF-8 é compatível com ASCII e eficiente em espaço para texto latino. HTTP e HTML usam UTF-8 por padrão.
A codificação de porcentagem representa caracteres como % seguido de seu valor de byte hexadecimal. Um espaço é %20. Caracteres UTF-8 de múltiplos bytes têm cada byte codificado separadamente: o caractere é é representado como %C3%A9.
Base64 aumenta o tamanho dos dados em ~33% e adiciona sobrecarga de CPU para codificação e decodificação. Em sistemas de alto desempenho que transferem grandes volumes de dados binários, prefira protocolos binários nativos como gRPC ou WebSockets com frames binários. A codificação URL adiciona sobrecarga mínima, mas pode tornar as URLs significativamente mais longas quando há muitos caracteres especiais.
Punycode é uma codificação para representar caracteres Unicode no sistema DNS compatível com ASCII. Domínios como münchen.de se codificam como xn--mnchen-3ya.de.