O que é XSS (Cross-Site Scripting) e como corrigir

XSS (Cross-Site Scripting) é uma vulnerabilidade que permite a um atacante injetar código JavaScript malicioso em páginas web visualizadas por outros usuários. Quando o navegador da vítima executa esse código, o atacante pode roubar cookies de sessão, redirecionar para sites falsos, capturar teclas digitadas ou modificar o conteúdo da página.

Existem três tipos principais:

• Reflected XSS: o payload é enviado na requisição (URL ou formulário) e refletido na resposta sem sanitização.
• Stored XSS: o payload é armazenado no servidor (banco de dados, comentários) e exibido para outros usuários.
• DOM-based XSS: o payload é processado diretamente no JavaScript do cliente, sem passar pelo servidor.

XSS é classificado como severidade crítica ou alta porque permite:

• Roubo de sessão (session hijacking) via cookies
• Phishing dentro do próprio site legítimo
• Keylogging e captura de credenciais
• Distribuição de malware para visitantes
• Deface do site (alteração visual)
• Execução de ações em nome do usuário autenticado

O SAFETAGGY utiliza duas camadas de detecção:

• Varredura básica: injeta payloads de teste em parâmetros de formulários e URLs, verificando se são refletidos na resposta sem encoding. Também analisa a presença de headers CSP que mitigam XSS.
• Deep Scan (pentest IA): utiliza o dalfox, ferramenta especializada em detecção de XSS, para testar centenas de vetores de ataque incluindo bypasses de WAF, DOM-based XSS e contextos HTML/JS/atributo.

Faça uma varredura agora para verificar se seu site está vulnerável.

A proteção contra XSS exige múltiplas camadas. Abaixo estão as correções mais eficazes para cada contexto.

1. React / Next.js (auto-escaping)

React escapa automaticamente valores em JSX. O risco aparece ao usar dangerouslySetInnerHTML. Se precisar renderizar HTML do usuário, sanitize antes:

import DOMPurify from 'dompurify';

// Sanitizar HTML antes de renderizar
const cleanHTML = DOMPurify.sanitize(userInput, {
  ALLOWED_TAGS: ['b', 'i', 'em', 'strong', 'a', 'p'],
  ALLOWED_ATTR: ['href', 'target'],
});

// No componente React
<div dangerouslySetInnerHTML={{ __html: cleanHTML }} />

2. Express.js (middleware de sanitização)

import helmet from 'helmet';
import xss from 'xss-clean';

const app = express();

// Helmet configura CSP e outros headers de segurança
app.use(helmet());

// Middleware que sanitiza req.body, req.query, req.params
app.use(xss());

3. Content Security Policy (CSP)

O header CSP é a defesa mais eficaz contra XSS. Ele impede a execução de scripts inline e de origens não autorizadas:

// next.config.js — CSP rigoroso
const securityHeaders = [
  {
    key: 'Content-Security-Policy',
    value: [
      "default-src 'self'",
      "script-src 'self' 'nonce-{RANDOM}'",
      "style-src 'self' 'unsafe-inline'",
      "img-src 'self' data: https:",
      "connect-src 'self' https://api.example.com",
      "frame-ancestors 'none'",
    ].join('; '),
  },
];

4. Nginx (headers de proteção)

# /etc/nginx/conf.d/security.conf
add_header Content-Security-Policy "default-src 'self'; script-src 'self'" always;
add_header X-Content-Type-Options "nosniff" always;
add_header X-XSS-Protection "0" always;  # Desativado em favor do CSP