HTTP Security Headers Every Developer Must Know

A practical guide to CSP, HSTS, X-Frame-Options, and other HTTP headers that protect your site from common attacks.

HTTP Security Headers Every Developer Must Know

Why Security Headers Matter

TLS/HTTPS protects data in transit — but once a browser loads your site, additional headers determine whether JavaScript can be exploited, if your site can be embedded in iframes, and what resources the browser should trust. Security headers are your first line of defense.

The Essential Headers

Content-Security-Policy (CSP)

The most powerful. Controls what resources the browser will load and execute.

Content-Security-Policy:
  default-src 'self';
  script-src 'self' 'nonce-rAnd0m123';
  style-src 'self' 'unsafe-inline';
  img-src 'self' https: data:;
  connect-src 'self' https://api.example.com;
  frame-ancestors 'none';

Strict-Transport-Security (HSTS)

Forces browsers to use HTTPS for all future requests to your domain.

Strict-Transport-Security: max-age=31536000; includeSubDomains; preload

X-Frame-Options

Prevents clickjacking by controlling iframe embedding.

X-Frame-Options: DENY              # No framing at all
X-Frame-Options: SAMEORIGIN          # Only same origin allowed

X-Content-Type-Options

Stops browsers from MIME-sniffing a response away from the declared content-type.

X-Content-Type-Options: nosniff

Referrer-Policy

Controls how much referrer information is sent with outbound links.

Referrer-Policy: strict-origin-when-cross-origin

Permissions-Policy

Controls browser features (camera, microphone, geolocation) that can be used.

Permissions-Policy: camera=(), microphone=(), geolocation=()

Testing Your Headers

Use securityheaders.com to scan any URL and get a grade (A–F) with specific recommendations. Most sites can easily achieve an A rating.

Quick Win: Cloudflare

If you use Cloudflare, enable "Security Headers" in the Rules panel — adds all the major security headers automatically, no server config needed.

Common Mistakes

  • 'unsafe-inline' in CSP — defeats XSS protection
  • * in img-src or script-src — allows any origin
  • Missing frame-ancestors — allows clickjacking
  • Setting headers but not enforcing them server-side
← Back to Blog
Copied!