Certain websites won't appear with Iframe and

Question

I'm trying to load webpages on an another webpage (not hosted on my server), but due to cross-site/security scripting I'm unable to load up certain webpages. For example, google won't show up in an iframe or if I use jquery:

 <script>
      $("#siteload").html('<object data="http://google.com">');
    </script>

Just a note: I'm not trying to load google specifically, just any webpage that won't allow iframes..

Does anybody know of a workaround? How about loading an .html file on my server, will that work? & how?

Thank you for your help.

Answer 1

Certain websites block the usage of iframes. Google is one of them.

EDIT: I think google is sending a sameorigin setting along with it.

Answer 2

A few possible workarounds:

1. Don't use an iframe, use a div and $.load()

2. Find solutions on a case-by-case basis, in the case of Google use a Google Custom Search Engine instead (there are iframe-friendly solutions for most things, but it takes time to find them)

3. Use a proxy

4. Where available (Google is such a case), make your own page and try to match the style of the original (Google) page, then use an API to get the search content

Note that 3 and 4 cost potentially a lot of money, depending on traffic

Answer 3

This is done on purpose, website developers can set certain headers in the response to control which URL's (other websites) can load their content in <iframe>, <frame> or <object>. This is a way of protecting your website from attacks like Clickjacking.

For example: most of the browsers support the X-Frame-Options header

There are three possible values for X-Frame-Options:

DENY
The page cannot be displayed in a frame, regardless of the site attempting to do so.

SAMEORIGIN
The page can only be displayed in a frame on the same origin as the page itself.

ALLOW-FROM uri
The page can only be displayed in a frame on the specified origin.

Note that X-Frame-Options: Allow-From is not supported by Chrome, Safari etc.

The modern browsers handle these with the new Content Security Policy (CSP). So you can control this using the new header:

Content-Security-Policy: frame-ancestors

The CSP 2.0 which is supported by all the newer browsers are fully backward compatible as well.

I know this is not the answer to your question, but this information will give you some perspective into why you are not able to load the websites into your iFrame.