Back in the day iframes were used everywhere —keeping the URL the same while navigating, embedding Adobe Reader, even as a layouting tool 🤦🏽‍♀️— but they can circumvent some CSP policies, are an accessibility nightmare and most notably they are the main medium of clickjacking attacks. That’s why they’ve ve fallen from grace and because there are better alternative for almost every use case.

Clickjacking works by placing a legitimate website inside of an iframe and overlaying a transparent element with malicious intentions. Users think they are interacting with with the content of the iframe but their are actually clicking somewhere else.

Okay, the Content-Security-Policy header can block iframes with its frame-ancestors directive, but X-Frame-Options has a broader support.

It accepts the following directives:

• DENY: your site cannot be shown in an iframe.
• SAMEORIGIN: your site can only be shown in iframes with the same origin.
• ALLOW-FROM: allows you to specify an authorized target.

SAMEORIGIN and ALLOW-FROM are not reliable as they depend on browser implementation, so the best is to use both headers: CSP with frame-ancestors and X-Frame-Options: DENY to completely disable iframes for legacy browsers.

This entry is part of the Security Headers series.