59

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?

Daniel Coffman
  • 1,997
  • 3
  • 26
  • 34

5 Answers5

37

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.

Keith
  • 150,284
  • 78
  • 298
  • 434
35

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>
not2qubit
  • 14,531
  • 8
  • 95
  • 135
niutech
  • 28,923
  • 15
  • 96
  • 106
  • 7
    This approach looks to be blocked now. – Karl Glennon Mar 08 '16 at 16:52
  • "`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.`" – brichins Jun 14 '16 at 16:04
  • @brichins Refresh the page. It works for me in Firefox 46. – niutech Jun 15 '16 at 14:53
  • @niutech 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... – brichins Jun 15 '16 at 18:47
  • Yes this is not working. Anyone has identified any way to handle this? – Samir Jul 12 '18 at 11:59
  • @Samir & BlueBird: I have updated the demo, it is working for me in Chrome 67. – niutech Jul 12 '18 at 15:21
  • @Samir Tried refreshing the page? What's the error in web console? – niutech Jul 13 '18 at 14:37
  • 3
    @niutech - this is working amazingly well. Thanks for the solution. – Samir Jul 13 '18 at 14:48
  • 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`. – caw Aug 21 '18 at 22:11
  • @caw 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.` – Jeroen Wiert Pluimers Nov 02 '18 at 18:44
  • @JeroenWiertPluimers Have you refreshed the page? – niutech Nov 21 '18 at 18:11
  • 1
    @niutech odd: sometimes it works. Sometimes it fails. Not sure why yet. If I find out, I will post here. – Jeroen Wiert Pluimers Nov 22 '18 at 17:22
  • 1
    @JeroenWiertPluimers Try my new [X-Frame-Bypass](https://github.com/niutech/x-frame-bypass) custom element! – niutech Jan 07 '19 at 16:01
  • x-frame component was great but it wasn't accessible throught google chrome extension.... sigh...! any other clues? – gumuruh Sep 16 '19 at 08:02
  • 16
    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 of`cors.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. – Keith Oct 21 '19 at 07:11
  • 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. – not2qubit Dec 30 '19 at 18:00
  • anyone find any solution ? X-Frame-Bypass in this post does not work anymore – OsamahM Jun 16 '20 at 05:30
  • 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. – ultrageek Aug 26 '20 at 00:01
  • Is there a way to protect against this? Since X-Frame-Bypass is working? – Noob May 14 '21 at 02:17
  • @Noob Why would you protect from this functionality? The web should be open, free, not blocked. – niutech May 14 '21 at 16:11
  • @NickDimou It works fine as of now: https://i.postimg.cc/CLHBFnZ7/X-Frame-Bypass-Web-Component-Demo.png – niutech May 14 '21 at 16:14
  • @niutech, if this is the case, please update your answer with today's date. Thank you! – NDi May 14 '21 at 20:05
  • @niutech in order to protect my website from clickjacking. – Noob May 15 '21 at 18:09
  • most sites use dynamic javascript to check robots or proxies—that is why these don't work with high-end websites. – Boontawee Home Aug 19 '22 at 16:54
10

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.

Rob
  • 1,351
  • 1
  • 11
  • 11
8

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!
Stephan Henningsen
  • 3,665
  • 1
  • 22
  • 29
Jay Byford-Rew
  • 5,736
  • 1
  • 35
  • 36
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).

Pj_pavel
  • 387
  • 3
  • 16