Ferramentas
Escapar e desescapar HTML
Troque os caracteres reservados do HTML pelas entidades correspondentes para exibir marcação como texto, e faça o caminho de volta para ler um trecho que chegou escapado.
Tudo acontece no seu navegador. Nenhum dado digitado aqui é enviado à sysINFO ou a terceiros - não há servidor, upload nem registro. Você pode desconectar da internet e a ferramenta continua funcionando.
Para que serve
O HTML reserva alguns caracteres para si. O sinal de menor abre uma marcação, o e comercial abre uma referência de entidade, e as aspas delimitam valores de atributo. Quando um desses caracteres precisa aparecer como texto comum na tela, ele tem de ser escrito na forma de entidade, senão o navegador o interpreta como estrutura do documento e o resultado sai errado, sumido ou perigoso.
Escapar é justamente essa troca. É o que você faz para mostrar um trecho de código dentro de um artigo, para gravar em um banco de dados um texto que veio de um campo livre e vai ser exibido depois, ou para colar uma marcação em um sistema de documentação sem que ela seja renderizada. O caminho inverso, desescapar, aparece quando você recebe um conteúdo já convertido, vindo de um registro de aplicação, de um feed ou de uma exportação, e precisa ler o que estava escrito originalmente.
Esta página faz as duas operações. A ida cobre os cinco caracteres que realmente importam para segurança e para exibição, e a volta usa o analisador do próprio navegador, que reconhece o conjunto completo de entidades nomeadas e numéricas do HTML.
Como usar
- Cole o conteúdo no campo Entrada.
- Clique em Escapar para transformar os caracteres reservados em entidades. São convertidos o e comercial, o sinal de menor, o sinal de maior, as aspas duplas e o apóstrofo.
- Clique em Desescapar para o caminho contrário. Aqui a ferramenta reconhece qualquer entidade válida do HTML, nomeada ou numérica, e não apenas as cinco que ela mesma produz.
- Use Copiar resultado para levar a saída para a área de transferência.
- Limpar esvazia entrada e resultado e devolve o cursor ao campo de entrada.
Exemplos
Escapando um trecho de marcação com atributo
Entrada: <a href="/busca/?q=cloud&perfil=dev">Buscar</a> Resultado: <a href="/busca/?q=cloud&perfil=dev">Buscar</a>
Desescapando entidades nomeadas e numéricas
Entrada: <p>Café & leite à tarde</p> Resultado: <p>Café & leite à tarde</p>
Apóstrofo e e comercial em texto corrido
Entrada: Pão d'água & cia Resultado: Pão d'água & cia
Notas técnicas
A conversão de ida é uma substituição única, feita em uma só passagem sobre o texto. Isso importa: se o e comercial fosse tratado depois dos outros, um sinal de menor já convertido teria o seu próprio e comercial escapado de novo e o resultado sairia com dupla codificação. Fazendo tudo em uma passagem, cada caractere original é examinado uma vez só e o problema não aparece. O apóstrofo é convertido para a referência numérica em decimal, e não para a entidade nomeada, porque a nomeada não existia no HTML 4 e ainda encontra processadores que não a reconhecem.
A conversão de volta funciona de outro jeito: o texto é escrito dentro de uma área de texto criada na memória e o valor resultante é lido de volta. Como o conteúdo de uma área de texto é analisado em modo de texto puro, nenhuma marcação embutida é executada, mas as referências de entidade são resolvidas. É uma técnica segura e completa, com um limite conhecido: se a entrada contiver a sequência literal que fecha uma área de texto, a leitura para naquele ponto e o restante é descartado.
Um ponto que merece ênfase: escapar esses cinco caracteres protege dois contextos, o conteúdo de um elemento e o valor de um atributo entre aspas. Não protege atributo sem aspas, bloco de script, folha de estilo nem atributos que recebem endereços, como os de link e de imagem, onde um valor iniciado por um esquema executável continua sendo um problema mesmo depois do escape. Escape sempre na saída, no contexto em que o dado será usado.
Perguntas frequentes
Escapar esses cinco caracteres já resolve o risco de XSS?
Só em dois lugares: dentro do conteúdo de um elemento e dentro de um atributo cercado por aspas. Em atributo sem aspas, dentro de um bloco de script, dentro de uma folha de estilo ou em atributos que recebem endereços, como href e src, o escape é insuficiente e cada contexto exige o seu próprio tratamento. A regra prática continua sendo escapar no momento da saída, no contexto certo, e não na entrada.
Por que a volta entende mais entidades do que a ida produz?
Porque as duas operações usam mecanismos diferentes. Escapar aplica uma substituição direta de cinco caracteres. Desescapar entrega o texto ao analisador do próprio navegador, que conhece todas as entidades nomeadas do HTML, além das referências numéricas em decimal e em hexadecimal. Por isso a volta reconhece coisas que a ida nunca geraria.
Por que o apóstrofo vira a referência numérica e não a entidade nomeada?
A entidade nomeada do apóstrofo existe em XML e foi incorporada ao HTML5, mas não fazia parte do HTML 4. Processadores antigos e alguns conversores de documento não a reconhecem e a deixam passar literalmente. A referência numérica é entendida em qualquer contexto, então é a escolha mais segura e a usada aqui.
Posso usar isto para mostrar código dentro de uma página?
Sim, e é um dos usos mais comuns. Para exibir um trecho de HTML literalmente dentro de um bloco de código, o texto precisa estar escapado, senão o navegador interpreta as marcações em vez de mostrá-las. Escape o trecho aqui e cole o resultado dentro do elemento de código do seu documento.
Por que parte do texto sumiu quando desescapei?
A decodificação escreve o texto dentro de uma área de texto invisível e lê o valor resultante. O conteúdo de uma área de texto é lido em modo de texto puro, o que impede a execução de qualquer marcação, mas também faz com que uma sequência literal de fechamento dessa área encerre a leitura ali. Se o seu texto contém essa sequência sem estar escapada, o restante é descartado.
Todas as ferramentas
Página de ferramentas →Todas gratuitas e executadas inteiramente no seu navegador.
Documentos brasileiros
Desenvolvimento
Texto