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="">');
    </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.

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.">');
    </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.

• javascript
• jquery
• html
• iframe

• There is no workaround except maybe reproxify google. server side, setting base tag to relevant domain for handling all possible relative link paths and then set the same for all links in links and links in links of links in other links pointings to other domain... I guess you'd better have to buy google – A. Wolff Commented Oct 23, 2015 at 15:12
• Look at the error message in the console. – SLaks Commented Oct 23, 2015 at 15:12

3 Answers 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 patible 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.

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

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

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