Codificador e decodificador de URL

A estrutura de uma URL depende de que caracteres específicos — `/` para separar segmentos de caminho, `?` para introduzir a string de consulta, `&` para separar parâmetros, `#` para um fragmento — carreguem um significado estrutural fixo onde quer que apareçam. Se um valor colocado dentro de uma URL, como um termo de busca ou o nome de um usuário, por acaso contém literalmente um desses mesmos caracteres, precisa haver alguma forma de distinguir "este ampersand é parte do valor real" de "este ampersand separa dois parâmetros de consulta". A codificação percentual é esse mecanismo: qualquer caractere com significado estrutural, quando precisa aparecer como dado literal em vez de estrutura, é substituído por um `%` seguido de seu valor de byte hexadecimal, então `&` vira `%26` e é lido sem ambiguidade como dado em vez de separador de parâmetros.

O erro de codificação de URL mais comum, de longe, é codificar uma URL completa montada com a função errada — usar `encodeURIComponent`, que escapa cada caractere reservado incluindo `/`, `:`, `&` e `?`, sobre um endereço inteiro em vez de sobre um único valor individual. O `://` depois do protocolo vira `%3A%2F%2F`, cada `&` separando parâmetros de consulta vira `%26`, e a URL para de ser uma URL de jeito nenhum — vira uma longa string codificada sem nenhuma estrutura que um servidor possa analisar. A abordagem correta é a ordem inversa: codifique primeiro cada valor individual — o termo de busca, o destino de redirecionamento, seja qual for o dado real — e só então insira esses valores já codificados na estrutura de URL ao redor, nunca codificando novamente o conjunto montado depois.

É precisamente por isso que esta ferramenta oferece dois modos distintos em vez de um botão genérico de "codificar": o modo de componente para codificar um único valor prestes a se tornar parte de uma URL, e o modo de URL completa para o caso mais raro de codificar um endereço inteiro enquanto deliberadamente preserva seus caracteres estruturais.

Duas convenções de codificação distintas para espaços continuam em uso ativo hoje, e não são intercambiáveis. A codificação percentual, o padrão de propósito geral, representa um espaço como `%20` e é válida em qualquer lugar de uma URL — o caminho, a string de consulta, em todo lugar. A convenção `+` para um espaço vem de um padrão mais antigo e limitado especificamente para envios de formulário HTML usando o tipo de conteúdo `application/x-www-form-urlencoded`, e só é válida dentro da string de consulta; um `+` literal aparecendo em um caminho de URL não é interpretado como um espaço de jeito nenhum, é simplesmente o caractere mais. Esta ferramenta sempre produz `%20`, que é válido em qualquer contexto, e decodifica corretamente ambas as formas ao ler uma URL codificada de volta.

As regras de codificação percentual se aplicam a qualquer URL não importa o que a construa ou consuma — um payload de webhook construído por um serviço de backend, um deep link aberto por um aplicativo móvel, uma requisição de API montada por um script. Onde quer que um valor que possa conter espaços, ampersands, ou caracteres não ASCII seja interpolado em uma string de URL, a mesma regra de codificar-o-valor-antes-de-inseri-lo se aplica, por isso essa é tanto uma preocupação de backend e scripting quanto de navegador.