dexblog.ro
Acces rapid: Învață AI Învață Programare Specificații Dispozitive Comparații
NEXT Toate comenzile Next.js

Secțiunea headers() în next.config.js – Securizarea răspunsurilor HTTP în Next.js

Configurare, Middleware și Deployment Next.js 9.5+

Injectează antete HTTP de securitate și politici CORS în toate răspunsurile trimise de server către clienți.

Sintaxă 
module.exports = {
  async headers() {
    return [
      {
        source: '/:path*',
        headers: [
          { key: 'X-Frame-Options', value: 'DENY' },
          { key: 'X-Content-Type-Options', value: 'nosniff' },
        ],
      },
    ];
  },
};

Ce face Secțiunea headers() în next.config.js - Securizarea răspunsurilor HTTP

Proprietatea async headers() din `next.config.js` permite configurarea antetelor globale de securitate fără a depinde de un server web extern (Nginx/Apache).

Permite adăugarea de antete esențiale precum: `X-Frame-Options: DENY` (previne clickjacking), `X-Content-Type-Options: nosniff` (blochează ghicirea tipului MIME), `Referrer-Policy` și `Content-Security-Policy` (CSP).

Se aplică automat pe toate cererile ce se potrivesc cu tiparul `source`.

Exemple

Exemplul 1: Adăugarea antetelor de securitate de bază recomandate de OWASP

Protejează aplicația împotriva atacurilor comune din browser.

module.exports = {
  async headers() {
    return [
      {
        source: '/:path*',
        headers: [
          { key: 'X-Frame-Options', value: 'SAMEORIGIN' },
          { key: 'X-Content-Type-Options', value: 'nosniff' },
          { key: 'Referrer-Policy', value: 'strict-origin-when-cross-origin' },
        ],
      },
    ];
  },
};

Ieșire în terminal

Toate răspunsurile vor conține antetele de protecție specificate.

Greșeli frecvente

  • Configurarea greșită a unui Content-Security-Policy (CSP) prea restrictiv care blochează execuția scripturilor legitime React.

Comenzi înrudite