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

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

• next.config.js - Fișierul principal de configurare Next.js: Centralizează setările avansate ale compilatorului, modulelor externe, regulilor de redirecționare și mediului de rulare.
• middleware.ts - Interceptarea cererilor la nivel de rețea (Edge Middleware): Rulează cod înainte ca o cerere să ajungă la pagină, perfect pentru autentificare, redirecționări de geolocație și securitate.