I have a site which embeds a survey from a different domain inside an iframe. However, in some browsers when third party cookies are disabled the iframe predictably is blank.
If the iframe does not load content I wish to show just a link instead of the iframe window itself, with javascript. So far I have
<iframe id="iframe" onload='setFrameLoaded();' width="600" height="500" src="about:blank"></iframe>
and the script
var frame_loaded = 0;
function setFrameLoaded() {
frame_loaded = 1;
}
But when I change the source to about:blank the iframe still loads okay (again, probably expected behaviour).
Can I check whether the iframe has content loaded (despite it being from a different domain)?
Related
I'm trying to embed https://ncase.me/remember/sims/ebbinghaus/?mode=0 onto a page using an iframe. However, when I do, it does not display any of the interactive elements. See https://codepen.io/UYasher/pen/yLXaPeo for the behavior in an iframe:
<iframe
style="width: 600px; height:370px;"
will_source="https://ncase.me/remember/sims/ebbinghaus/?mode=0"
scrolling="no"
class="simulation"
src="https://ncase.me/remember/sims/ebbinghaus/?mode=0"
>
</iframe>
How can I fix this issue so that the iframe shows all the elements present on the original page?
What I think is causing the issue:
I think this occurs because the iframe is unable to load the scripts at the bottom of ncase.me page. I don't understand why this is, though, as javascript appears to work in some iframes. For example, in order for google maps to run, scripts in the contents of the iframe need to be loaded and run.
There are loads of similar posts on this topic, but I tried all and none worked for what I'd like to do.
I've got an iframe which leads other pages on my domain.
<iframe src="test/index.html" frameborder="0" width="100%" height="100%" id="iframe" name="iframe"></iframe>
Note: I can't change the code of the pages inside the iframe.
Using jQuery, I'd like to open all links of 'text/index.html' in a new tab. How can I do that?
Thank you!
You can invoke a function in the iframe like this:
document.getElementById('targetFrame').contentWindow.targetFunction();
Now, you can do something like this:
var iframe = document.getElementById('iframe');
var links = (iframe.contentDocument || iframe.contentWindow.document).getElementsByTagName('a');
and then you can iterate the links and open them in new tabs/windows, using window.open. Some browsers will not allow you to do this due to security constraint. Now, if the iframe has some messaging with other windows, then you might want to read this article: https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
Finally, if none of these are available, you can just simply send a request to the page which is displayed in the iframe and when you receive the HTML, parse it, find the links and open them using window.open.
I am trying to make html page that contain ads that prompt messages and dialoges like image below that makes redirects and loss original page and loss users
Example of dialoge
I want to stop any prompts or any dialoges on this page
My code is very simple html page with iframe
<iframe src="https://go.pub2srv.com/afu.php?id=1326365" height="500" width="900"></iframe>
Thanks
You could prevent the iframe from running Javascript by adding a sandbox attribute to the <iframe> element. Here's how it may look:
<iframe src="https://go.pub2srv.com/afu.php?id=1326365" height="500" width="900" sandbox=""></iframe>
You could refer to this page to understand how that works: https://www.w3schools.com/tags/att_iframe_sandbox.asp
Of course, this is the perfect solution because the iframe might require some privileges, in such case you could add specific privileges that the particular ad requires.
I've got an iframe that people can navigate through to get to a specific place, but as it is cross-domain some of the javascript on the site doesn't work (Such as looking at product history for example...)
I've been trying to find a way to make a button that will take whatever page the user is on in the iframe and open that link in a new tab.
While trying to research if this was possible, all I could find is people opening links from within an iframe in a new tab, which is not what I need.
I need to make a button that onclick will open a new tab with whatever link the user is currently on in the iframe.
I haven't really tried many things because I cannot find anything on the subject (Probably due to terrible wording), but I'm thinking my best chance is jquery/javascript, however, I'm not very fluent in javascript.
So my question is, is it possible to open an iframes url into a new tab, and if so, what would be the most efficient way to do so?
The website that is in my iframe is cross-domain and I cannot edit its source.
What I currently have is this:
<iframe id="iframe" class="frame" name="iframe" height="100%" width="100%" onload="refreshLink(this.contentWindow.location.href)"></iframe>
Note: The src is set by javascript on page load.
Under that I have:
<script>
var hyperLink = document.getElementById("iframe").src;
function refreshLink(link) {
hyperLink = link;
document.getElementById("button").href=hyperLink;
}
</script>
Above all of that I have:
Open in R1
But, when I click the button at any given time it opens a new tab to the same url I was at before (a tab that goes to the same page the iframe is displayed on).
I believe this should be possible
For iframes displaying the same domain content you can get the current site url with something like this:
document.getElementById("myframeID").contentWindow.location.href
But for cross-domain iframes you will get the following error when trying to get the location on the site the same way:
VM2536:2 Uncaught DOMException: Blocked a frame with origin "https://example.com" from accessing a cross-origin frame.
However this seems to work to get proper URL from cross-domain iframes
document.getElementById('myframeID').src
To finish off you could do something like this (assuming you use jQuery by your tags):
$('body').on('click','#button', function(){
var url = document.getElementById('myframeID').src;
var tabOrWindow = window.open(url, '_blank');
tabOrWindow.focus();
});
Here's a starter. With markup like this:
<iframe id="myIframe" src="http://yourwebsite.com"></iframe>
Click here
Start with some JS that changes the anchor's href to the src of your iframe:
var hyperLink = document.getElementById("myIframe").src;
document.getElementById("button").href=hyperLink;
Add an onload attribute to your iframe:
<iframe id="myIframe" src="http://yourwebsite.com" onload="refreshLink(this.contentWindow.location.href)">
</iframe>
The line onload="refreshLink(this.contentWindow.location.href)" fetches the current URL of the iframe where the user's been navigating and sends it as an argument for the function refreshLink.
Then we can declare that function, and the full JS code would look like this:
var hyperLink = document.getElementById("myIframe").src;
function refreshLink(link) {
hyperLink = link;
document.getElementById("button").href=hyperLink;
}
This works, but it's subject to whatever policies each website has regarding iframes and http/https.
I would like to access a form which is in an iframe. The page inside this iframe is from an other domain. However, I am inside phonegap/native (iOS). In a browser I noticed I can only access and manipulate the iframe content if the page is from the same origin. Because in phonegap, things like XSS do not exist, I would expect that I can access an iframe from an other domain.
Anyway, just in case this is possible, here is my code:
<iframe id="iframe" src="http://login.site.com" width="500" height="500"></iframe>
....
var $ifc = $('#iframe').contents() ;
$ifc.find("input[name=username]").val("Bob");
$ifc.find("input[name=password]").val("secret");
$ifc.find("input[type=submit]").click() ;
This also shows what I want to achieve; automatically fill in the login form and submit
Any suggestions ?
Cheers
Iframes don't work very well in Phonegap.
However, accessing the iframe through javascript should be possible.
var iframeDoc = document.getElementById("iframe").document;