I have a page with an iframe that contains a html page. I want to access a Javascript variable in the parent page from within the iframe. The name of the variable in the main page is observer.
I have tried this
parent.observer = 'aadasds';
but I am getting the following error:
Permission denied for to get property Window.observer
from
.
Exchanging values between iframes (and parent) is only allowed if both sites come from the same domain. If they do, your example should just work. If they don't, browsers inhibit the communication.
However there are a number of hacks to circumvent this: e.g the Yahoo.CrossFrame library described in Julien le Comte's blog using a third iframe to enable one way communication, or the "resize an iframe around the iframe"-idea described in Adam Fortuna's blog enabling two way communication.
Edit (as people still seem to read this old answer):
In modern Browsers you can use postMessage to exchange Data between iframes. There are many javascript libraries that try to emulate that functionality in older browsers, too. E.g. by mis-using the location.hash, like the jquery-postmessage-plugin does.
It sounds as though your iframes are using different domains. All major browsers block access to parent iframes if they are not using the same domain. IE if you have the domain www.test.com and you embedded a page from www.google.com and try to access/modify anything from google's website, you will be denied access.
The other answer to this question explains the implemented API post message. This can also be used to send/receive data from different frames from different domains. However, the things you can do with that are limited compared to if you had two frames using the same domain.
That being said, here is the answer if your iframes are using the same domain.
window.parent.observer;
Hope this helps someone :)
Related
I have a look at these two questions and i don't understand.
Redirect parent window from an iframe action
How to prevent IFRAME from redirecting top-level window
On one hand it appears that you can redirect the parent iframe and on the other you cannot?
When i try it, I have no problem redirecting the parent frame so i'm curious as in why everyone say you cannot redirect parent frame unless you are on the same domain. But I can redirect without having the frame on the same domain.
As stated previously, will redirect the parent iframe. One thing to bear in mind is that both the website, and the site contained in the iframe need to be on the same domain for this to work, or you'll get an access denied exception.
Is it browser related?
Edit
I have two pages and this works but shouldn't :
On domain 1
<html>
<body>
<iframe src="http://domain2.fr"></iframe>
</body>
</html>
On domain 2
<html>
<body>
<script type="text/javascript">
window.top.location.href = "http://google.fr";
</script>
</body>
</html>
The answer to Why it is possible is perfectly simple. window.location is part of the Web API, which is not exactly the same as the JavaScript core. It's part of the DOM interface, hence it's gouverned by W3C, not ECMA. That's why it allows you to manipulate the top-window's properties.
Strictly speaking, JS isn't capable of doing this, because it lacks IO capabilities, which makes the language extremely portable. That's why browser implementations require the DOM API, to query the DOM, and request repaints or interact with the client. The DOM, though, does need IO, because it renders, and reads from the actual UI. Some people in the ECMAScript committee would rather have seen the access to the window.top heavily restricted, if not removed all together, for XSS vulnerability reasons. Sadly W3C agreed to disagree, and implemented the window.top reference anyway.
Who's right or wrong in this case? I don't know, it's easy to redirect a client to a malicious site from within an iFrame, which is unsafe. But it would be frustrating to have an iFrame, and then not having access to the top window, which would mean not being able to interact with the client as easily. But that's not the point here. Bottom line is, you can change some top window properties, and it can be useful. Just think about mashups. They pose a lot of challenges in terms of XSS safety, but open up a lot of new and exciting possibilities for webaps. To plug some of the most dangerous XSS vulnerabilities, take a look at ADSafe, which was created by Douglas Crockford. Google has a similar lib, but I forgot its name ATM...
the Same origin policy doesn't apply here, either. By changing the url in the address bar in your browser window, you're changing the window.top.location.href property, too. If there were same-origin restrictions there, the internet would be dead. You're not sending a request to another location, you're not getting data from a third-party resource and loading it in your page, you're redirecting the browser to another location, which closes and clears the DOM.
My guess is that it is the same reason you can do the following:
Redirect top to Google
I found the rules for this behavior here: http://www.w3.org/TR/html5/browsers.html#valid-browsing-context-name-or-keyword
I couldn't find a "why", but personally I have found it useful to redirect the parent after someone has clicked on something within an iframe. You may want to first perform an async operation and validate something before redirecting the entire page. Since this is already possible using the <a> tag perhaps it was found appropriate in JS as well. Not sure why the <a> tag allows the functionality though.
That being said you can always prevent this behavior by adding sandbox="" attribute, example: http://jsfiddle.net/ppkzS/1/
Whenever you use iframes, frames, or objects, you set up a hierarchy of windows, with these items acting as "window"s in this hierarchy.
You can traverse this hierarchy with properties such as .parent, .frameElement and the like. The property .top is the window at the highest point in the hierarchy and usually corresponds to the outermost frame.
Some actions are prohibited between windows in the hierarchy, others are not. Changing the location of a window is not prohibited.
Ultimately, people who say you cannot do this are incorrect. What you can't do is access the contents of one window from a different window if their domains differ. However, you can modify their location properties.
If you have two frames on the same domain (and also same protocol and port too), then one frame can redirect the other to wherever you want, and also access javascript properties, execute function from the other frame, etc.
Should you redirect one frame from the other to another domain (or protocol, or port), then you would lose the ability to do all that I previously stated due to the Same Origin Policy, but the redirect itself is allowed because, before the redirect, the two frames satisfied said policy.
Here is some useful information: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Same_origin_policy_for_JavaScript
Quoting from that page:
Two pages have the same origin if the protocol, port (if one is
specified), and host are the same for both pages.
Obviously, frames is the same as pages.
Suppose i have a web page (www.demo.com) and that web page has some js(javascript1.js, javascript2.js) files.
Now i created another web page (called "www.newwebage.com") and loaded www.demo.com in an iFrame.
Now iwant to use those methods in javascript1.js and javascript2.js in my newwebpage.com, so that don't have create another js file for the newwebpage.com, i use those methods directly.
I tried "document.getElementById('yourIFrame').contentWindow.yourFunction();" but didn't find it working.
Its hard to achieve this, since your two websites don't come from the same origin.
"The essence of the Same Origin policy can be formulated as: windows can work in contexts of each other only if they are from same protocol://domain:port, or, shortly, from same origin."
http://javascript.info/tutorial/same-origin-security-policy
There are workarounds, namely the cross-window messaging, but you need to be in control of both domains. In essence, you would be fighting browsers that actively prohibit this, as it is considered a security flaw.
On the website http://imaginaryman-test.blogspot.com/ the typewriter is inside of an IFAME . Everything works correctly on all browsers when you go to the site directly http://castedspell.com/mark/ but when viewing the version embeded in an IFRAME it does not work on IE and throws errors in Chrome.
Unsafe JavaScript attempt to access frame with URL http://imaginaryman-test.blogspot.com/ from frame with URL http://castedspell.com/mark/. Domains, protocols and ports must match.
This is the source code for the embedded IFRAME
https://github.com/totheleftpanda/typeWrite/tree/master/mark
I understand that this is a security problem but I don`t know how to fix it and can not find any material that would help me solve the issue.
The easiest method is to set a PHP (or any server language) proxy that just gets the content of the page from the other domain and outputs it. The only real drawback is that the cookies of the client for the remote domain aren't sent.
Take a look at http://benalman.com/projects/jquery-postmessage-plugin/. This is a jquery plugin that sends message between the two frames. The two frames do not need to be on the same domain. But you do need to access both pages to be able modify them. I also wrote a post here that answers communication between iframes. How to capture clicks from iframe on another domain?
Your only chance is something like easyXDM. (or do it manually using the hash, but would prefer easyXDM)
See the SO answer: Cross-domain hash change communication
eg. if you wanna call a method:
http://easyxdm.net/wp/2010/03/17/remote-procedure-calls-rpc/
EDIT:
If I try your demo in firefox I don't get the "Unsafe JavaScript attempt to access" error at all. But in Chrome it's thrown many times.
You have so much other code in your example that I'm not even sure that your code causes the problem. You should do a very limited/basic test to see if your flash-communication works, without all those other javascripts.
I have had similar issues with this before. Basically if you have an iframe that contains a page from a domain that differs from the main page's domain, javascript will not be able to cross the boundaries between them. Javascript within the iframe will be able to talk within the iframe, javascript in the main page will be able to talk within the main page, but they will not be able to talk to each other.
This is a security issue that aims to stop cross-site scripting attacks. There are a number of hacks that you can put in place to get around this problem but they are all (or at least the ones I know of) rather hairy.
Here are some questions that you should answer before trying to go further:
1) What exactly are you trying to do between the pages using javascript?
2) Do you have access to the source of both pages?
It may be waaay simpler than the above answers. It looks like this function:
function playSound(){
swf.playSound();
}
Is written in the DOM timeline before swf is actually assigned to the swfObject in the function below it.
I would recommend moving that function down further and then retest.
Certain websites like Twitter, Flickr, etc avoid being stuck within an iframe. Is there any way to stop this from happening? I just need to see the public data so I am open to disabling Javascript, etc. How do I disable Javascript running on the iframe? Is this possible?
You can't disable JavaScript on iFrames or any other resources AFAIK.
The only way to reliably do this is to load the sites through a proxy PHP or other server-side script, filter out any JavaScript (which will break many sites), and fix all relative references to images and other media - a task that would take an insane amount of time to complete if you want the sites to actually work.
If you just need some data from the sites, proxying might work. Seeing as the Same Origin Policy would prevent you getting anything from an IFRAME from a different domain anyway, it is also the only way to access content on those sites using JavaScript.
In IE only, there is the <iframe security="restricted"> attribute. This disables JavaScript in the targeted document, which would break a JS frame-escape script — along with all other interaction that's script-dependent.
However, apart from the browser compatibility issue, it's very rude to frame a site that doesn't want to be framed, and it will work less and less anyway as more sites deploy X-Frame-Options.
I'm not sure what you mean by “need to see the public data”... as Pekka said, you won't be able to ‘see’ into an iframe's DOM from outside it, as that would be a security problem.
I apologize if this has been asked before. I searched but did not find anything. It is a well-known limitation of AJAX requests (such as jQuery $.get) that they have to be within the same domain for security reasons. And it is a well-known workaround for this problem to use iframes to pull down some arbitrary HTML from another website and then you can inspect the contents of this HTML using javascript which communicates between the iframe and the parent page.
However, this doesn't work on the iPhone. In some tests I have found that iframes in the Safari iPhone browser only show content if it is content from the same site. Otherwise, they show a blank content area.
Is there any way around this? Are there other alternatives to using iframes that would allow me to pull the HTML from a different domain's page into javascript on my page?
Edit:
One answer mentioned JSONP. This doesn't help me because from what I understand JSONP requires support on the server I'm requesting data from, which isn't the case.
That same answer mentioned creating a proxy script on my server and loading data through there. Unfortunately this also doesn't work in my case. The site I'm trying to request data from requires user login. And I don't want my server to have to know the user's credentials. I was hoping to use something client-side so that my app wouldn't have to know the user's credentials at the other site.
I'm prepared to accept that there is no way to accomplish what I want to do on the iPhone. I just wanted to confirm it.
You generally can NOT inspect the contents of an iframe from another domain via JavaScript. The most common answers are to use JSONP or have your original server host a proxy script to retrieve the inner contents for you.
Given your revisions, without modification or support from the secondary site, you are definitely not going to be able to do what you want via the iPhone's browser.
"In some tests I have found that iframes in the Safari iPhone browser only show content if it is content from the same site"
I found the same thing. Is this documented somewhere? Is there a workaround? This sounds like broken web standards to me, and I am wondering if there is a solution.