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.
Related
Doesn't have to be in the content script. I'm wondering if there's any way to check if say a person is logged into like their bank website as I do not want the content script to do any processing on that for privacy reasons. Is there any easy way to do this without reloading the page. If not what's the easiest way to do this with reloading the page without cookies and comparing htmls?
I need to find if they're logged in on their bank or facebook or anything to disable the script. I do not care if the content script didn't run at all on pages in login areas. I've thought about various ways to detect members area, which all require a reload of the page and come with caveats:
Fetch page again using ajax without cookies if possible, to compare with the existing html of the page to see if it's the same. (tricky to send ajax without cookies, deleting and restoring cookies may disrupt user session).. also still requires a reload.
Creating an incognito window to fetch again without logging in and compare htmls (but this doesn't work in firefox as incognito is upto the user, it's also a bit annoying)
Load into iframe (can't do this either as iframes force load the images too)
Check if any logout link exists on page. I was doing this before and it does work most of the time actually but many sites have the logout links hidden in the dom even if it's not logged in. I suppose there may be a way around this if I detect actual style properties. It also doesn't work if the logout link is an icon or something so it's not ideal.
Any other ways to detect if they're in a members area or something?!
I was doing this to refetch it without cookies but it forces images to load as I have to insert it into the Dom to load the url in iframe:
function createframe(url) {
let iframe = document.createElement("iframe");
iframe.setAttribute("src", url);
iframe.sandbox = "allow-scripts";
}
I have a page with one button. When clicked, that button navigates to http://google.com/
$("#button").click(function(){
window.location="http://google.com";
});
I would like this navigation to work when this page is embedded within the iframe. I don't want to affect the outside host page, but rather only the contents of the iframe. What's a good cross-platform way to:
Detect if I'm contained in an iframe
If not, navigate like above.
If yes, navigate the iframe only?
(I'm going to try to implement the algorithm I just described, but regardless I think this question is interesting enough to be posted. If I succeed, I'll post my solution)
1) Detect if I'm contained in an iframe
if (window != window.top) {
// the page is inside an iframe
}
2) If not, navigate like above.
navigate like above
3) If yes, navigate the iframe only?
When you write window.location.href = 'http://www.google.com'; you are navigating the contents of the iframe, not that of the top page. If you want to navigate the top page, you can only do this if this top page is on the same domain as the iframe and you could use window.top.location.href.
UPDATE:
There is a security mechanism built in browsers which forbid you from redirecting to sites that set the X-Frame-Options: SAMEORIGIN response header when inside an iframe. That's the case with http://www.google.com. Simply navigate to this site and look at the response HTTP headers with FireBug or developer toolbar you are using and you will see this header. You cannot redirect to it and you will get the following error message:
Refused to display document because display forbidden by X-Frame-Options.
It's basically a security mechanism implemented by some sites whose authors didn't want you to embed them in an iframe.
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.
I'm trying to access the URL of an iFrame that I open on my site. The iFrame is from another domain so traditional methods violate the same origin policy and are flagged as cross site scripting. However, I just discovered window.postMessage, but I don't quite know how to pull it all together.
My goal is to capture the final URL in the iFrame. For example, a user clicks a button on my site to open an iFrame. Say that iFrame loads a web site and the user clicks around on the site. When they close the iFrame, I want to capture the URL so the next time they click the button on my site, I can open the iFrame to the same state that the site was in last time they visited. Is this possible with window.postMessage?
Thanks!
document.iframe[name].src
document.iframe[name].document.location.href
Let's say we have a web-page at a given location (like www.foo.com/page1.html) and that page contains this (global) code:
if (self != top) {
top.location.replace(location.href);
}
So, if we try to load that page into an IFRAME, the page will "jump" out of the iframe into the browser window, which will (as a consequence) destroy the page that contained the iframe.
This is OK, but I would like to implement an exception to that rule. Specifically, there is this other page on a different domain (like www.bar.com/page2.html), and I would like that this other page is able to embed the first page via an IFRAME.
How would I have to modify the code of the first page, so that it allows to be embedded into the other page?
Is this OK?
if (self != top && top.location.href !== "http://www.bar.com/page2.html") {
top.location.replace(location.href);
}
I doubt you'll be able to check the external parent page's URL because the Same Origin Policy should prevent access to any of its properties.
Maybe there is some trickery that I'm aware of that allows it anyway. Barring that, the best idea that comes to my mind is checking document.referrer. As far as I know, a document requested in an iframe will always have the embedding page's URL in the referrer across browsers.
If the referrer is http://www.bar.com/page2.html, the page is either in an iframe on that page, or it was linked to from there (which is the only really big shortcoming of this method: You can't tell for 100% sure whether it's an incoming link, or an iframe embed).
Obviously, the document's referrer is spoofable by the client but I don't think that's an issue here.
If you pass X-FRAME-OPTIONS http header with the value of SAMEORIGIN, most modern browsers (including IE8) will not let the content be iframed from an alien domain.
I thought it may help.