Guide · 2026-10-16

How to add security headers on Vercel and Netlify

Three headers cover the basics for most sites:

• Strict-Transport-Security: always use HTTPS
• X-Content-Type-Options: nosniff: don't guess file types
• X-Frame-Options: DENY: don't allow your site inside other sites' frames

Vercel: vercel.json

{
  "headers": [{
    "source": "/(.*)",
    "headers": [
      { "key": "Strict-Transport-Security", "value": "max-age=31536000; includeSubDomains" },
      { "key": "X-Content-Type-Options", "value": "nosniff" },
      { "key": "X-Frame-Options", "value": "DENY" }
    ]
  }]
}

Netlify: public/_headers

/*
  Strict-Transport-Security: max-age=31536000; includeSubDomains
  X-Content-Type-Options: nosniff
  X-Frame-Options: DENY

Next.js (any host)

// next.config.js
module.exports = {
  async headers() {
    return [{ source: "/(.*)", headers: [
      { key: "X-Content-Type-Options", value: "nosniff" },
      { key: "X-Frame-Options", value: "DENY" },
    ]}];
  },
};

Next step after these: a Content Security Policy.