I know that, for security reasons, javascript can't read the contents of an iframe if it belongs to a different domain. This makes sense, given that the entire page could be an iframe with snooping scripts outside of the frame.
The question is - are there equal limitations in the other direction? Can javascript within an iframe (from a different domain) read and manipulate the dom in its parent window?
Thanks!
You can't.
This would be a security hole. Now that everyone is crazy adding facebook iframes to their sites, imagine if javascript from FB could interact with your page ;)
Anyway, i set up a small example, and got the same origin warning when i tried to get a parent's div from inside the iframe (which was in another domain)
If you want to use this in a two domains that you own (not trying to attack anyone) you can do that using ajax as described Here.
Related
Now I know there are a lot of resources about same origin policy, but I just want a straight up answer for my specific query as I am really struggling to understand.
I am using Facebook plugins on my website, these create iframes that are only visible in the DOM when I use chromes inspect element etc.
Is there a way that I can access these iFrames properties/attributes at all, or is it a resounding "NO CHANCE!". I am spending far too much time on this and I just need to get a final verdict.
Thanks!
Javascript doesn't see the iframe content. Chrome inspector just loads 2 different websites in the same time, yours and the plugins one, so you can play with both of them.
Just curious, how would you like to change it?
In general, JavaScript cannot access iframe content from outside of the iframe, unless the page domain and the iframe domain share the same protocol and host and port. In your case, this could possibly be done using a proxy server to load the iframe content from your domain.
http://en.wikipedia.org/wiki/Same_origin_policy
I have a web page with some javascript inside that will be embedded as iframe in different websites. I need to adjust the behaviour of my page according to the website in which it's being run. For this purpose, I tried to read top.location.href from my page, but that raised an error:
Unsafe JavaScript attempt to access frame with URL http://website.url
from frame with URL http://mypage.url. Domains, protocols and ports
must match.
Is there some way to go around this?
In the most common case you can indeed retrieve the parent url of the iframe. If the iframe is just one level deep this method will work:
var parentURL = document.referrer
https://developer.mozilla.org/en-US/docs/Web/API/document.referrer
I've used this method when creating iframe widgets. Just remember that if you want the top level window location, but it is not the parent window of your iframe...you won't be able to get it. Also, if your widget navigates within the iframe the referrer will then change.
Yet another excellent write-up by Nicholas Zakas can be found on his blog here:
http://www.nczonline.net/blog/2013/04/16/getting-the-url-of-an-iframes-parent/
This is as you stated the same origin policy and it is in place for security reasons. Without changing the users browser there is no way around it.
I've got a page with an iframe. The page and the source of the iframe are in different domains. Inside the iframe I'm using a rich text editor called CuteEditor (which has turned out to be not so cute). There are certain javascript functions in CuteEditor which try to access 'document' but the browser denies access since they're not in the same domain.
Here's the exact error:
Permission denied to access property 'document'
http://dd.byu.edu/plugins/cuteeditor_files/Scripts/Dialog/DialogHead.js
Line 1
Editing the javascript is out of the question because it's been minfied and obfuscated so all the variable names are cryptic.
Using a different editor is currently out of the question because this is a work project and this is the editor I've been told to use.
Is there a way to keep the iframe self-contained? So it does everything inside the iframe and doesn't try to break out to the parent frame?
If the child iframe is loaded from a different domain, then it will not be able to access the parent page or DOM.
However, there is a still a possible vulnerability to man-in-the-middle attack as follows. Suppose your page loads off http://yoursite.com and the iframe goes to http://badsite.org
first http://badsite.org redirects to http://yoursite.com/badpage
This is the step that requires a man-in-the-middle attack. The attacker must either be able to get between the user and yoursite.com, or control the answers to your DNS lookup. This is easier than it sounds -- anyone who has administrative control over a public WiFi access point could do it (think Starbucks, hotels, airports.) The goal is to serve the content of http://yoursite.com/badpage from the attacker's site, not your actual site.
The attacker can then serve whatever malicious code they like from the (fake) http://yoursite.org/badpage. Because this is in the same domain as the main page, it will have access to the parent DOM.
The HTML5 iframe sandbox attribute seems to be the way to avoid this. You can read the spec, but the best description might be here.
This seems to be supported on Chrome, IE10, FireFox, Safari.
The spec says that if the "allow-same-origin" attribute is not set, "the content is treated as being from a unique origin." This should prevent your child iframe from accessing any part of the parent's DOM, no matter what the browser thinks the URL is.
You shouldn't need to worry about that happening.
The only way iframes can talk cross-origin is with postMessage, and that's only possible if you're listening to that domain directly.
https://developer.mozilla.org/en/DOM/window.postMessage
Getting directly the current iframe's URL, in javascript, is not possible due to security restriction.
Is there a way to override this restriction?
Using ActiveX control?
Changing the browser's security options?
Using HTML5?
Using flash?
Using server side scripting?
Getting directly the current iframe's URL, in javascript, is not possible due to security restriction
If you mean cross-domain IFrames, and you have no way of controlling the inlying page, then this is correct.
As far as I know, no, there is no way to get around this.
The only way I can think of - and you don't want to go down that road - is proxying every page inside the iframe through a local server script, rewriting every link and action within each page to go through the proxy, too. But that is hugely difficult, comes with a shitload of things to be aware of, and is not a real option - many modern sites will simply break if proxied that way.
As I understand it if you have no control of the frame you are not supposed to know what is going on in this frame. So, knowing it would be a security bug and should be fixed. Browsers are designed to not allow the page spy on what you are doing in another page.
If you have control over iFrame there are some options for you
There is a discussion here:
How do I get the current location of an iframe?
basically
var iframe = document.getElementById('loader').src
You can actually get the location if iframe is located at the same server. If it is located at a different server the only way to go is to rewrite URLs like some sites do. It is not easy to do though
You can also do HTML5 cross-window communication:
http://ajaxian.com/archives/cross-window-messaging-with-html-5-postmessage
Let's say I'm a js script living inside a html page. I need to know if I am inside a specific IFrame.
Something like
if (top.location.href === 'http://specificurl/') ...
However I need this working from any domain.
I have also tried adding a value to the window element in the iframe owner and checking on the child with the same result (permission error).
Any suggestions?
Thanks
Guido
Can't be done unless you have control over both pages/sites/domains (that is, the frame's page AND the main page).
If you do have control, check out the easyXDM framework or google for "cross domain communication iframe"
And the reason this can't be done is simple security. Imagine if you visited a site that contained a frame which appeared to take up the whole page, and then visited your online banking site -> easy to see how malicious javascript could get all sorts of details, which is why it can only be done if the two sites/pages/domains are explicitly coded to work together
I figured out how I can do it in MY scenario. Fortunately my client script (living in frame) gets loaded dynamically by one of my scripts. I simply added a #anchor to the url and that was accessible inside the frame.
Very straight forward really.
Thanks for the help Graza, that product looks very interesting fortunately I don't need it.
Thanks
Guido