How to enable HSTS (Strict-Transport-Security) on your app

Medium

The Strict-Transport-Security header makes browsers refuse to connect to your site over plain HTTP for a set period, closing the window for SSL-stripping attacks.

Why it matters

Without HSTS, a user typing your domain on hostile Wi-Fi can be intercepted before the redirect to HTTPS happens.

Quick fix

Add: Strict-Transport-Security: max-age=63072000; includeSubDomains
Only add 'preload' once every subdomain supports HTTPS.

Step by step

Vercel / Next.js / Netlify

Use the matching snippet:

// next.config.js
module.exports = {
  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=()" },
      ],
    }];
  },
};

Netlify / Cloudflare Pages

# public/_headers (Netlify and Cloudflare Pages)
/*
  Strict-Transport-Security: max-age=63072000; includeSubDomains; preload
  X-Frame-Options: DENY
  X-Content-Type-Options: nosniff
  Referrer-Policy: strict-origin-when-cross-origin
  Permissions-Policy: camera=(), microphone=(), geolocation=()

Prompt for your AI builder

Paste this into Lovable, Bolt, v0, Cursor or Replit, then review the changes before deploying.

Add a Strict-Transport-Security header with max-age=63072000; includeSubDomains to every response of my app using my hosting platform's header configuration.

FAQ

My host already redirects to HTTPS. Do I still need HSTS?

Yes. The redirect happens after the first insecure request; HSTS stops browsers from making that request at all on later visits.

References

Check your app

Run a free scan