Content Security Policy (CSP)

## Definindo Políticas de Conteúdo e Combatendo XSS em Aplicações Node.js

A segurança de aplicações web é uma preocupação constante, e a proteção contra ataques Cross-Site Scripting (XSS) é fundamental. Uma abordagem eficaz para mitigar esses risco…


This content originally appeared on DEV Community and was authored by Lucas Pereira de Souza

logotech

## Definindo Políticas de Conteúdo e Combatendo XSS em Aplicações Node.js

A segurança de aplicações web é uma preocupação constante, e a proteção contra ataques Cross-Site Scripting (XSS) é fundamental. Uma abordagem eficaz para mitigar esses riscos é a combinação de políticas de conteúdo bem definidas e implementações robustas no servidor.

Políticas de Conteúdo (CSP): A Primeira Linha de Defesa

As Políticas de Conteúdo (CSP) são uma camada adicional de segurança que os desenvolvedores podem adicionar às suas aplicações web. Elas fornecem controle granular sobre quais recursos (scripts, estilos, imagens, etc.) o navegador está autorizado a carregar. Isso ajuda a prevenir ataques XSS, impedindo a execução de scripts maliciosos injetados.

Como Funcionam as Políticas de Conteúdo:

As CSPs são definidas através de cabeçalhos HTTP (Content-Security-Policy) ou metatags <meta>. Elas especificam as origens confiáveis para cada tipo de recurso. Por exemplo, você pode definir que apenas scripts provenientes do seu próprio domínio e de um serviço CDN confiável podem ser carregados.

Exemplos de Uso para Evitar XSS:

  • Content-Security-Policy: default-src 'self'; script-src 'self' https://cdn.example.com; style-src 'self' https://fonts.googleapis.com: Esta política permite que o navegador carregue recursos do próprio domínio ('self'), scripts do próprio domínio e do CDN cdn.example.com, e estilos do próprio domínio e do Google Fonts. Qualquer tentativa de carregar scripts de outras origens será bloqueada, mitigando ataques XSS.
  • Content-Security-Policy: script-src 'nonce-randomstring';: O uso de \"nonce\" (um valor aleatório gerado para cada requisição) é uma forma segura de permitir a execução de scripts específicos. Você gera um nonce no servidor, inclui-o na tag <script> e na política CSP. Isso garante que apenas os scripts com o nonce correspondente sejam executados.
  • Content-Security-Policy: default-src 'none'; script-src 'self' ; style-src 'self': Uma política mais restritiva, onde nada é carregado por padrão. Apenas scripts e estilos do mesmo domínio são permitidos.

Benefícios das Políticas de Conteúdo:

  • Redução do Risco de XSS: Bloqueia a execução de scripts maliciosos.
  • Melhor Controle sobre Recursos: Permite controlar a origem dos recursos carregados.
  • Facilidade de Implantação: Pode ser implementado com relativa facilidade.
  • Compatibilidade com Navegadores: Amplamente suportado pelos navegadores modernos.

Implementando Políticas de Conteúdo em Servidores Node.js

A implementação de CSP em um servidor Node.js é direta, geralmente feita através de middleware. Aqui estão algumas opções e exemplos:

1. Usando o helmet:

helmet é um middleware popular do Express que ajuda a proteger aplicações Node.js, incluindo a configuração de CSPs.

const express = require('express');
const helmet = require('helmet');
const app = express();

