X-Frame-Options vs CSP frame-ancestors: Which Should You Use?

The Clickjacking Problem

Clickjacking is an attack where a malicious site embeds your website in a transparent iframe, tricking users into clicking buttons on your site without realizing it. It's used to hijack clicks for like buttons, delete actions, permission grants, and more.

Two HTTP headers prevent this: X-Frame-Options and Content-Security-Policy: frame-ancestors.

X-Frame-Options

The original anti-clickjacking header. Simple and widely supported:

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

Pros:

Universal browser support (including ancient browsers)
Simple to configure

Cons:

Only supports DENY and SAMEORIGIN — no wildcards or multiple domains
Cannot whitelist specific external domains
The deprecated ALLOW-FROM directive was never widely supported

CSP frame-ancestors

The modern replacement, part of Content Security Policy Level 2:

Content-Security-Policy: frame-ancestors 'none'                    # Same as DENY
Content-Security-Policy: frame-ancestors 'self'                    # Same as SAMEORIGIN
Content-Security-Policy: frame-ancestors 'self' https://trusted.com # Allow specific external domain

Pros:

Supports multiple domains and wildcards
More granular control
Part of the CSP standard — future-proof

Cons:

Not supported in IE 11 (if you still care about IE)
Requires CSP header setup

Which Should You Use?

Use both. Set X-Frame-Options for legacy browser coverage and frame-ancestors for modern security:

X-Frame-Options: DENY
Content-Security-Policy: frame-ancestors 'none'

If you need to allow specific domains to embed your site:

X-Frame-Options: SAMEORIGIN
Content-Security-Policy: frame-ancestors 'self' https://partner.com

Note: When both headers are present, modern browsers use frame-ancestors and ignore X-Frame-Options. Older browsers use X-Frame-Options.

When to Use SAMEORIGIN vs DENY

Use DENY / 'none' if your site should never be in an iframe (most websites)
Use SAMEORIGIN / 'self' if you embed your own pages (admin panels, preview panes)
Use frame-ancestors 'self' https://specific-domain.com if partners need to embed your content

Test Your Framing Protection

Run a WebSentry audit to check if your site has clickjacking protection. The scanner verifies both X-Frame-Options and CSP frame-ancestors and flags any issues.