🧰 UtlKit

Escape de Strings Online: Como uma Entrada de 25 Caracteres Passa a 27, 45 e 45 Após os Escapes de JavaScript, HTML e URL, com os 9 Códigos JS, 5 Caracteres HTML e o Modo Percent Explicados

Cole uma string de 25 caracteres com um ampersand, aspas e parênteses angulares: a ferramenta devolve 27 caracteres após escape JavaScript, 45 após escape HTML e 45 após escape URL, com seis modos e seus inversos de ida e volta, tudo no seu navegador.

As cadeias quebram quando cruzam sistemas. Uma aspa dupla dentro de uma string JavaScript, um ampersand dentro de um atributo HTML, um espaço dentro de um parâmetro de consulta: cada destino tem os seus próprios caracteres perigosos e a sua própria forma de os neutralizar. A ferramenta Escape/Unescape de Strings converte uma string colada na forma segura para esse destino e volta, tudo no navegador: nada é enviado e nada sai da aba. Funciona com seis modos, três destinos em duas direções: Escape JavaScript, Unescape JavaScript, Escape HTML, Unescape HTML, Escape URL e Unescape URL. Tome uma entrada de 25 caracteres: uma saudação com um ampersand, dois pontos e uma frase entre aspas dentro de parênteses angulares. Após escapar HTML mede 45 caracteres, após escapar URL também mede 45, e esses dois resultados de 45 são cadeias distintas, que é o ponto central.

Seis modos: três destinos, duas direções

O modo JavaScript reescreve 9 dos 128 códigos ASCII como sequências de dois caracteres: barra invertida, aspa dupla, aspa simples, quebra de linha, retorno, tabulação, backspace, avanço de linha e o código NUL. Contra o exemplo de 25 caracteres só mudam as duas aspas duplas, de modo que a saída mantém o ampersand e os parênteses angulares intactos e mede 27 caracteres; uma string com uma tabulação real e uma quebra real volta com uma barra invertida t e uma barra invertida n literais nesses lugares. O modo HTML converte exatamente cinco caracteres: o ampersand numa referência de cinco, os dois parênteses angulares em referências de quatro, a aspa dupla numa de seis e a aspa simples numa referência numérica. O modo URL é codificação percent. Cada escape tem o seu gêmeo unescape, e cada conversão roda ao colar, sem ida e volta ao servidor.

O exemplo de 25 caracteres, três destinos

Escrito sem adornos: uma saudação, um ampersand, dois pontos e uma frase entre aspas dentro de parênteses angulares, 25 caracteres no total. O escape JavaScript acrescenta uma barra invertida diante de cada uma das duas aspas duplas, 27 caracteres. O escape HTML substitui o único ampersand pela sua referência de cinco, as duas aspas duplas pela de seis e o par de parênteses angulares por referências de quatro: 25 mais 20, chega a 45. O escape URL codifica em percent os quatro espaços, o ampersand, os dois pontos, as duas aspas duplas e os dois parênteses angulares: dez caracteres simples viram dez sequências de três e a soma também chega a 45, uma coincidência desta entrada em particular. Três destinos, três respostas, e a entrada nunca é mudada no lugar: a ferramenta sempre escreve uma string nova no painel de saída.

Escape URL: o que a codificação percent mantém

encodeURIComponent mantém intactos 71 dos 96 caracteres ASCII imprimíveis: as 62 letras e algarismos mais nove símbolos, o ponto de exclamação, a aspa simples, os dois parênteses, o asterisco, o ponto, o traço, o sublinhado e o til. Tudo o mais passa a ser um sinal percent mais dois dígitos hexadecimais. Por isso é um codificador de componente, não um codificador de URL: execute sobre um endereço completo de 53 caracteres com cadeia de consulta e as barras, os dois pontos, o ponto de interrogação e o sinal igual viram %2F, %3A, %3F e %3D, produzindo um componente de 75 caracteres, https%3A%2F%2Futlkit.com%2Ftools%2Fstring-escape%2F%3Fq%3DTom%20%26%20Jerry. Quando a pergunta é uma peça de uma URL versus a URL inteira, o Codificador/Decodificador de URL separa essa decisão explicitamente. Na outra direção, decodeURIComponent rejeita uma sequência malformada como um %E0 solto com um erro lançado, e a ferramenta o captura e mostra a mensagem em vez de uma string meio decodificada.

Escolher o modo pelo destino

A regra é destino primeiro. Código que vai ser lido por um parser JavaScript quer escape JavaScript; texto ou valor de atributo que vai ser parseado como marcado quer escape HTML; um parâmetro de consulta quer escape URL. As ferramentas vizinhas cobrem as bordas: o Codificador/Decodificador de Entidades HTML trabalha com referências nomeadas e numéricas, de modo que um espaço não rompível vira   e uma elipse …; o Codificador/Decodificador Base64 tira cargas quase binárias do canal de texto por completo; e o Conversor Hex UTF-8 Base64 mostra os mesmos bytes como hexadecimal, texto UTF-8 e Base64 quando a pergunta é o que os bytes são, não como citá-los.

Onde as strings escapadas tocam o resto do conjunto

