Security Headers & CSP in HTML

Security Headers You Can Set in HTML

While security headers are best set on the server, the <meta http-equiv> tag can set some policies directly in HTML.

Content Security Policy (CSP)

CSP tells the browser which sources are allowed to load scripts, styles, images, etc. It is the most powerful defense against XSS.

CSP Directives

Directive	Controls	Example
script-src	JavaScript sources	script-src 'self' cdn.example.com
style-src	CSS sources	style-src 'self' 'unsafe-inline'
img-src	Image sources	img-src 'self' data: https:
connect-src	XHR/Fetch/WS URLs	connect-src 'self' api.example.com
frame-ancestors	Who can embed you	frame-ancestors 'none'
default-src	Fallback for all	default-src 'self'

Nonce-based CSP (Modern Approach)

Instead of allowing inline scripts globally (unsafe-inline), generate a unique nonce per request and only allow scripts with that nonce.