I have a parent opening a new window, and trying to detect when the child window has loaded. In Chrome, I've tried
open('http://www.google.com').onload = function() { alert(location.href); };
but that doesn't seem to work.
Why doesn't the above method work? Are there alternatives?
If you want to be absolutely certain that a page has loaded, you can use messaging.
If you are able to use HTML5, there is a new feature called web-messaging.
This works very well on cross domain sources.
If HTML5 is not an option, use JS instead. I used a simple jQuery plugin called: windowmsg. It has worked excellently for me. I'm really not sure about this working on a cross site environment, but I think it should.
Beware of the security issues that these kind of solutions offer.
The method as it is should work(and works for me), but not when opening a window with a document from a different domain.
For security-reasons the new window will not dispatch the load-event to a document from another domain.
Technically speaking the child window and parent window are two different instances of the browser. We call them as child window and parent window. They do not have access to each other.So its not possible to perform any action in one window on the click of HTML elements in second window.
So, I suggest that you should not open a new window if you need access. You can use fancybox or lightbox that is effectively a part of the same window and that, you have control.
Related
I've encountered the task to access parent window from iFrame, if the window in iFrame was loaded from another domain. If I understand correctly, all modern browsers do now allow to do this. So I'm here to find the best solution.
I'm going to accomplish this next way:
I have an overlay with an iFrame within it. This will work instead of pop-ups to prevent pop-up blockers to block my content. The task is to reload the main page when the document in the iFrame finishes some work.
In a document, which will be loaded to an iFrame, I will add
<div id="is_closed" class="false"></div>
In a parent window I'll add function, which will be called every second and check if this div still has class name "false". When this will be changed to "true", I'll call some callbacks.
If you have any better solution, please share it with me. Will appreciate any help.
Edit: This is impossible because it's not only impossible to manipulate parent window from child window, but vice versa too. My idea was to manipulate child window from parent window. I was wrong.
If I were you I would check out window.postMessage. It may do what you want:
For reference see the following:
MDN - Window.postMessage
https://stackoverflow.com/a/3076648/296889 - see the Window.postMessage section
If I understand correctly, all modern browsers do now allow to do this. So I'm here to find the best solution.
This is your solution. What you're asking is not possible.
See related questions:
How to access parent Iframe from JavaScript
<iframe> javascript access parent DOM across domains?
Cross-domain access in iframe from child to parent
EDIT
As mentioned in the comments below, #JeremysAwesome's answer offers a method that would allow cross-domain requests under certain circumstances. See the SO question below for more information.
Ways to circumvent the same-origin policy
but you can change the src attribute of the iframe (adding a #hashtag for example) and listen to the onhashchange event in the child window. Given that you're in position to change both pages.
another way would be: setting the iframes src to a javascript: link 500-ish milliseconds after it loads. Example:
setTimeout(function() {
document.getElementsByTagName("iframe")[0].src = `javascript:
(function(){
setInterval(function() {
if (document.getElementById("is_closed").className.match(/true/g)) {
...//see #jeremysawesome on how to do window.postMessage
}
})()`
}, 500);
While #jeremysawesome 's answer did work, this will work on an embedded iframe no matter the host domain, this is great when working with websites hosted on domains such as blogspot.com that don't allow you to change this type of content easily...
Now obviously you'll still need to launch window.postMessage, more info on that can be found on #jeremysawesome 's answer
set a variable/item in sessionStorage and use it on both sides as you wish.
localStorage can do it for longer times.
security risk is someone uses and manipulates this to hijack your side. BUT if someone wants to do so - there will allways be a possibility.
Remember: Life finds a way... ;-)
I know there have been several similar questions, but I haven't seen an answer to my specific need: Is there a way to click a button in a separately launched web page? For example, I launch another web page via:
<a href="x" target="y"> or
window.open()
Can I then click an input button in that launched web page programmatically?
Unless the page is underneath your own control or resides on the same domain then no, it is not possible. This would be cross-site scripting and all browsers have security sandboxes in place to keep something like this from happening. Why are you trying to programmatically press a button on a page that you're also programmatically opening?
Yes. When you do window.open it will return you a window object. Var win = window.open(); win.fnSubmit(); assuming fnSubmit is the function on the other page that will do the.clicking. and both pqges on the same domain.
This is a technique used by some hacking injection attacks. Basically you can inject javascript into the querystring that can attach itself to the DOM, change an image or swf file source or simply run when the page is loaded; example here and example here.
Or if you already know the structure of the other page you can directly target methods or objects.
But as these are not nice things I assume that you have good reasons why you can't touch the code on the receiving page but want to adjust its behaviour?
You can click on any element you can select.
You can only select elements in windows that you have security privelages to.
You have rights to your own window, and rights to windows within the same domain & security.
To access the element you'll need the window object, which is returned from window.open
var newWin = window.open(siteYouHaveAccessTo);
newWin.document.getElementById('foo').click();
If you're trying to click on the Search button on www.google.com, you're SOL.
Survey says... maybe. If you've done your homework, you will probably be able to get communication to happen within the same subdomain. It gets progressively more difficult from there -- I've never had consistent cross-browser sub-domain support for manipulating JavaScript between two windows (or iframes).
That said, if they are the same domain, it is a matter of descending into it. If I have:
Window A opens Window B
Window B declares var winBVar
Window A is able to access winBVar after, and only after, that variable is declared (as in, you still need to wait for document.onload, etc)
I am developing a webpage which our customers want to insert on their websites by wrapping my page in an iframe (cross domain). I don't need to interact with the parent or know anything about whats outside the iframe.
I am using HTML, CSS, Javascript and Webservices.
Question: How am I limited inside an iframe compared to if my page was running outside the iframe?
You're not. Any JS linked within the iframe from your domain will act in the context of the iframe. Aside from being crammed into an unusual container it should work the same as it would if it was loaded independently.
If your needs should change however, there are ways to send signals between parent frame and iframe if both pages have JS written to cooperate. There's methods using the # in URLs which can be read by the parent and don't force page reloads and I believe they share the window.resize event which can be fired manually without actually resizing the window.
UPDATE: There are far better ways to communicate between cross-domain iframes now than there used to be. Naturally you'll still require cooperating JS on both ends but you can use window.postMessage rather than triggering messages via window.resize and data after a hash symbol in the URL. That was a cool trick though.
When creating links you should have in mind to maybe use the target-attribute of the a-tag if you want to create a link for the parent window. Otherwise the new page would be loaded into the iframe.
I can open a new window using window.open() in ExternalInterface.call() but then I want to be able to write contents to the new window. Since, I cannot get the reference of the window back from window.open() call, I am not able to do anything to the window once it is opened.
Please note: I do not have any control over the HTML in which my swf is displayed.
Has anyone been in this situation before?
Update: After a few hours of trial and error I found you can get out of this situation by storing your window reference globally and referring to the same global reference whenever you need to access the new window.
are you trying to simply present a new webpage from your .swf? if so, external interface is not required. you can simply use navigateToURL:
navigateToURL(new URLRequest("http://www.stackoverflow.com"), "_blank");
however, if you want to make a popup window with a custom size and visibility of the browser toolbar and scrollbars, you can call external interface like this:
if (ExternalInterface.available)
{
ExternalInterface.call(
"window.open",
"http://www.stackoverflow.com",
"win",
"height=200, width=300, toolbar=no, scrollbars=yes"
);
}
It is possible if you store the name of the javascript window reference variable. But, you might want to consider the fact that if you don't have any control over the HTML where the swf is displayed, you can't be sure that the javascript access won't throw a SecurityError based on various security policies laid out by the flash team.
I need to open a popup Window to a cross domain content. I should not allow the user either to access or close the parent window, till i am done with Child window.
The main issue with Modal window is that stops any asynchrnous process running on the main window. For example, timers and auto refresh wont be working in the parent window.
Is there any perfect way to do the above said.
Thanks in advance
How about instead of popping up an actual window, you just open a pseudo-window...that is a div with some borders, make it draggable if you want, and place a large semi-transparent div that covers the rest of the page and blocks it from being clicked on. Basically do something like how Lightbox works
You could use a fake window built via javascript. Several widget libraries have support for this. For example, see ExtJS, which also supports modal windows but it might be overkill for your application. For jQuery, browse through the plugins, like this one
I think Telerik has a control for this if you are working on ASP.Net. Uses a div in its implementation as #Davr suggested. Modal windows are a bad option anyhow as they are not supported on all browsers.
In addition to what Davr and thoriann said, you will likely need to make an Ajax call to grab the content. Since Ajax calls via the browser enforce the same-domain policy, you will need to make an Ajax call to your OWN server, which in-turn will need to make an xmlhttp sever-to-server request to grab the content the third-party server.
I feel the above answers wont fit for the following reasons..
JasonS Solution - The application is developed on J2EE technologies.
Other's solution - Some of the the URL Launched in the child window will communicate to the parent window through standard APIs. If i am using div or other in-built plug-in windows, then those javascript API will fail.
Check out the Jquery plug in "BlockUI". When BlockUI is called the parent window is not accessable. You can do what you want on the modal then call "UnblockUI" to close the popup and give parent control again.
Pete