data_object Codificador / Decodificador de Entidades HTML star

Como Funciona

O HTML reserva um punhado de caracteres para sua própria sintaxe: < e > marcam tags, e & inicia uma referência de entidade. Se esses caracteres aparecerem literalmente dentro de um conteúdo inserido em uma página — um comentário, um nome de usuário, uma busca ecoada de volta na tela — o navegador tenta interpretá-los como marcação em vez de exibi-los como texto. A codificação os converte para sua forma de entidade (<, >, &) para que sejam exibidos como caracteres literais em vez de interpretados. A decodificação faz o inverso, transformando entidades como & ou ’ de volta nos caracteres reais que representam.

Isso não é um detalhe cosmético — é um controle de segurança. Se uma caixa de comentário recebe entrada do usuário e a insere no HTML da página sem codificá-la antes, um visitante pode digitar <script>...</script> e fazer com que esse script realmente seja executado no navegador de todos os outros visitantes: essa classe de vulnerabilidade se chama Cross-Site Scripting (XSS), e codificar saídas não confiáveis antes que toquem o HTML é a defesa padrão contra isso. Por exemplo, codificar o texto 5 < 10 & 10 > 5 produz 5 < 10 & 10 > 5, que é exibido corretamente e não pode ser confundido com marcação.

O Que Você Deve Saber

• Entidades nomeadas e numéricas representam o mesmo caractere de formas diferentes. ' (nomeada) e ' (numérica) significam ambas uma aspas simples, mas as entidades nomeadas dependem do analisador reconhecer aquele nome específico — as numéricas (decimais ou hexadecimais &#x) são suportadas universalmente e mais seguras para saída gerada por máquina.
• A codificação não é a única defesa. Ela protege conteúdo de texto; atributos, URLs e contextos de JavaScript embutido precisam de suas próprias regras de escape, já que um valor dentro de href="javascript:..." ou dentro de um bloco <script> é interpretado sob regras diferentes das do texto comum.
• A conversão é local. Esta ferramenta usa o próprio analisador DOM do seu navegador — nada é enviado ou registrado.
• Nem toda linguagem de templates do lado do servidor faz auto-escape por padrão. Algumas (como saída antiga de PHP ou concatenação de strings crua) exigem que você chame explicitamente uma função de escape — esquecer isso é uma das fontes mais comuns de bugs reais de XSS.
• Algumas entidades parecem quase idênticas visualmente. Uma aspas simples reta (') e uma aspas simples tipográfica (’) são exibidas quase da mesma forma na tela, mas são sequências de bytes diferentes — uma distinção que importa em amostras de código ou URLs.

Um exemplo concreto de antes/depois: um campo de comentário contendo Ótimo post! 5 < 10, certo? não precisa de nenhum tratamento especial como texto simples, mas no momento em que é inserido em um modelo HTML sem escape, um visitante malicioso poderia em vez disso enviar <img src=x onerror=alert(1)> — a codificação transforma isso em texto inerte e visível em vez de um manipulador de erro de imagem em execução.