I have a frameset on my server which hosts a top frame main menu which is on the same domain, and a bottom frame which the content is sometimes on the same domain and sometimes on a remote domain.
I would like to monitor the bottom frame to see if it changes, and if it does change, what URL it went to. Is there a way to do this using JavaScript?
If you have control over the content coming from your domain, you should be able to detect when the user is leaving your domain. You can catch normal link navigation by listening to click events, and add extra code to notify of navigation to any other ways the user may leave the page.
Once the frame is showing content from a remote domain, though, you won't be able to get any information out of it without co-operation from the content itself (which, even then, involves nasty cross-domain communication hacks). A frame pointing to a remote domain will not report any information about itself to your page, not even the current URL.
You should be able to bind to the load on the iframe and work with that.
Related
I have a webpage that displays an iframe containing a random website. After 10 seconds I want the website within the iframe to replace the "parent" website.
Let's say my website www.aaa.com has an iframe containing the website www.bbb.com. After 10 seconds I want the browser to replace the currently open www.aaa.com with www.bbb.com without reloading the page so the user doesn't lose their state. Basically replacing the document and updating the URL bar accordingly.
I can't just get the URL of the iframe and change location as the user could for instance be watching a video and it would start again from the beginning because of the page reload.
I've been searching for this for a few hours and there is absolutely nothing that I could find.
You can set window.location = "//www.bbb.com" but it will just fetch that webpage as usual.
You can set an url in the browser using window.history.replaceState(null, "test", "www.aaa.com/mypage?foo=bar") but it will fail crossdomain (it will even fail using a subdomain on your site).
And you cannot get the contents of a cross-domain iframe.
These are all related to cross-origin security. There may be exceptions, such as when you have elevated permissions (browser plugin). Some functionality may be available using CORS and what not, but you need cooperation from the owner of the other domain.
In short, the closest to what you want is probably to set the iframe to the full width/height of the window.
I'm creating a web-based game. As a part of it, the player must go to the home page of a website, and follow a series of link until he reaches to the "destination page" in the minor time possible. Think of it as a sort of link treasure hunt.
In order to control the game, I created a page with a javascript timer on the top, and an iFrame showing the website to surf (which is not mine and I have no control over it).
However this has a huge fault: it is not possible to detect the current cross-domain URL of the iFrame, so my page cannot know when the user has arrived to the destination page and stop the game.
Is there any alternative way I could achieve this?
Is there any alternative way I could achieve this?
No, there is not.
The Same Origin Policy completely prevents you from accessing properties of any window object that displays content from another domain.
(If one was a subdomain of the other, then document.domain would help. But from your problem description it doesn’t sound like that was the case.)
And besides the technical issue: Generating traffic and clicks (that will skew their statistics/analytics) on a site that you don’t own, just for the purpose of being able to present your own game, would be rather unfair (aka a “dick move”.)
You can wait upto the contentWindow of the iFrame is resolved and you have a reference to the iFrame's window, after you changed the source pragmatically.
once you have that, you can add a onload handler on iFrame's <body> and inject some postMessage call inside that handler, so once the body is loaded of the iFrame's window it wil call postMessage from the onload handler of body and it will notify your outer window, of-course you have to add message listener in outer window using window.addEventListener("message", callback)
I wrote a chrome extension which injects a toolbar on top of sites (say amazon.com) as an iframe at the top.
When the user click on the action button on the toolbar (inside iframe), it's basically a form submit action, with action pointing to my full site (on another domain).
It's working, however only inside the iframe. I'd like the whole page to redirect to my site, rather than the iframe.
Is there anyway to do that in extension?
If you are using an iframe :
Same Origin Policy prevents you from doing this.
Unless you can hack/XSS the other site's files to inject the JS, you will have a hard time.
Now if you legitimately need to communicate with the other page, and you either have control of the other page or can setup it to communicate with your server, you can use window.postMessage, JSONP or even Ajax with CORS (latter 2 will be harder to pass dynamic content though). But I believe it is not the case.
else :
you can directly inject the js script in to the page itself by that you can handle all operations in the main page same as running something on chrome console.
I have page(lets say https://example.com/dir1/tidy.html), that embeds an iframe that hosts content from another domain (lets say https://foobar.com/dir2/whatsup.html). If the user presses Cancel inside the embedded iframe page, is it possible to redirect the parent/container page to a different url (like https://example.com/dir2/yeah.html)? How do I accomplish this?
I'd have thought that since the iframe page belongs to a different domain, the same-origin-policy would stop me from using javascript to send events/actions to the parent page.
The same origin policy prevents you from reading data from the document on the parent domain.
It doesn't stop you from:
top.location = "foo bar baz";
Or even just:
...
We have an application that reconstructs external web sites in an Iframe from within our domain so we can use tools that run in the browser to inspect the external website. This is an unavoidable requirement since we need to gather information about the external page using JavaScript. If the page were not reconstructed from within our domain, we would run into cross site scripting issues.
The problem is that the scripts on some pages redirect out of the iframe, which stops our tool from working.
My query is whether there is a way to allow the scripts to run within the iframe, but not to affect the page that contains the iFrame?
Hope that makes sense - thanks!
No I do not thinks so.
If the Iframe is loaded from the same domain any script will have full access to the page.
The redirect out of the page you refere to is the page protection from Hijacking where another site tries to use the page contents.
By ridirecting out of an iframe they avoid that.
You could try using a separate window (window.open) to load the reconstructed external sites instead of an iframe. As long as they are at the same domain, they'll still be able to communicate, but the child window won't be likely to mess with your main window.
Alternatively, your outer window can do nothing, and be at a different (sub)domain from your control window. Your control window is an iframe in your outer window, and the reconstructed external site is another iframe sharing the same domain as your control frame. Now if your 'external' iframe tries to do something with window.top (besides navigate) it will fail because of the cross-domain policy, but your control iframe will share the same domain as your 'external' iframe, so you can inspect and manipulate it.
If you use the second approach, frames will still be able to navigate the top window. You can prevent it by adding something like this in the top window:
window.onbeforeunload = function(){return '';};
Now you'll be prompted with a dialog box if anything tries to navigate the page, and you can abort navigation. This will probably fix your current approach by itself, but it may be best to have the top window at a separate domain in case the external site tries to do anything unexpected with it.