HTTP Security Headers Explained — CSP, HSTS, X-Frame-Options & How to Get an A+ Grade

Content-Security-Policy:
  default-src 'self';
  script-src 'self' 'nonce-rAnd0mN0nce' https://cdn.trusted.com;
  style-src 'self' 'unsafe-inline' https://fonts.googleapis.com;
  img-src 'self' data: https://cdn.trusted.com;
  font-src 'self' https://fonts.gstatic.com;
  connect-src 'self' https://api.yoursite.com;
  frame-ancestors 'none';
  base-uri 'self';
  form-action 'self';
  upgrade-insecure-requests;

# Basic HSTS — 1 year, applies to subdomains, listed in preload list
Strict-Transport-Security: max-age=31536000; includeSubDomains; preload

# Explanation:
# max-age=31536000 → 1 year (in seconds) = the minimum for HSTS preload
# includeSubDomains → applies to all subdomains (api.yoursite.com, etc.)
# preload → request inclusion in browser HSTS preload lists

# DENY — no site can embed this page in an iframe (most restrictive, recommended)
X-Frame-Options: DENY

# SAMEORIGIN — only pages from the same origin can embed this page
X-Frame-Options: SAMEORIGIN

# Modern replacement: CSP frame-ancestors directive (more flexible)
Content-Security-Policy: frame-ancestors 'none';  # equivalent to DENY
Content-Security-Policy: frame-ancestors 'self';  # equivalent to SAMEORIGIN
Content-Security-Policy: frame-ancestors 'self' https://trusted-partner.com; # more specific

# Always use nosniff — tells browser to respect the declared Content-Type
X-Content-Type-Options: nosniff

# Without this, browsers may try to "sniff" the content type — treating
# a text file as JavaScript if it looks like script, which enables attacks

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

const app = express();

// Helmet sets secure defaults for all major security headers
app.use(helmet());

// Or configure each header explicitly:
app.use(
  helmet({
    contentSecurityPolicy: {
      directives: {
        defaultSrc: ["'self'"],
        scriptSrc: ["'self'", "'nonce-rAnd0mN0nce'"],
        frameAncestors: ["'none'"],
        upgradeInsecureRequests: [],
      },
    },
    hsts: {
      maxAge: 63072000,
      includeSubDomains: true,
      preload: true,
    },
    frameguard: { action: 'deny' },
    noSniff: true,
    referrerPolicy: { policy: 'strict-origin-when-cross-origin' },
  })
);

server {
    listen 443 ssl http2;
    server_name yoursite.com;

    # Security headers
    add_header Strict-Transport-Security "max-age=63072000; includeSubDomains; preload" always;
    add_header X-Frame-Options "DENY" always;
    add_header X-Content-Type-Options "nosniff" always;
    add_header Referrer-Policy "strict-origin-when-cross-origin" always;
    add_header Permissions-Policy "camera=(), microphone=(), geolocation=()" always;
    add_header Content-Security-Policy "default-src 'self'; script-src 'self'; frame-ancestors 'none';" always;

    # ... rest of config
}

/** @type {import('next').NextConfig} */
const nextConfig = {
  async headers() {
    return [
      {
        source: '/(.*)',
        headers: [
          {
            key: 'Strict-Transport-Security',
            value: 'max-age=63072000; includeSubDomains; preload',
          },
          {
            key: 'X-Frame-Options',
            value: 'DENY',
          },
          {
            key: 'X-Content-Type-Options',
            value: 'nosniff',
          },
          {
            key: 'Referrer-Policy',
            value: 'strict-origin-when-cross-origin',
          },
          {
            key: 'Permissions-Policy',
            value: 'camera=(), microphone=(), geolocation=()',
          },
          {
            key: 'Content-Security-Policy',
            value: "default-src 'self'; script-src 'self'; frame-ancestors 'none';",
          },
        ],
      },
    ];
  },
};

module.exports = nextConfig;