Escapar quase nunca acontece sozinho. Quando a saída escapada vai para um payload JSON, colá-la no Formatador JSON ou a parseia limpa ou aponta o carácter exacto que a partiu. Quando a entrada veio de uma área de transferência cheia de caracteres invisíveis, o Limpa Espaços em Branco torna visíveis as tabulações e as quebras antes de qualquer decisão de escape, de modo que uma barra invertida t na saída é uma tabulação que você enviou, não uma surpresa.

Idas e voltas e a armadilha do escape duplo

Cada escape da ferramenta tem o seu inverso, que percorre a mesma tabela de 128 códigos ao contrário: escape JavaScript seguido de unescape JavaScript devolve a string original sem mudanças, e o par URL também dá a volta, incluindo os pares hexadecimais. A rua de mão única é o escape duplo. Execute o escape HTML duas vezes e o ampersand dentro da referência também é escapado, de modo que o resultado aparece como o texto visível de uma referência em vez do carácter que ela nomeia, e desfazer pede duas passadas de unescape, não uma. O modo de falha não é o escape em si, mas aplicá-lo duas vezes, ou uma no modo errado. E quando o problema de uma string é a sua estrutura e não os seus caracteres, as ferramentas de escape não são o instrumento certo: a guia de formatação HTML cobre o lado de formatação do mesmo documento.

Ferramentas Relacionadas

Perguntas Frequentes

Por que o modo de escape HTML converte o ampersand antes de qualquer outro carácter?

Porque as cinco referências que o modo escreve, &, <, >, " e ', começam cada uma com um ampersand próprio. Numa só passada de esquerda para a direita, converter primeiro o ampersand faz as quatro referências seguintes serem escritas uma vez e o seu ampersand interno nunca ser examinado, de modo que o exemplo de 25 caracteres expande-se exatamente 20 e chega a 45. Qualquer outra ordem volta a escapar as referências a caminho e a mesma entrada sai muito mais longa.

O meu escape JavaScript só mudou as duas aspas duplas do exemplo de 25 caracteres. Há algo quebrado?

Não. O escape JavaScript reescreve exatamente 9 dos 128 códigos ASCII: barra invertida, aspa dupla, aspa simples, quebra de linha, retorno, tabulação, backspace, avanço de linha e NUL. O ampersand e os parênteses angulares são perfeitamente legais dentro de uma string JavaScript, de modo que passam intactos e a saída mantém-se em 27 caracteres, duas barras invertidas a mais que a entrada. A mesma entrada pelo escape HTML chega a 45, porque nesse destino o ampersand e os dois parênteses são os caracteres perigosos. O modo é que decide o que conta como perigoso.

O modo de escape URL codificou as barras e o ponto de interrogação do meu endereço completo. Foi um erro?

Nada está errado, mas o modo é um codificador de componente, não um codificador de URL. encodeURIComponent mantém 71 dos 96 caracteres ASCII imprimíveis e codifica tudo o mais, incluindo a barra, os dois pontos, o ponto de interrogação e o sinal igual, de modo que um endereço completo de 53 caracteres com cadeia de consulta sai como o componente de 75 caracteres https%3A%2F%2Futlkit.com%2Ftools%2Fstring-escape%2F%3Fq%3DTom%20%26%20Jerry. Se queres tratar a URL inteira como uma unidade com a estrutura intacta, a ferramenta Codificador/Decodificador de URL faz essa separação explicitamente. Na outra direção, decodeURIComponent lança um erro diante de uma sequência percent malformada como %E0, e a ferramenta mostra a mensagem em vez de uma string a meio de decodificar.

Escapar e depois desescapar sempre devolve a string original?

Para uma entrada que nunca foi escapada, sim. O escape JavaScript seguido do unescape JavaScript percorre a mesma tabela de 128 códigos para a frente e para trás e devolve a entrada sem mudanças, e o par URL também dá a volta, incluindo os pares hexadecimais. A falha vem de duas direções a mais. Uma é o escape duplo: execute o escape HTML duas vezes e a segunda passada escapa o ampersand dentro das referências escritas pela primeira, de modo que desfazer pede duas passadas de unescape, não uma. A outra é desescapar dados que nunca foram escapados: escrever um sinal percent seguido de dois dígitos que não formam uma sequência válida, como um %E0 solto, faz decodeURIComponent lançar um erro, e a ferramenta mostra a mensagem em vez de uma string a meio de decodificar.

Por que o exemplo de 25 caracteres chega a 45 tanto após o escape HTML como após o escape URL?

Duas aritméticas diferentes, o mesmo ponto de chegada. O escape HTML soma 4 ao único ampersand, 5 a cada uma das duas aspas duplas e 3 a cada um dos dois parênteses angulares: 25 mais 20, 45. O escape URL converte os quatro espaços, o ampersand, os dois pontos, as duas aspas duplas e os dois parênteses angulares, dez caracteres simples, em dez sequências percent de três, também 25 mais 20, também 45. A igualdade é uma coincidência desta entrada em particular, e os dois resultados de 45 são cadeias distintas: uma cheia de referências de ampersand, a outra de tríos percent. Cada destino contou os seus próprios caracteres perigosos, e ambos cobraram a mesma soma por acaso.

Artigos Relacionados