Sanitização de Conteúdo

A sanitização de conteúdo é o processo de limpar entradas de dados (geralmente HTML ou scripts) para remover partes maliciosas ou perigosas, garantindo que o conteúdo seja seguro para ser renderizado no navegador.

Por que sanitizar?

Mesmo com o escape automático dos frameworks, às vezes precisamos renderizar HTML legítimo (como negrito, itálico ou listas vindos de um editor de texto rico). A sanitização permite que esses elementos passem, mas bloqueia tags como <script>, <iframe> e atributos como onclick.

---

Como fazer vs Como não fazer

✅ Como fazer

• Utilize uma biblioteca robusta e atualizada, como o DOMPurify, para realizar a sanitização no cliente antes da renderização.
• Configure uma "lista branca" (allow-list) de tags e atributos permitidos:

  import DOMPurify from 'dompurify';
  
  const clean = DOMPurify.sanitize(dirty, {
    ALLOWED_TAGS: ['b', 'i', 'em', 'strong', 'a'],
    ALLOWED_ATTR: ['href']
  });

• Sempre que possível, realize a sanitização também no Backend antes de salvar os dados no banco de dados.

❌ Como não fazer

• Nunca tente escrever seus próprios Regex para sanitizar HTML. O HTML é complexo demais para ser limpo de forma segura com expressões regulares; atacantes sempre encontrarão formas de burlar.
• Não confie em sanitizações feitas apenas no cliente se os dados puderem ser acessados por outros usuários; a segurança real deve estar no servidor.
• Não sanitize dados que não serão renderizados como HTML; se for apenas texto, o escape automático do framework é suficiente e mais performático.