app.use(helmet({
    contentSecurityPolicy: {
      directives: {
        defaultSrc: [\"'self'\"],
        scriptSrc: [\"'self'\", 'https://cdn.example.com'],
        styleSrc: [\"'self'\", 'https://fonts.googleapis.com'],
      },
    },
  }));

app.get('/', (req, res) => {
    res.send('Olá, mundo!');
});

app.listen(3000, () => {
  console.log('Servidor rodando na porta 3000');
});

Neste exemplo, o helmet é usado para configurar a política de conteúdo. A opção contentSecurityPolicy permite definir as diretivas CSP.

2. Definindo o Cabeçalho Manualmente:

Você também pode definir o cabeçalho manualmente em cada resposta:

const express = require('express');
const app = express();

app.get('/', (req, res) => {
  res.setHeader(
    'Content-Security-Policy',
    \"default-src 'self'; script-src 'self' https://cdn.example.com\"
  );
  res.send('Olá, mundo!');
});

app.listen(3000, () => {
  console.log('Servidor rodando na porta 3000');
});

Embora seja menos prático para políticas complexas, essa abordagem oferece mais controle se você precisar adaptar a política dinamicamente para cada requisição.

3. Usando nonce com helmet:

Para usar nonce com helmet, você pode gerar o valor do nonce no servidor, adicioná-lo ao cabeçalho Content-Security-Policy e à tag <script> correspondente.

const express = require('express');
const helmet = require('helmet');
const crypto = require('crypto');
const app = express();

app.use(helmet({
    contentSecurityPolicy: {
      useDefaults: false, // Desativa as políticas padrão
      directives: {
        defaultSrc: [\"'self'\"],
        scriptSrc: [\"'self'\", (req, res) => `'nonce-${res.locals.nonce}'`], // Usa a função para incluir o nonce dinamicamente
      },
    },
  }));

app.use((req, res, next) => {
  res.locals.nonce = crypto.randomBytes(16).toString('hex'); // Gera o nonce
  next();
});

app.get('/', (req, res) => {
  res.send(`
    <!DOCTYPE html>
    <html>
    <head>
      <title>Exemplo de Nonce</title>
      <style> body { font-family: sans-serif; } </style>
    </head>
    <body>
      <h1>Exemplo de Nonce</h1>
      <script nonce=\"${res.locals.nonce}">
        console.log('Script executado com nonce!');
      </script>
    </body>
    </html>
  `);
});

app.listen(3000, () => {
  console.log('Servidor rodando na porta 3000');
});

Neste exemplo, um nonce aleatório é gerado para cada requisição e inserido na política de segurança e na tag <script>.

Conclusão

Definir e implementar políticas de conteúdo é uma prática essencial para garantir a segurança das suas aplicações web. Em conjunto com outras técnicas de segurança, como a validação de entrada e a sanitização de dados, as CSPs oferecem uma camada robusta de proteção contra ataques XSS, ajudando a proteger seus usuários e seus dados. A utilização de ferramentas como helmet no Node.js simplifica o processo de implementação, tornando-o acessível a desenvolvedores de todos os níveis. Lembre-se, a segurança é um processo contínuo; revise e atualize suas políticas de conteúdo regularmente para se manter à frente das ameaças.


This content originally appeared on DEV Community and was authored by Lucas Pereira de Souza


Print Share Comment Cite Upload Translate Updates
APA

Lucas Pereira de Souza | Sciencx (2025-11-23T16:15:53+00:00) Content Security Policy (CSP). Retrieved from https://www.scien.cx/2025/11/23/content-security-policy-csp-2/

MLA
" » Content Security Policy (CSP)." Lucas Pereira de Souza | Sciencx - Sunday November 23, 2025, https://www.scien.cx/2025/11/23/content-security-policy-csp-2/
HARVARD
Lucas Pereira de Souza | Sciencx Sunday November 23, 2025 » Content Security Policy (CSP)., viewed ,<https://www.scien.cx/2025/11/23/content-security-policy-csp-2/>
VANCOUVER
Lucas Pereira de Souza | Sciencx - » Content Security Policy (CSP). [Internet]. [Accessed ]. Available from: https://www.scien.cx/2025/11/23/content-security-policy-csp-2/
CHICAGO
" » Content Security Policy (CSP)." Lucas Pereira de Souza | Sciencx - Accessed . https://www.scien.cx/2025/11/23/content-security-policy-csp-2/
IEEE
" » Content Security Policy (CSP)." Lucas Pereira de Souza | Sciencx [Online]. Available: https://www.scien.cx/2025/11/23/content-security-policy-csp-2/. [Accessed: ]
rf:citation
» Content Security Policy (CSP) | Lucas Pereira de Souza | Sciencx | https://www.scien.cx/2025/11/23/content-security-policy-csp-2/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.