113

I am getting the below error when i try to set a hash value to the parent url from iframe which contains another domain url:

Unsafe JavaScript attempt to access frame with URL "URL1" from frame with URL "URL2". Domains, protocols and ports must match.

How can I fix this problem?

derekerdmann
  • 17,696
  • 11
  • 76
  • 110
Atul
  • 4,463
  • 5
  • 23
  • 19
  • 3
    Please add more details, code snippets, error message, framework you use.. More verbosity, more details.. – fifigyuri Dec 01 '10 at 12:03
  • 5
    What about when you implement g+1, facebook like or shre and twitter social plugins that loads in iframes and are throwing the same error? –  Jan 08 '12 at 10:06
  • The question is WHY Facebook and Google scripts are even TRYING to access my website elements. – sergio May 05 '14 at 21:44

6 Answers6

125

From a child document of different origin you are not allowed access to the top window's location.hash property, but you are allowed to set the location property itself.

This means that given that the top windows location is http://example.com/page/, instead of doing

parent.location.hash = "#foobar";

you do need to know the parents location and do

parent.location = "http://example.com/page/#foobar";

Since the resource is not navigated this will work as expected, only changing the hash part of the url.

If you are using this for cross-domain communication, then I would recommend using easyXDM instead.

Sean Kinsey
  • 37,689
  • 7
  • 52
  • 71
  • 13
    No one has marked this as the answer and yet it has 60 upvotes. There should be a badge for this. – zachzurn Jan 25 '13 at 21:40
  • 36
    What would the badge be called? "Responded to a lazy person" – nzifnab Jan 29 '13 at 19:12
  • 1
    Hey @atul, be kind and mark this answer as the best one. Be respectful with the conventions that allow all of us to benefit from the knowledge of others... – Clint Eastwood Jan 06 '15 at 17:50
14

Crossframe-Scripting is not possible when the two frames have different domains -> Security.

See this: http://javascript.about.com/od/reference/a/frame3.htm

Now to answer your question: there is no solution or work around, you simply should check your website-design why there must be two frames from different domains that changes the url of the other one.

EvilMM
  • 901
  • 4
  • 9
  • 83
    This is a frequent requirement where one is embedding a third party application into your website, especially where web services and the like is not an option. – Jacques Aug 22 '11 at 09:19
10

I was getting the same error message when I tried to change the domain for iframe.src.

For me, the answer was to change the iframe.src to a url on the same domain, but which was actually an html re-direct page to the desired domain. The other domain then showed up in my iframe without any errors.

Worked like a charm.:)

Satish Hawalppagol
  • 150
  • 3
  • 15
Tommy
  • 101
  • 1
  • 2
  • could you elaborate more on exactly what you did here? – Devin Rhode Apr 13 '12 at 09:39
  • it would be really helpful if you can explain briefly. – Madhusudhan Apr 24 '12 at 14:10
  • 2
    Doesn't work in latest Chrome: it does not check src parameter, but actual URL loaded. So the redirect trick unfortunately does not help in any way :-( – lucaferrario Jun 11 '12 at 14:11
  • 3
    I believe what Tommy is referring to is a server side proxy. See e.g. http://benalman.com/projects/php-simple-proxy/ or http://developer.yahoo.com/javascript/howto-proxy.html or https://www.google.com/webhp?q=server%20side%20proxy%20in%20%7Byour%20favorite%20language%7D or René de Kat's solution at http://stackoverflow.com/a/11224975/27938 – Oskar Austegard Nov 19 '12 at 14:23
  • That's neat. But it just illustrates how generally trivial it is to get around this. Okay, let's assume that I'm an evil malicious hacker, and I want to run cross domain scripting attacks. Chances are I'm going to know about these tools, and use them. As far as browser security fixes, this is easily as retarded as IE not letting you run Javascript locally without a warning. Solves no problem. Creates a bunch of new ones. – Yitzhak Mar 30 '13 at 17:15
7

A solution could be to use a local file which retrieves the remote content

remoteInclude.php

<?php
$url = $_GET['url'];
$contents = file_get_contents($url);
echo $contents;

The HTML

<iframe frameborder="1" id="frametest" src="/remoteInclude.php?url=REMOTE_URL_HERE"></iframe>
<script>
    $("#frametest").load(function (){       
    var contents =$("#frametest").contents();
});

  • 1
    **This opens the door for cross-site scripting vulnerabilities.** An example of a possible attack: **1.** I create a page on myevilserver.com that looks just like your site, including a login form that POSTs back to myevilserver.com **2.** I send out a fake newsletter to your users with a link to https:// yoursite.com/remoteInclude.php?url=myevilserver.com **3.** They see a login form on your site that I capture on my server. – EricP Feb 07 '13 at 16:38
  • 2
    A possible solution is to make remoteInclude.php check all url's against a pre-approved list of domains. – EricP Feb 07 '13 at 16:42
  • This does not solve cross site scripting vulnerability issues. There's absolutely nothing I can do with Javascript to an external website that I can't do from the server side. All this does is hinder the browser itself and makes web apps less useful by introducing an extra step. You can still do all this stuff if you load through ajax, rewrite links, and post back. If that doesn't work, remote rpc it through php or whatever language. It's absurd that this is even an issue for the average coder. – Yitzhak Mar 30 '13 at 17:04
3

I found that using the XFBML version of the Facebook like button instead of the HTML5 version fixed this problem. Add the below code where you want the button to appear:

<div id="fb-root"></div>
<script>(function (d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<fb:like send="true" layout="button_count" width="50" show_faces="false" font="arial"></fb:like>

Then add this to your HTML tag:

 xmlns:fb="http://ogp.me/ns/fb#"
Luke Alderton
  • 3,198
  • 1
  • 23
  • 34
1

The problem is even if you create a proxy or load the content and inject it as if it's local, any scripts that that content defines will be loaded from the other domain and cause cross-domain problems.

user2345833
  • 11
  • 1