Como configurei

Uma lista do que a página tem permissão de carregar e executar. Tudo que não estiver na lista o navegador recusa.

O que ele evita

Imagine um site com campo de comentário que não filtra o que a pessoa escreve. Alguém escreve um script no lugar do comentário. Quando outro visitante abre a página, o script roda no navegador dele como se fosse parte do site, e pode roubar a sessão. Isso é XSS. A CSP não impede o script de entrar na página, ela impede ele de rodar.

O que eu configurei

default-src 'none';
script-src  'self';
style-src   'self';
img-src     'self' data:;
connect-src 'self';
frame-src   'self';
base-uri    'none';
form-action 'none';
frame-ancestors 'none';
object-src  'none';

Detalhe que importa

A primeira linha nega tudo. Depois eu libero um tipo de recurso por vez, e sempre só para o próprio domínio (self). Não existe unsafe-inline nem unsafe-eval em nenhuma linha, que são as duas brechas que fazem a maioria das CSP não valer nada na prática. O preço disso foi ter que configurar o build pra nunca escrever CSS ou JavaScript direto dentro do HTML.

Manda o navegador nunca mais abrir este site sem HTTPS, mesmo que alguém tente forçar.

O que ele evita

Você digita o endereço sem https na frente. O navegador tenta HTTP primeiro. Nesse instante, quem estiver na mesma rede que você, num wifi público por exemplo, consegue interceptar e devolver uma versão falsa do site. Com HSTS o navegador guarda a regra e nem chega a tentar HTTP.

O que eu configurei

max-age=63072000; includeSubDomains; preload

Detalhe que importa

O número é em segundos e dá dois anos. includeSubDomains estende a regra pra qualquer subdomínio. preload deixa o domínio elegível pra entrar numa lista que já vem embutida dentro do Chrome e do Firefox, o que faz a proteção valer desde a primeira visita. Sem preload, ela só começa a valer depois que você acessa o site uma vez com sucesso.

Proíbe que qualquer outra página abra este site dentro dela.

O que ele evita

O golpe se chama clickjacking. O atacante monta uma página isca, tipo um sorteio, e coloca por cima dela o site verdadeiro num quadro transparente. Você acha que está clicando no botão do sorteio, mas está clicando no site real, logado com a sua conta. Bloqueando o enquadramento, o quadro simplesmente não carrega.

O que eu configurei

X-Frame-Options: DENY
Content-Security-Policy: frame-ancestors 'none'

Detalhe que importa

frame-ancestors é a versão moderna e faz parte da CSP. O X-Frame-Options é antigo e já foi substituído, mas navegador velho ainda entende só ele, então mantive os dois. O segundo botão da home executa exatamente esse ataque contra esta página pra você ver o quadro ficar vazio.

Manda o navegador acreditar no tipo do arquivo que o servidor declarou, em vez de tentar adivinhar.

O que ele evita

Um site aceita upload de arquivo. Alguém envia um arquivo com extensão de imagem, mas com código JavaScript dentro. O servidor devolve ele dizendo que é imagem. Sem essa configuração, o navegador olha o conteúdo, percebe que parece código, e executa. Com ela, o navegador é obrigado a tratar como imagem e o código nunca roda.

O que eu configurei

nosniff

Detalhe que importa

É uma palavra só e não custa nada, mas está faltando na maior parte dos sites. Vale sempre.

Controla quanto do endereço da sua página é enviado pro site que você clicou.

O que ele evita

Você está numa página tipo empresa.com/pedido/48213?token=abc e clica num link externo. Por padrão, o navegador conta pro outro site o endereço completo de onde você veio, token incluso. O dono daquele site agora tem o seu token no log dele, sem ter feito nada.

O que eu configurei

strict-origin-when-cross-origin

Detalhe que importa

Navegando dentro do próprio site, o endereço completo é enviado, que é o comportamento útil. Indo pra fora, só o domínio vai. E de uma página HTTPS pra um site HTTP, nada é enviado.

Desliga as funções do navegador que o site não usa.

O que ele evita

Não é um ataque isolado, é redução de estrago. Se um dia entrar código malicioso na página, por um script de terceiro comprometido por exemplo, ele já encontra câmera, microfone, localização e sensor de movimento desligados no nível do navegador. Menos coisa ligada é menos coisa que pode ser usada contra você.

O que eu configurei

camera=(), microphone=(), geolocation=(), payment=(), usb=(), ...

Detalhe que importa

Desliguei dezessete funções e deixei ligada só a de tela cheia, para o próprio domínio. O parêntese vazio significa ninguém pode usar, nem eu.

Isolam esta página das outras abas e impedem que outros sites peguem arquivos daqui.

O que ele evita

Depois das falhas Spectre e Meltdown, descobriu-se que era possível um site espiar dados de outro que estivesse aberto no mesmo processo do navegador, por caminhos indiretos. Esses três cabeçalhos colocam a página num processo separado e cortam esse acesso.

O que eu configurei

Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Resource-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp

Detalhe que importa

Ligar isso quebra qualquer recurso carregado de fora do domínio que não autorize explicitamente. Como este site não carrega nada de fora, não quebrou nada. Num site que usa fonte do Google ou vídeo do YouTube, esses três dão bastante trabalho.