Codificador de Entidades HTML

La codificación de entidades HTML es un mecanismo que convierte caracteres especiales en referencias de entidades HTML. En HTML, ciertos caracteres tienen significados especiales (como <, >, &), y si necesitas mostrar estos caracteres mismos en la página, debes usar codificación de entidades. La codificación de entidades tiene dos formas: entidades con nombre (como &lt;) y entidades numéricas (como &#60;). Las entidades con nombre son más legibles, mientras que las entidades numéricas pueden representar cualquier carácter Unicode. La codificación HTML importa cuando un texto debe insertarse en HTML sin interpretarse como marcado. Caracteres como <, >, &, comillas y apóstrofos pueden cambiar etiquetas, atributos o entidades. La herramienta sirve para ejemplos, plantillas, contenido CMS y depuración de problemas relacionados con XSS. El contexto sigue siendo clave: texto HTML, atributos, URLs, JavaScript y CSS requieren reglas de escape distintas, por lo que la salida debe usarse en el lugar correcto.

HTML utiliza dos tipos de referencias de caracteres definidos por el WHATWG HTML Living Standard. Las referencias de caracteres con nombre comienzan con & y terminan con ;, tomando datos de la tabla entities.json mantenida por WHATWG (aproximadamente 2.231 nombres en la especificación actual, incluyendo alias heredados sin punto y coma final como &amp sin el ;). Las referencias de caracteres numéricas utilizan puntos de código Unicode en formato decimal (&#60;) o hexadecimal (&#x3C;) y pueden codificar cualquier carácter desde U+0000 hasta U+10FFFF excepto el rango de sustitutos U+D800-U+DFFF. Los cinco caracteres que DEBEN escaparse para preservar la seguridad sintáctica de HTML son & (&amp;), < (&lt;), > (&gt;), " (&quot;) y ' (&#39;); ten en cuenta que &apos; es parte de XML y HTML5 pero NO es válido en HTML 4.01, por lo que OWASP recomienda la forma numérica &#39; para atributos delimitados por comillas dobles que deban atravesar analizadores heredados. La codificación en esta herramienta es una sustitución de un solo paso: el orden importa porque & debe escaparse primero, de lo contrario los prefijos de entidad insertados para < y > se volverían a escapar en &amp;lt;. La decodificación aprovecha el analizador HTML del navegador asignando la entrada al innerHTML de un elemento separado y leyendo de vuelta el textContent; esto despacha a la máquina de estados Tokenizer oficial de la especificación HTML (secciones 13.2.5.72 Character reference state a 13.2.5.80), que resuelve correctamente las formas con nombre, decimales y hexadecimales incluyendo entradas malformadas como los que carecen de punto y coma. La codificación numérica para el modo de codificación completa recorre la cadena punto a punto usando String.prototype.codePointAt para manejar caracteres astrales que ocupan un par de sustitutos UTF-16 (por ejemplo, el emoji U+1F600 se convierte en &#128512; y no en la alternativa de dos sustitutos). La prevención de XSS requiere escape consciente del contexto, no solo codificación de entidades HTML. La hoja de trucos OWASP Cross-Site Scripting Prevention define cinco contextos distintos: cuerpo HTML, atributo HTML (con comillas vs sin comillas), datos JavaScript (dentro de <script>), CSS y URL. El escape de entidades HTML cubre solo los contextos 1 y 2. Los contextos JavaScript deben usar escapes \xHH o \uHHHH mediante JSON.stringify, los contextos URL necesitan encodeURIComponent (codificación porcentual RFC 3986) y los manejadores de eventos en línea combinan las reglas porque sus valores pasan por ambos analizadores, el de HTML y el de JavaScript. Una cabecera Content-Security-Policy con script-src 'self' y 'unsafe-inline' eliminado es la capa moderna de defensa en profundidad que atrapa errores de escape, y los destinos DOM como innerHTML, document.write y setAttribute('on*', ...) deben reemplazarse con textContent o enlaces administrados por frameworks (JSX de React, llaves de Vue) que escapan por defecto.

• Referencias con nombre: aproximadamente 2.231 entradas en WHATWG entities.json; los cinco nombres obligatorios de escapar son &amp; &lt; &gt; &quot; &apos; (&apos; es solo HTML5/XML, no HTML 4.01)
• Referencias numéricas: decimal &#DDDDD; y hexadecimal &#xHHHH; cubren U+0000 a U+10FFFF; los sustitutos U+D800-U+DFFF y U+0000 NULL son inválidos según la especificación HTML
• Orden de escape: & debe reemplazarse primero, de lo contrario el prefijo &amp; insertado en escapes posteriores se codifica doble; la codificación es O(n) con una tabla de búsqueda de 5 entradas
• Decodificación mediante DOMParser: asignar al innerHTML de un elemento separado invoca el tokenizador de la especificación HTML (Character reference state, secciones 13.2.5.72-80) que maneja entidades heredadas sin punto y coma final
• Manejo de caracteres astrales: usar String.prototype.codePointAt y la iteración for...of para que los emojis y caracteres de la extensión B del CJK (U+10000+) produzcan un solo &#NNNNN; en lugar de dos referencias de sustitutos
• Escape consciente del contexto (regla #0 de OWASP XSS Prevention Cheat Sheet): cuerpo HTML, atributo HTML, JavaScript, CSS y URL cada uno necesita un escape diferente; las entidades HTML por sí solas no detienen XSS en destinos JS o URL
• Defensa en profundidad: Content-Security-Policy script-src 'self' (estilo RFC), saneamiento de lista de permitidos con DOMPurify para entrada de texto enriquecido, y preferir textContent/innerText sobre innerHTML en código DOM vanilla