How Can I Bypass the X-Frame-Options: SAMEORIGIN HTTP Header?

Question

I am developing a web page that needs to display, in an iframe, a report served by another company's SharePoint server. They are fine with this.

The page we're trying to render in the iframe is giving us X-Frame-Options: SAMEORIGIN which causes the browser (at least IE8) to refuse to render the content in a frame.

First, is this something they can control or is it something SharePoint just does by default? If I ask them to turn this off, could they even do it?

Second, can I do something to tell the browser to ignore this http header and just render the frame?

Eliseelisee

Answer 1

If the 2nd company is happy for you to access their content in an IFrame then they need to take the restriction off - they can do this fairly easily in the IIS config.

There's nothing you can do to circumvent it and anything that does work should get patched quickly in a security hotfix. You can't tell the browser to just render the frame if the source content header says not allowed in frames. That would make it easier for session hijacking.

If the content is GET only you don't post data back then you could get the page server side and proxy the content without the header, but then any post back should get invalidated.

Commissary

displaying in an iframe is not allowed, but is there a way to still get the html as a raw String? – Nombril

You should be able to scrape it and do whatever you want with the markup. – Ares

@Ares that's what I meant by proxy the content :-) – Commissary

I would rephrase probably ;-) – Ares

Answer 2

UPDATE: 2019-12-30

It seem that this tool is no longer working! [Request for update!]

UPDATE 2019-01-06: You can bypass X-Frame-Options in an <iframe> using my X-Frame-Bypass Web Component. It extends the IFrame element by using multiple CORS proxies and it was tested in the latest Firefox and Chrome.

You can use it as follows:

1. (Optional) Include the Custom Elements with Built-in Extends polyfill for Safari:

   <script src="https://unpkg.com/@ungap/custom-elements-builtin"></script>
   

2. Include the X-Frame-Bypass JS module:

   <script type="module" src="x-frame-bypass.js"></script>
   

3. Insert the X-Frame-Bypass Custom Element:

   <iframe is="x-frame-bypass" src="https://example.org/"></iframe>
   

Gelt

This approach looks to be blocked now. – Hapless

"Refused to display 'https://news.ycombinator.com/' in a frame because it set 'X-Frame-Options' to 'DENY'." Followed by "fiddle.jshell.net/:64 Uncaught SecurityError: Sandbox access violation: Blocked a frame at "http://fiddle.jshell.net" from accessing a frame at "null". The frame being accessed is sandboxed and lacks the "allow-same-origin" flag." – Aksel

@Aksel Refresh the page. It works for me in Firefox 46. – Gelt

@Gelt Results are now... inconclusive. Linked version still doesn't load - however, it does load in the jsFiddle editor, and then reloading the embedded view (as linked) displays - but it's pulling from cache. Clearing caching and reloading again fails. I wondered if the contents were being served via a proxy on jsFiddle's server, but the dev tools show network traffic directly to the target site. Even though the console still shows the "refused to display" error. Must do more digging... – Aksel

Yes this is not working. Anyone has identified any way to handle this? – Barrio

@Barrio & BlueBird: I have updated the demo, it is working for me in Chrome 67. – Gelt

@Barrio Tried refreshing the page? What's the error in web console? – Gelt

@Gelt - this is working amazingly well. Thanks for the solution. – Barrio

How come this is not fixed in all major browsers yet? For me, it works with Firefox 61 against both X-Frame-Options: sameorigin and X-Frame-Options: deny. – Decrease

@Decrease it is in Chrome 70 where I get an Uncaught DOMException: Blocked a frame with origin "https://example.org" from accessing a cross-origin frame. – Jordain

@JeroenWiertPluimers Have you refreshed the page? – Gelt

@Gelt odd: sometimes it works. Sometimes it fails. Not sure why yet. If I find out, I will post here. – Jordain

@JeroenWiertPluimers Try my new X-Frame-Bypass custom element! – Gelt

x-frame component was great but it wasn't accessible throught google chrome extension.... sigh...! any other clues? – Herringbone

This doesn't bypass X-Frame-Options options at all, it just uses a proxy to scrape the target page and return the content without the header. It will only work for GET requests, won't get cookies, can only scrape pages the third party proxies (one ofcors.io, jsonp.afeld.me, cors-anywhere.herokuapp.com) can access (and may leave a copy of the content on one of those sites). As the OP is asking about Sharepoint this connection is likely to be over a VPN and certain to require cookies, neither of which will work with the undocumented third party proxies. – Commissary

It seem that this tool is no longer working and no longer being maintained from all the issues at github. Even the example page in the README which try to load something from Hacker News, fails. – Gujral

anyone find any solution ? X-Frame-Bypass in this post does not work anymore – Antipope

The tool is working fine as of today, at least in Chrome, but I can't get it to work with VueJS. I've tried registering the component, embedding the JS with my Vue code, etc., but no luck. – Poulos

Is there a way to protect against this? Since X-Frame-Bypass is working? – Mistletoe

@Mistletoe Why would you protect from this functionality? The web should be open, free, not blocked. – Gelt

@NickDimou It works fine as of now: i.postimg.cc/CLHBFnZ7/X-Frame-Bypass-Web-Component-Demo.png – Gelt

@niutech, if this is the case, please update your answer with today's date. Thank you! – Anemone

@Gelt in order to protect my website from clickjacking. – Mistletoe

most sites use dynamic javascript to check robots or proxies—that is why these don't work with high-end websites. – Evers

Answer 3

The X-Frame-Options header is a security feature enforced at the browser level.

If you have control over your user base (IT dept for corp app), you could try something like a greasemonkey script (if you can a) deploy greasemonkey across everyone and b) deploy your script in a shared way)...

Alternatively, you can proxy their result. Create an endpoint on your server, and have that endpoint open a connection to the target endpoint, and simply funnel traffic backwards.

Huoh

Answer 4

Yes Fiddler is an option for me:

1. Open Fiddler menu > Rules > Customize Rules (this effectively edits CustomRules.js).
2. Find the function OnBeforeResponse

3. Add the following lines:

   oSession.oResponse.headers.Remove("X-Frame-Options");
   oSession.oResponse.headers.Add("Access-Control-Allow-Origin", "*");
   

4. Remember to save the script!

Scarificator

Answer 5

As for second question - you can use Fiddler filters to set response X-Frame-Options header manually to something like ALLOW-FROM *. But, of course, this trick will work only for you - other users still won't be able to see iframe content(if they not do the same).

Latonia