I would like to access a child iframe (iframe2) from a site having a URL suppose "http://example.com" . I have this HTML format,
<html>
<body>
<iframe id="iframe1" src="https://example.com">
<iframe id="iframe2" src="https://example.com/page1">
</iframe>
</iframe>
</body>
</html>
But i am facing an error in the form of exception
"Permission denied to access property XXXXXX"
When I used iframe.contentWindow.document.
I would like to access the content of iframe2. I am facing this problem in Firefox, I fixed this issue in Google Chrome using window.history.pushstate, which is a HTML5 API. But somehow the same code is not working in Firefox
I tried a lot many things but still not got any lead on it. Please help !! Thanks in Advance :)
Related
I have a iframe, where I try hide one div element (frame with facebook).
<script type="text/javascript">
function changeCSS(){
frame = document.getElementById("radar");
frame.contentWindow.document.getElementById("div_facebook").style.display='none';
}
</script>
<iframe name="radar"
onload="javascript:changeCSS()"
id="radar"
width="650"
height="450"
frameborder="0"
scrolling="no"
src="http://radar.bourky.cz/index.php?lat=49.9847&lon=16.6241&zoom=8&map=0&repeat=3&last=4&r_opa=30&l_opa=10&l_type=0&cell=0&anim=1&c1=0&c2=0&c3=0&c4=0&c5=0">
</iframe>
And here is problem from console in chrome:
index.html:85 Uncaught DOMException: Blocked a frame with origin "null" from accessing a cross-origin frame.
at changeCSS (file:///D:/jirka/Desktop/kalend%C3%A1%C5%99/index.html:85:21)
at HTMLIFrameElement.onload (file:///D:/jirka/Desktop/kalend%C3%A1%C5%99/index.html:96:170)
I have read many instructions, but problem weren't solved.
If anyone could help I'd be very much appreciated.
The problem is you can't modify the contents of an iframe unless the domain of both the main page and the iframe are the same.
I'm guessing from what you pasted that they aren't the same, since it looks like the outer is being run locally and the iframe is from a domain (radar.bourky.cz).
You won't be able to manipulate it with JavaScript from the outside. That's a security precaution to prevent malevolent actors from doing bad things with websites. You won't be able to get around it unless you control the code both inside and outside.
I'm attempting to embed a facebook post onto a website. I took Facebook's most basic example and plugged it into the html. On the page I see a big empty space, but no embed post. If I visit Chrome or Safari this looks perfectly fine. I'm using Firefox 47. What's interesting is that in Firefox when I visit the iframe tag I see the following generated html.
Generated html for embedded post:
<iframe style="border: none; overflow: hidden;" src="https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2F20531316728%2Fposts%2F10154009990506729%2F&width=500&show_text=true&height=290&appId" width="500" height="290" frameborder="0" scrolling="no">
</iframe>
Code inside iframe:
<html>
<head></head>
<body></body>
</html>
What's wrong and how do I fix this?
I downloaded Firefox 47.0 for Mac and tested your code. It opens here!
Attached is a screenshot. Sorry, this is no answer, but I cannot attach an image in a comment. So chose to answer.Screenshot on Firefox 47.0
I am using google docs viewer for show my uploaded document and i want to print it, but i can't print those document using jQuery.
I want to print iframe document but it is not by my code. how to print that document??
<button id="printbtn" onclick="myFunction()">Print</button>
<iframe src="http://docs.google.com/viewer?url=<?php echo urlencode(UPLOAD_URL.$file_name); ?>&embedded=true" frameborder="0" scrolling="no" id="iframe" style="border: none;" width="800" height="470"></iframe>
<script>
function myFunction(){
window.frames["iframe"].focus();
window.frames["iframe"].print(); // NOT WORKING
}
</script>
Please help me......
I did some digging, found its not possible,
because docs.google is going to be a different domain from yours.
I tried this,
document.querySelector('iframe').contentWindow.print()
and got 'Blocked a frame with origin "http://mydomain" from accessing a cross-origin frame.'.
Lets say, even if google allowed cross domain, the print function wont work. because google docs viewer opens another window for printing.
I've reached a conclusion that google devs have smartly made this not possible.
I'm trying to display Facebook page in an simple HTML page which only contains an iframe.
Here's my HTML code:
<html>
<body>
<iframe src="http://www.facebook.com"></iframe>
</body>
</html>
I'm always getting this error in Google Chrome's console:
Refused to display 'http://www.facebook.com/' in a frame because it
set 'X-Frame-Options' to 'DENY'.
BTW, I'm having this problem also with these iframes:
<iframe src="https://mail.google.com/mail/mu/mp/any"></iframe>
<iframe src="http://m.facebook.com"></iframe>
<iframe src="http://m.youtube.com"></iframe>
<iframe src="http://m.dropbox.com"></iframe>
<iframe src="http://m.yahoo.com"></iframe>
<iframe src="http://www.google.com"></iframe>
<iframe src="http://mail.google.com"></iframe>
<iframe src="http://www.facebook.com"></iframe>
<iframe src="http://www.youtube.com"></iframe>
<iframe src="http://www.dropbox.com"></iframe>
<iframe src="http://www.yahoo.com"></iframe>
Meanwhile, this iframe is working well !
<iframe src="http://www.google.com/custom"></iframe>
How to solve this ?
EDIT based on comments: Is there an alternative of using iframe if this is unsolvable ? Something like browser tag in XUL ? I already tried browser tag in Firefox extension and it works well, but I'm now coding a chrome extension, so I cannot depend on XUL anymore ?
Yes, you could
use server-side includes, to fetch it from the server and include it in an iframe
use a custom browser which does not recognize that header
complicated: use websockets to create your own Javascript HTTP client, fetch the page, and insert it into the DOM
For those who are interested, this cannot be done !
I was hoping that someone can help me, I am trying to get the URL of a page in a iframe:
<script language="JavaScript">
function myLocation() {
alert(document.all.myFrame.contentWindow.location);
}
</script>
<button onclick="myLocation();">Location of Frame</button>
<iframe src="http://www.google.com" width="800" height="600" frameborder="0"
scrolling="auto" name="myFrame"></iframe>
This basically will give me the location of the iframe in my page, but does not give me the google.com url - it is also important to give me the url of everypage that I may open from the google results, so when I am on google.com it should give me the google.com url and if I browse to www.facebook.com it should give me the facebook url...
Any ideas welcome! Thanks
The same origin policy prevents accessing details (including the current URI) of documents on other domains.
If you want to work around this, you will either need to use something other than a web page (such as a standalone application or browser extension) or proxy all requests through your own server.
you may want to use some sort of javascript library, but i've tried this code on deviantart.com using raw javascript code:
document.getElementsByTagName('iframe')[0].src and it gave me the result i was expecting.