Security Headers Reference documents HTTP security headers β the response headers your server sends to tell browsers how to protect your users. Each header entry includes its purpose, recommended value, syntax options, browser support, and examples. Use this as a lookup guide when configuring CSP, HSTS, X-Frame-Options, and other security headers for your web application.
Security headers are a defense-in-depth mechanism. They don't prevent all attacks, but they significantly raise the cost of common attacks: Content-Security-Policy (CSP) restricts where scripts, styles, and images can load from β mitigating XSS. Strict-Transport-Security (HSTS) forces HTTPS for subsequent visits β preventing SSL stripping. X-Frame-Options / frame-ancestors prevents clickjacking. X-Content-Type-Options: nosniff prevents MIME-type sniffing attacks. Referrer-Policy controls what URL is sent in the Referer header.
Mozilla Observatory (observatory.mozilla.org), Security Headers (securityheaders.com), and Google's CSP Evaluator are free tools for scoring your headers. The OWASP Secure Headers Project documents best practices. Modern frameworks and hosting platforms (Vercel, Cloudflare, Netlify) have built-in options to set security headers via configuration files (vercel.json, _headers, netlify.toml).
HSTS header
Result: Strict-Transport-Security: max-age=63072000; includeSubDomains; preload
Basic CSP
Result: Content-Security-Policy: default-src 'self'; script-src 'self' 'nonce-random123'; style-src 'self'
Prevent clickjacking
Result: X-Frame-Options: DENY (or: Content-Security-Policy: frame-ancestors 'none')
What is Content Security Policy (CSP)?
CSP is an HTTP response header that tells the browser which origins are allowed to load resources (scripts, styles, images, fonts, iframes). It mitigates XSS by preventing inline scripts and restricting external script sources. Directives: default-src (fallback), script-src (JavaScript), style-src (CSS), img-src (images), connect-src (XHR/fetch/WebSockets), frame-src (iframes), font-src. Example: Content-Security-Policy: default-src 'self'; script-src 'self' https://cdn.jsdelivr.net. 'self' means same origin only. 'nonce-value' allows specific inline scripts.
What is HSTS and why do I need it?
HTTP Strict Transport Security (HSTS) tells the browser that your site should only be accessed over HTTPS β and to remember this for max-age seconds. After the first HTTPS visit, the browser automatically upgrades all subsequent requests to HTTPS without a round-trip β preventing SSL stripping attacks where a network attacker downgrades HTTPS to HTTP. The preload flag registers your domain with browser preload lists (hstspreload.org) β the browser enforces HTTPS even on the very first visit, before any HSTS header is seen. Recommended: max-age=63072000 (2 years); includeSubDomains; preload.
What is X-Content-Type-Options and why does it matter?
X-Content-Type-Options: nosniff prevents MIME-type sniffing β browsers trying to 'guess' the content type of a response when the server doesn't specify it clearly. Without this header, a browser might execute a text file as JavaScript if it contains script-like content (MIME confusion attacks). With nosniff: the browser uses exactly the Content-Type header the server sends, refusing to execute/render if there's a mismatch. Always set X-Content-Type-Options: nosniff β there's no downside.
What is the Permissions-Policy header?
Permissions-Policy (formerly Feature-Policy) restricts which browser APIs a page and its embedded iframes can access. Examples: geolocation, camera, microphone, payment, fullscreen, accelerometer. Syntax: Permissions-Policy: camera=(), microphone=(), geolocation=(self). () means no one can use it; (self) means only the same origin; ('https://trusted.com') allows a specific origin. This prevents embedded third-party content (ads, iframes) from accessing sensitive device APIs. Especially important if you embed third-party scripts or iframes.
How do I add security headers in Nginx, Apache, and Cloudflare?
Nginx: in server or location block: add_header Strict-Transport-Security 'max-age=63072000; includeSubDomains; preload' always; add_header X-Content-Type-Options 'nosniff' always;. Apache: in .htaccess or VirtualHost: Header always set X-Frame-Options 'DENY'. Express.js (Node.js): use the Helmet middleware (npm install helmet) β helmet() sets 14 security headers automatically. Cloudflare: use Transform Rules β Modify Response Header, or use Workers to inject headers. Netlify: add a _headers file in your deploy folder. Vercel: add headers array in vercel.json.