How can I reload an iframe inside iframe with JavaScript? - javascript

I have a domain,
example.com
Iframe's source is,
server1.example1.com
The problem is, I would like to refresh the iframe with JavaScript inside my iframe, when I location.reload() the page, Iframe loads empty and this only happens in chrome, How can I fix this?

perhaps try this:
// Reload the current page, without using the cache
document.location.reload(true);
source: https://developer.mozilla.org/en-US/docs/Web/API/Location.reload
I know Chrome does some pretty clever things with its cache, so maybe that will help.

right click and reload frame, seriousle:
If the iframe was not on a different domain, you could do something like this:
document.getElementById(FrameID).contentDocument.location.reload(true);
But since the iframe is on a different domain, you will be denied access to the iframe's contentDocument property by the same-origin policy.
But you can hackishly force the cross-domain iframe to reload if your code is running on the iframe's parent page, by setting it's src attribute to itself. Like this:
// hackishly force iframe to reload
var iframe = document.getElementById(FrameId);
iframe.src = iframe.src;
If you are trying to reload the iframe from another iframe, you are out of luck, that is not possible.

Related

Hijack top level redirection from within iframe to iframe redirection instead

I have an integration problem where, from within an iframe, an application I do not own executes a top level redirection on my page.
I would like to stop this redirection and make it happen in the iframe instead, possibly by changing the iframe property src.
Would you know a way to do that?
I have read about sandbox iframe property which prevents redirection but it is not quite what I need.
Thanks in advance.

How to set focus on an iframe that is cross-domain

Similar to the posts below:
Set focus on iframe in Chrome
Setting focus to iframe contents
From the root/parent I want to be able to pass focus to the iframe.
Anything that may be in focus in the iframe is fine.
iframe.contentWindow.focus();
However, the iframe.contentWindow is not accessible because its a cross-origin frame.
Seems like the answer is: not possible.
If there is a script running in the iframe you can directly call focus from there.

Change element style on a image inside a iframe

Is there a way to change the element-style of the img inside the iframe using jquery. The iframe epubjs-iframe change the id on every page load. What I want is to change the style = heigh="98%" to max-height:467 and width:auto on every page load.
Html-code
Yes, IF the src of your iframe is pointing to SAME domain.
Eg.
var iframe = $("#iframe"); // Selector to get the iframe
$("#elemInIframe", iframe.contents()).css("color", "blue"); //Or whatever method you want
And Of course, if the src of iframe is in different domain, due to security reasons, You will not be able to access the contents in javascript. Sorry about the same!!
Not know if it is the case here, but when working with iframes You may need to overcome Same Origin Policy: https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy
You can use PostMessage for cross-frame communication. To do so:
You need to be in control of the code both host page and embedded one
Or use the PostMessage API provided by page You want to embed
More about PostMessage: https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

Complete isolation of javascript in the iframe from the same domain

Assume we have a window and an iframe with some javascript in it. The iframe sourcecode is defined directly in "srcdoc" attribute of the iframe.
Is it possible to somehow force the browser to behave like the iframe is loaded from another domain?
I mean I don't want the javascript in the iframe to be able to access the main window via "window.parent" or anything like that, because the iframe contents is not trusted. But the problem is that it's stored on the same domain and I even want to use the same request to load both the main window and the iframe contents (with that "srcdoc" attribute).
So is it possible at all?
Thanks!
You could prepend the string:
"<script> parent = top = null; </script>"
To the srcdoc. That should prevent the rest of the code in the srcdoc form accessing the parent through window.parent and window.top.
I'm not sure if there are any other ways to access the parent of an iframe.

javascript let iframe become parent

i have one iframe on my page which has a different domain to that of my site. i know i can't access anything inside the iframe from the parent window, but can i make that iframe take over my entire page - ie redirect the parent to the url of the iframe?
so far i have tried things like
window.location.href = iframe.contentWindow.location.href;
but the browser won't allow that - i guess it isn't smart enough to realise that the = assignment is for the purposes of redirecting and not storage for later inspection.
is there another way of doing this on all modern browsers?
How about:
window.location = iframe.src;
Why don't you try with the iframe src attributes?
with jquery:
window.location.href = $('#iframeid').attr('src');
or:
window.location.href = document.getElementById('#iframeid').src;

Categories