I have a page with button and IFRAME. Inside IFRAME, I am loading a PDF file dynamically which is coming from different domain.
when I try to print file using the button action I am getting the following error.
Uncaught SecurityError: Blocked a frame with origin "http://localhost:8080" from accessing a frame with origin "http://www.cplusplus.com". Protocols, domains, and ports must match.
If I load the pdf file from my local system I am to print it .
I used the below code to print the iframe Pdf
var iframe = document.querySelector("#unofficialtranscript");
iframe.focus();
iframe.contentWindow.print();
Any idea how I can print the file which is loaded into the iframe which is on another domain .
I think you would need to have a look at the same origin policy.Javascript only calls a window or an iframe only if the policy is accepted.
You may need to use Postmessage API instead.
Please have a look here.
If both the parent DOM and child DOM (i.e., iframe) are from same domain then it will work fine.
If not, then use libraries like Porthole for cross-communication between different domains.
Demo site: http://sandbox.ternarylabs.com/porthole/
Note: You should have access to both the domains being used in your code.
Related
I am using iframes to serve content that I want people to be able to embed on their own sites. I am also embedding these iframes on my own site (mysite.com in the code below).
I am using the following javascript function
function addLogo() {
if (window.top.location.host != "mysite.com") {
$("#logo").html('<img src="...mysite.com/logo.png" border="0">');
}
}
to check where the iframe is embedded. If the iframe is embedded anywhere other than the my site, jquery is used to add a small logo / back-link to the frame.
The main site is hosted on a shared server and the embedded html and js files are in an Amazon S3 bucket. Having the js file check on the location of the parent window is causing security errors in both Firefox and Chrome
Firefox:
Error: Permission denied to access property 'host'
Chrome:
Uncaught SecurityError: Blocked a frame with origin
"...amazon.s3Bucket" from accessing a frame with origin
"...mysite.com". Protocols, domains, and ports must match.
Is there a way to use js to conditionally add the logo based on top.host without causing these errors or creating security problems?
I am hoping to stick with js so that I can serve the iframe content (html and js) from Amazon S3
I have one page say display.aspx that is being used in other sites in Iframe. In display.aspx page, I have one button which opens Facebook popup for sharing. After successful share it gives me response in one page in my site say FBResponse.aspx. From FBResponse.aspx,I want to reload the display.aspx page.
I have tried 1) window.opener.history.go(0);
2) window.opener.location.reload(false);
3) opener.location.reload(false);
But none of these working for me.
Moreover, I have made one function in display.aspx page, in that function I have written code to reload the page. I tried to call this function from FBResponse.aspx ,but in Chrome I am getting error The frame requesting access has a protocol of 'https', the frame being accessed has a protocol of 'http'. Protocols must match and in FF I am getting error Permission denied to access property in IFRAME. Actually my site is working on https where as the sites which are using my page display.aspx might be using http protocol.
Any solution?
Thanks,
Priya
Hey Try This one.
<form onsubmit="window.top.location.href = 'http://www.wesite.com/test.html';">
Be attention iframe and top must be on same domain and don't break same origin policy.
Hope it would helps you.
You can't unless both page and iframe have same domain (and in this case you can make protocols to match). Same origin policy can be a biatch.
I have this error while running a html file in Chrome:
iframe Unsafe JavaScript attempt to access frame with URL http://my_server.com/param from frame with URL http://another_server/example.html. Domains, protocols and ports must match.
Is there a way so I can run the Javascript in different server?
You need to change the hash not the url itself. There are many similar questions in stackoverflow regarding this issue. You can try check this out.
I'm trying to get an IFrame inner HTML using below code.
<iframe src="http://www.msn.com"
width="100%" height="100%" marginwidth="0"
scrolling="no" frameborder="0" id="divInfo"
onreadystatechange="MyFunction(this);"></iframe>
JavaScript code is
function MyFunction(frameObj)
{
if (frameObj.readyState == "complete")
{
alert(frameObj.document.body.innerHTML);
}
}
But the alert shows me the html of current document. How can i get the inner HTML of iframe when the frmae ready state is complete.
If i use alert(frameObj.contentWindow.document.body.innerHTML); it gives me Access is denied error.
Thanks in advance.
Access is denied error is caused by the same origin policy.
Since your page is hosted on http://www.example.com/ (For example), if you try to access details on http://www.msn.com/, the browser won't let you since they are from 2 different domains.
However, if you are trying to access data from the same domain - Hosting page: http://www.example.com/index.html, IFrame's page: http://www.example.com/iframe.html, then you should be able to get the content.
For more information on the Same Origin Policy, here's a link: http://en.wikipedia.org/wiki/Same_origin_policy
BTW, you may want to use frameObject.contentDocument instead
<script type="text/javascript">
function documentIsReady(frameObject) {
alert(frameObject.contentDocument.body.innerHTML);
}
</script>
... and you can also use the onload instead of onreadystatechange...
<iframe src="iframe.html" onload="documentIsReady(this);"></iframe>
You can't read the contents of an <iframe> that has content from a different domain than that of the parent page.
You can only do that if it adheres to the same origin policy (meaning the iframe is at the same server as the parent document).
Anyway, this was answered here :)
As has been said previously, you cannot get the contents of an <iframe> if its source is not from the same origin.
This also applies to most other ways of getting external content, such as using ajax to load source code from another page. ie: $('#div').load('http://www.google.com');
To load external content, the content must comply with the same origin policy.
This means that the content must be on the same protocol and host.
Wikipedia Article Linked Above:
httpː//www.example.com/dir/page2.html --> Success Same protocol and host
httpː//www.example.com/dir2/other.html --> Success Same protocol and host
httpː//username:password#www.example.com/dir2/other.html --> Success Same protocol and host
httpː//www.example.com:81/dir/other.html --> Failure Same protocol and host but different port
https://www.example.com/dir/other.html --> Failure Different protocol
http://en.example.com/dir/other.html --> Failure Different host
http://example.com/dir/other.html --> Failure Different host (exact match required)
http://v2.www.example.com/dir/other.html --> Failure Different host (exact match required)
Simply put, it must be on the same website. So while example.com/hello.html can load content from example.com/goodbye.html, it could not load content from google.com/content.html
Also, it must be on the same domain. Sub domains are considered to VOID the same domain policy so while weebly.com/hello.html can load content from weebly.com/goodbye.html, it could not load content from user1.weebly.com/content.html
There are of course workarounds, as usual, but that's another story all together. Actually, this is quite relevant to the question. So here is a wonderful questions 'thread' on all the ways to bypass it.
HI, i got a simple html page, localy with an iframe. the iframe includes a generated page which got a javascript function. i know want to call that function. of course, im getting "permission denied". so since im new to js and all that stuff i dont know if it's actually possible to do that. give me some hints for searching or a nice solution.
i do cal lthe func like: parent.myiframe.myfunc();
I guess the page in the iframe resides on another server / domain. Modern browser do not allow "cross site scripting", see: http://de.wikipedia.org/wiki/Cross-Site_Scripting
If possible, move the site in the iframe to the same server. An alternative (workaround) would be to proxy the page on the local server, so that that for the client it seems to be loaded from the same domain.
Edit: This is also called a "Same Origin Policy". You can only call java script functions in a document that is:
from the same domain (www.mydomain.com)
from the same subdomain (mail.mydomain.com <- no go!)
both use the same port (p.Ex.
accessing a http://... document from
a http*s*:// document won't work).
There might be another workaround if you have access to the iframe's source:
Change the iframe domain to the same as the outer frame's, by applying:
document.domain = "domain.com";
in the iframe source (see http://ajaxian.com/archives/how-to-make-xmlhttprequest-calls-to-another-server-in-your-domain for more information).
Also there is a Draft for "Cross-Origin Resource Sharing" (http://www.w3.org/TR/cors/) that is already partially implemented in several browser, see: http://www.webdavsystem.com/ajax/programming/cross_origin_requests