= Explorando e Mitigando XSS em Formulários no Frontend sanitize(payload) Como um input de usuário vira execução de código — e como o frontend fecha essa porta. render(safe) ✓ Lucas Rocha · Tech Lead · AppSec "<script>steal()</script>" // → <script> Junho 2025
um ataque XSS? Um ataque XSS acontece quando um invasor injeta 01 XSS Refletido Reflected XSS O código malicioso é injetado via entrada de usuário e refletido de volta na resposta, executando scripts arbitrários no navegador da vítima. 02 código malicioso em um site, explorando falhas nas XSS Armazenado Stored XSS O código malicioso é armazenado no servidor ou banco de dados e, posteriormente, exibido para outros usuários. entradas de usuário, levando à execução de scripts maliciosos no navegador da vítima. 03 XSS Baseado em DOM DOM-Based XSS O JavaScript da própria aplicação manipula dados do usuário direto no DOM, sem validação ou escape adequado, levando à execução de código malicioso. 02
Airways Fortnite eBay 380 mil 200 mi até 2017 transações com cartões clonados de usuários afetados ataques relacionados Um script malicioso foi injetado e modificado para enviar dados de clientes a um servidor dos atacantes. O exploit ocorreu via a biblioteca JavaScript Feedify, usada no site. Uma página desativada ficou disponível por engano. Combinando vulnerabilidades de XSS com falhas no SSO, a exploração e o sequestro de contas foram possíveis. Um parâmetro url não validado permitiu injeção de código em páginas da plataforma. Vendedores tiveram contas acessadas, manipulando anúncios de alto valor. src: wired.com src: portswigger.net src: bitdefender.com 03
como? Sanitizar inputs de usuário é vital não só para a segurança da aplicação, mas também para proteger a reputação e o negócio da empresa. Lembre-se Validação impede dados incorretos. Sanitização impede código malicioso. 01 Evite inserir dados não confiáveis no DOM – innerHTML – outerHTML – insertAdjacentHTML 03 Evite JS inline – Não use onClick nem onmouseover direto no HTML 02 Sanitize entradas renderizadas como HTML – DOMPurify — remove elementos maliciosos – Zod — valida tipo, formato e tamanho 04 Use e abuse do CSP – Política restritiva para bloquear scripts maliciosos (Content Security Policy) 05
Como lidamos com XSS na prática Estamos criando a versão web do Vale Bônus. Um dos fluxos é o de Dados do Usuário, onde a pessoa visualiza e edita seus dados pessoais — prato cheio para XSS. Para evitar esse tipo de vulnerabilidade, usamos uma combinação de ferramentas que torna um ataque de XSS bem improvável. Next.js + Server Actions App Router + Server Components Ao combinar SPA com Server-Side Rendering (SSR), os dados são processados e cadastrados no servidor durante a renderização, evitando exposições no client side. A requisição é encapsulada numa Server Action: o frontend apenas dispara a ação, e a execução ocorre validada no servidor. O App Router e os Server Components garantem que as renderizações e as chamadas de serviço ocorram no lado do servidor, de forma protegida e controlada desde o carregamento inicial. Isso resulta em: Isso evita exposições indevidas: – URIs das APIs e respostas não expostas no – URL real do serviço exposta – Dados sensíveis retornando da API – Interceptação de requisições por devtools browser — mitigando XSS, interceptações (alô, Burp Suite) e engenharia reversa. – Ganhos significativos de performance na aplicação como um todo. 06
em camadas contra XSS Do input não confiável ao dado persistido — onde cada proteção atua no fluxo. CLIENTE · Browser SERVIDOR · Next.js Next.js SPA — lado do cliente App Router + Server Components Execução no servidor Formulário · input não confiável Server Action "<script>steal()</script>" – SSR — dados processados no servidor – Server Action validada no back-end – Render via Server Components Sanitização & validação encapsula a requisição – Zod — tipo, formato, tamanho – DOMPurify — remove HTML malicioso API / DB persistência segura ✓ Superfície reduzida – URIs das APIs ocultas do browser – Respostas não expostas no client – Sem innerHTML · outerHTML · insertAdjacentHTML – Sem JS inline (onClick, onmouseover) – Mitiga interceptação e eng. reversa CSP · bloqueia scripts não autorizados entrada não confiável → sanitizada no client → validada no servidor → dado seguro 07
denniskardys
apolaine
tammyeverts
kimpetersen
mlcsv
rkendrick25
davidcarrasco
sonatard
schroneko
aki_iinuma
keathley
