Sobre esta ferramenta
Este codificador / decodificador de URL gratuito codifica texto em porcentagem para que ele possa ser usado com segurança numa URL ou numa query string, e converte uma URL codificada de volta em texto legível.
Ele trata UTF-8 corretamente, então letras acentuadas, emoji e alfabetos não latinos são codificados e decodificados sem corromper nada. Tudo roda no seu navegador — nada é enviado.
O que é a codificação por porcentagem
Uma URL só pode conter um pequeno conjunto de caracteres. Todo o resto — espaços, aspas, &, #, ?, letras acentuadas, qualquer coisa em chinês ou árabe — precisa ser reescrito antes de poder viajar.
A codificação por porcentagem faz isso trocando um caractere por um % seguido do valor do byte em hexadecimal. Um espaço vira %20. Um E comercial vira %26. Um ponto de interrogação vira %3F. É a mesma ideia do Base64 — deixar dados problemáticos aceitáveis para um canal exigente — mas caractere por caractere, o que deixa o resultado bem legível.
Como o que é codificado são bytes, um caractere que ocupa mais de um byte em UTF-8 gera mais de uma sequência. O é ocupa dois bytes e vira %C3%A9. Um caractere chinês normalmente ocupa três e gera três sequências. Um emoji ocupa quatro. É por isso que URLs codificadas com texto que não é em inglês parecem tão compridas.
Por que isso importa: o problema do `&`
Este é o erro que esta ferramenta existe para evitar, e quase todo mundo comete uma vez.
Uma query string separa os valores com & e =:
/pesquisa?q=cafe&pagina=2
Agora imagine que alguém pesquisa Bed & Breakfast. Colocado sem codificar:
/pesquisa?q=Bed & Breakfast&pagina=2
O servidor agora vê três parâmetros — q vale Bed , depois um parâmetro sem sentido Breakfast, depois pagina. A busca devolve a coisa errada sem avisar. Codifique o valor antes e funciona:
/pesquisa?q=Bed%20%26%20Breakfast&pagina=2
Daí a regra: codifique cada valor, não a URL inteira. O & e o = que estruturam a query string precisam ficar sem codificação. O & dentro de um valor, não.
Codificar um valor ou uma URL inteira
Esta é a diferença que confunde, e o motivo de existirem duas funções diferentes em JavaScript.
encodeURIComponent codifica quase tudo, inclusive /, ?, #, & e =. Use para uma única parte de uma URL: um termo de busca, um nome de arquivo, um destino de redirecionamento, um token. É o que você precisa na maioria das vezes, e é o que esta ferramenta faz.
encodeURI não mexe nos caracteres de estrutura, porque parte do princípio de que recebeu uma URL completa e já correta, e só precisa limpar os caracteres inválidos. Use numa URL inteira, nunca num valor isolado.
Se você codificar uma URL inteira com a versão "component", cada / vira %2F e o endereço para de funcionar. Se codificar um valor com a versão "URI", o seu & passa sem codificação e quebra a query string. Saber qual você queria é todo o segredo.
Não é o mesmo que escape de HTML
A codificação por porcentagem e o escape de HTML parecem parecidos e resolvem problemas diferentes.
A codificação por porcentagem (%20, %26) deixa o texto seguro dentro de uma URL. O escape de HTML (&, <) deixa o texto seguro dentro de um documento HTML. Uma URL impressa numa página pode precisar dos dois, e nesta ordem: primeiro codificar para a URL, depois fazer o escape do resultado para o HTML.
E uma esquisitice conhecida: o + às vezes significa um espaço. É herança dos formulários HTML, em que application/x-www-form-urlencoded usa + no lugar de %20. A maioria dos servidores aceita os dois numa query string, mas um + num caminho significa um sinal de mais literal. Se um espaço aparecer como + onde você não esperava, a causa é um codificador de formulário.
Como usar
- Cole seu texto ou URL no campo
- Codifique ou Decodifique com os botões
- Troque para mandar o resultado de volta para a entrada
- Copie o resultado
Bom saber
- Codifique valores, não URLs inteiras. Passar um endereço completo por um codificador transforma cada / em %2F e quebra o endereço.
- Nunca codifique duas vezes. O próprio % é codificado como %25, então uma segunda passada transforma %20 em %2520 e o espaço se perde. É a causa mais comum de um link que quebra sem explicação.
- Os caracteres reservados têm significado — entre eles :, /, ?, #, @, &, =, + e $. Eles são válidos numa URL, mas precisam ser codificados quando aparecem dentro de um valor.
- Os caracteres não reservados nunca são codificados: A–Z, a–z, 0–9, -, _, . e ~.
- Maiúsculas e minúsculas no hexadecimal não fazem diferença. %3f e %3F são idênticos; maiúsculas são a convenção.
- Um % sozinho é inválido. Se a decodificação falhar, procure um % que não seja seguido de dois dígitos hexadecimais — muitas vezes é sinal de um texto cortado.
Perguntas frequentes
O que significa %20 numa URL?
É um espaço. Espaços não são permitidos numa URL, então ele é codificado em porcentagem como %20: um % seguido de 20, o valor hexadecimal do byte de um espaço. Às vezes você vai ver um espaço escrito como +, herança da codificação de formulários; os dois são entendidos numa query string, mas só %20 é correto num caminho.
Devo codificar a URL inteira ou só uma parte?
Só as partes. Codifique cada valor que você coloca *dentro* de uma URL — um termo de busca, um nome de arquivo, um endereço de redirecionamento — e deixe intactos os ://, /, ?, & e = que dão a estrutura. Codificar uma URL completa transforma as barras em %2F e impede que ela funcione.
Por que meu link quebrou depois de codificar?
Quase sempre por codificação dupla. O caractere % é codificado como %25, então codificar um texto já codificado transforma %20 em %2520. O decodificador então devolve um %20 literal em vez de um espaço. Decodifique uma vez para ver o que você realmente tem antes de codificar de novo.
Por que uma letra acentuada vira vários códigos %?
Porque a codificação por porcentagem trabalha com bytes, não com letras. Em UTF-8 o é ocupa dois bytes e por isso vira %C3%A9. A maioria dos caracteres chineses, japoneses e coreanos ocupa três e gera três sequências; os emoji ocupam quatro. Não tem nada errado — é só o peso do caractere.
Qual é a diferença entre codificação de URL e escape de HTML?
Elas protegem lugares diferentes. A codificação de URL (%26) deixa o texto seguro dentro de um endereço web. O escape de HTML (&) deixa o texto seguro dentro de uma página HTML. Um link impresso numa página pode precisar dos dois, nessa ordem. Usar um onde deveria estar o outro deixa o problema original sem solução.
Meu texto é enviado para um servidor?
Não. A codificação e a decodificação acontecem no seu navegador, então nada do que você cola sai do seu dispositivo. A ferramenta continua funcionando mesmo sem internet.
Ferramentas relacionadas
- Codificar / Decodificar Base64 — a outra codificação que aparece o tempo todo em tokens e data URLs
- Formatador JSON — organizar e validar o JSON que muitas vezes viaja nessas query strings
- Decodificador JWT — ler um token que chegou numa URL
- Extrair e-mails e links — tirar todos os links de um bloco de texto