Important : While the `X-Frame-Options` header is still supported, it's recommended to use the Content Security Policy `frame-ancestors` directive instead. CSP provides more granular control and better browser support for framing policies. The `X-Frame-Options` header can be used alongside CSP as a fallback for older browsers. See our X-Frame-Options VS Frame-Ancestors article for more details.

X-Frame-Options HTTP Header

The X-Frame-Options HTTP response header is a security header that controls whether a webpage can be displayed in a <frame>, <iframe>, <embed>, or <object>. Its primary purpose is to prevent clickjacking attacks by ensuring your content isn't embedded on unauthorized websites.

Understanding X-Frame-Options

The X-Frame-Options header provides three directives to control how your content can be embedded:

Most restrictive option - prevents framing completely

X-Frame-Options: DENY

Allows framing only from the same origin

X-Frame-Options: SAMEORIGIN

Allows framing from a specific domain (deprecated)

X-Frame-Options: ALLOW-FROM https://trusted-domain.com

Directives Explained

DENY

The most restrictive option that prevents the page from being displayed in a frame on any site, including your own.

Example of DENY directive

X-Frame-Options: DENY

SAMEORIGIN

Allows the page to be displayed in a frame only if the site embedding it has the same origin (same protocol, domain, and port).

Example of SAMEORIGIN directive

X-Frame-Options: SAMEORIGIN

ALLOW-FROM

Important : The `ALLOW-FROM` directive is deprecated and has limited browser support. For modern applications, use the `frame-ancestors` directive in Content Security Policy instead.

Implementation Examples

Nginx Configuration

Nginx configuration for X-Frame-Options

add_header X-Frame-Options "sameorigin" always;

Apache Configuration

Apache configuration for X-Frame-Options

Header always set X-Frame-Options "sameorigin"

Modern Alternative: CSP frame-ancestors

Content Security Policy provides a more flexible alternative through its frame-ancestors directive :

See our Docs on Frame-Ancestors

Equivalent to X-Frame-Options: DENY

Content-Security-Policy: frame-ancestors 'none';

Equivalent to X-Frame-Options: SAMEORIGIN

Content-Security-Policy: frame-ancestors 'self';

Allow multiple trusted domains (more flexible than ALLOW-FROM)

Content-Security-Policy: frame-ancestors https://trusted-domain1.com https://trusted-domain2.com;

Browser Support

While X-Frame-Options is widely supported, CSP's frame-ancestors directive offers better flexibility and is the recommended approach for modern web applications.

Related Resources

Conclusion

While X-Frame-Options provides basic protection against clickjacking, modern web applications should consider using Content Security Policy's frame-ancestors directive for more flexible and comprehensive control over how their content can be embedded.