Codificador e decodificador de URL numa só caixa de texto
Cole um link na caixa, clique num botão, e a mesma caixa mostra o resultado. Este codificador e decodificador de URL transforma espaços, tremas e caracteres reservados em códigos percentuais, como %20 para um espaço ou %C3%BC para "ü", e os transforma de volta. Uma tabela sob a caixa lista os parâmetros de consulta de qualquer texto que esteja nela.
A caixa começa com um link de busca de exemplo. Edite-o ou troque-o pelo seu próprio texto.
Os cinco botões em ordem
- Cole uma URL, uma query string solta ou qualquer texto. A tabela abaixo da caixa é atualizada a cada tecla.
- encodeURIComponent serve para um único valor. Também escapa
/ ? : @ & = + $ # ,, para que o valor não quebre o link ao redor. - encodeURI (URL completa) serve para um endereço inteiro. Deixa esses caracteres em paz e o link continua funcionando.
- decodeURI transforma os códigos percentuais de volta em texto legível.
- Copiar a URL atual copia a caixa, não a tabela. Limpar esvazia a caixa.
Quando uma URL interna quebra a externa
Um link de login OAuth leva o próprio endereço de retorno em redirect_uri. Cole esse endereço interno como está, e o primeiro & encerra o parâmetro antes da hora. Passe o endereço interno primeiro por encodeURIComponent e só depois o acrescente ao link externo.
O sentido contrário é igualmente comum. Um log de servidor mostra q=caf%C3%A9+au+lait, e você precisa saber o que o cliente digitou. Cole a linha e clique em decodeURI.
Links de rastreamento são o terceiro caso. Doze parâmetros utm_ são um paredão de texto numa linha só. Na tabela, são doze linhas curtas.
Sinais de mais, códigos percentuais inválidos e dupla codificação
- A decodificação primeiro troca cada
+por um espaço e só então resolve os códigos%XX. Um sinal de mais literal num caminho vira um espaço. O%2Bcontinua sendo um mais. - Um
%sem dois dígitos hexadecimais depois dele faz a decodificação falhar. A caixa mantém o texto e não mostra erro. - Codificar duas vezes transforma
%20em%2520. - Decodificar um endereço completo também resolve
%26e%3D. A estrutura da consulta pode mudar.
A tabela lê endereços que começam com http:// ou https://. Qualquer outro texto conta como query string, com ou sem um ? inicial. Ela mostra valores decodificados, então q=web+tools aparece como "web tools". Um fragmento depois de # não é listado, uma chave repetida ganha uma linha por valor, e um texto que não pode ser analisado gera um aviso curto em vez de uma tabela.
Os links colados não são enviados a lugar nenhum
A codificação, a decodificação e a tabela rodam no seu navegador. Clicar num botão não envia nenhuma requisição, e o painel de rede das ferramentas de desenvolvedor mostra isso. Só o botão de copiar toca a área de transferência, e só quando você o clica.
Perguntas frequentes (FAQ)
encodeURI deixa caracteres como :/?#&= como estão, então uma URL inteira continua funcionando. encodeURIComponent os escapa, que é o que você quer para o valor de um único parâmetro.