Background:
I'm working on a rails app that will open up articles inside the app itself via an iframe (with a navbar at the top from my app, kind of like StumbleUpon). But I've noticed some websites that publish articles (examples: pitchfork.com, vox.com, theverge.com) prevent themselves from being loaded in an iframe by setting X-Frame-Options to SAMEORIGIN or DENY.
My current plan to work around this is to look at the header for the link and examine it to see if it contains X-Frame-Options. If so, I will set it to forego the iframe and just open up the original site in a new tab.
This method seems to work for some websites (like pitchfork.com) because when I request the header from pitchfork.com, I get the following:
server: nginx/1.4.6 (Ubuntu)
content-type: text/html; charset=utf-8
x-frame-options: SAMEORIGIN
date: Wed, 27 Jan 2016 17:47:54 GMT
x-varnish: 912263733 912263044
age: 8
via: 1.1 varnish
connection: keep-alive
Problem:
For some websites (like vox.com), when I load them in an iframe, the chrome developer console tells me that x-frame-options is preventing the site from loading in an iframe. But when I examine the header, x-frame-options is nowhere to be found! All I get is this:
server: nginx/1.6.2
date: Wed, 27 Jan 2016 17:26:15 GMT
content-type: text/html
content-length: 172
connection: close
How is vox.com doing this? For further clarification, I tried using this tool that I found in another stackoverflow post and it also failed to correctly detect that vox.com was blocking iframes via x-frame-options.
1) Is Vox able to set the x-frame-options somewhere other than the header? If the latter, how can I detect and find that?
2) Any other alternate strategies you recommend for detecting iframe-unfriendly sites so that I can have them set to open in a new tab instead?
Take a look at the network traffic recorded in the Chrome console. In your app, you're looking at the headers of the HTTP 301 Moved Permanently response, which then redirects you to the location that does return the X-Frame-Options: SAMEORIGIN header.
Other methods, such as the newer Content-Security-Policy header or JavaScript code, may be used by other websites to prevent iframe embedding. But in the case of vox.com, you're simply looking at the headers of the wrong response.