Chegamos a um dos temas mais importantes de qualquer aplicação web:

segurança.

Nesta aula, vamos entender um dos ataques mais comuns da web:

Cross-Site Scripting (XSS).

🎯 Objetivo da aula

Ao final desta aula, você será capaz de:

  • Entender o que é XSS
  • Reconhecer como ele acontece
  • Identificar pontos vulneráveis no código
  • Aplicar boas práticas de prevenção
  • Escrever JavaScript mais seguro

O que é XSS?

XSS (Cross-Site Scripting) é um tipo de ataque onde:

código JavaScript malicioso é executado dentro do navegador do usuário.

Isso acontece quando uma aplicação:

  • confia em dados vindos do usuário
  • insere esses dados no HTML sem validação
XSS não ataca o servidor — ataca o usuário.

Por que XSS é tão perigoso?

Um ataque XSS pode:

  • roubar cookies e tokens
  • capturar dados digitados
  • redirecionar o usuário
  • alterar o comportamento da página

Tudo isso acontece:

sem que o usuário perceba.

Como o XSS acontece (conceito)

Imagine um campo de comentário que exibe exatamente o que o usuário digitou: 

 <div id="comentarios"></div> 
 const comentario = entradaUsuario; // dado externo

document.getElementById("comentarios").innerHTML = comentario;

Se esse valor não for tratado, qualquer coisa digitada será interpretada como HTML.

Inserir dados não confiáveis com innerHTML é o erro clássico.

Tipos comuns de XSS

  • XSS Refletido — vem da URL ou formulário
  • XSS Armazenado — salvo no banco de dados
  • XSS DOM-based — acontece apenas no JavaScript

Nesta aula, focamos principalmente no XSS baseado em DOM.

Erro comum: usar innerHTML sem necessidade

❌ Evite: 

 element.innerHTML = textoDoUsuario;

✅ Prefira: 

 element.textContent = textoDoUsuario;
textContent exibe texto — não executa HTML.

Criando elementos de forma segura

Outra prática segura é criar elementos manualmente: 

 const p = document.createElement("p"); p.textContent = textoDoUsuario;

container.appendChild(p);

Assim, o navegador nunca interpreta o conteúdo como código.

Nunca confie em dados externos

Dados externos incluem:

  • inputs de formulário
  • parâmetros de URL
  • dados de APIs
  • conteúdo vindo do backend
Tudo que vem de fora deve ser tratado como não confiável.

Validação vs sanitização

São coisas diferentes:

  • Validação → verifica se o dado é aceitável
  • Sanitização → remove ou neutraliza conteúdo perigoso

Idealmente:

  • valide no frontend
  • valide e sanitize no backend

Boas práticas essenciais contra XSS

  • use textContent em vez de innerHTML
  • evite montar HTML com strings
  • crie elementos via DOM API
  • nunca confie em dados externos
  • escape conteúdo quando necessário

E o backend?

Mesmo com JavaScript seguro:

  • o backend deve validar tudo
  • cabeçalhos de segurança ajudam
  • tokens devem ser protegidos
Segurança é responsabilidade de toda a stack.

XSS não é teoria

XSS está entre as vulnerabilidades mais comuns da web há anos.

Evitar XSS não é opcional — é obrigação.

Resumo da aula para nunca mais esquecer

  • XSS executa código no navegador do usuário
  • Acontece por confiar em dados externos
  • innerHTML é o vilão mais comum
  • textContent é mais seguro
  • Segurança deve ser pensada desde o início

Na próxima aula, começamos o encerramento técnico do curso com:

Introdução a testes em JavaScript.

HARDWARE

Entendendo o seu computador

O que há dentro do meu computador?

Existem alguns componentes fundamentais presentes dentro do seu computador e é muito importante que você conheça um pouco sobre eles, seja para argumentar com algum vendedor durante a compra de um novo PC ou para identificar alguma atitude desleal de algum técnico que esteja te passando um orçamento para reparo. Na seção Raio-X aqui do Contém Bits você pode conhecer e entender mais detalhadamente sobre cada componente, ou também pode clicar abaixo no componente que deseja, para conhecê-lo melhor.

  • Gabinetes

  • Placas-Mãe

  • Processadores

  • Memória

  • Fontes

  • Drives Ópticos

  • Discos Rígidos

  • SSD

  • Placas de Som

  • Placas de Vídeo

Você Sabia?

Música tema do Blanka

Até a primeira metade dos anos 90 era bastante comum que as trilhas sonoras dos games fossem criadas por mulheres e a responsável pelas músicas do clássico Street Fighter 2 foi Yoko Shimomura. Segundo ela, o ritmo "Tararirarin" da música tema do personagem Blanka, do Brasil, veio à sua cabeça enquanto ela estava no trem a caminho da Capcom.

Tetris

Desde o seu lançamento, em 1985, o fantástico jogo Tetris vende pelo menos 70 milhões de unidades por ano em todo o mundo! Os dados são oficiais e fornecidos pela THQ, uma das distribuidoras do título.

Muitos aplicativos

Instalar vários aplicativos com o mesmo propósito, como editores de texto, reprodutores de músicas ou vídeos e até programas antívirus sobrecarregam o seu sistema operacional e ainda ocupam espaço desnecessário em seu HD. Tenha apenas um bom programa para cada função.

Computadores de 1,5 tonelada

Em 1949 a revista Popular Mechanics fez uma previsão para o futuro, dizendo: "Um dia os computadores pesarão menos do que 1,5 tonelada". E pensar que temos smartphones capazes de realizar milhões de vezes mais operações do que os computadores daquela época.

Mega Man

A primeira versão do clássico Mega Man, para Nintendo 8 bits, tem seu recorde de pontos estabelecido em 03/11/2006, por David Archey, que cravou 2.396.700 pontos, terminando o jogo.