Getting iframes source? - javascript

I have an iframe on my website that displays different site.
Is it possible to grab & store/save source of the iframed site?

The same-origin policy in the browser will prevent you from accessing the internal content of a div loaded from another domain.

You can always just $iframeSource = file_get_contents("http://iframe-source-url/"); it.

Related

Take screenshot of a page containing an iframe

We have a nodeJS/angular 4 website which is displaying an iframe from a third party (powerBI Emebdded). We are trying to get develop a feature allowing the end user to take a screenshot of the page including the content of the iframe.
We tried the iframe2image library:
https://github.com/twolfson/iframe2image
But we are facing the issue of the same origin policy:
ERROR DOMException: Blocked a frame with origin http://localhost:4200
from accessing a cross-origin frame
As we have no access to the iframe (it's a third party content generated by PowerBI iframe with a dedicated library).
We can not bypass the policy by setting the window.document.domain in the iframe to the same domain.
Do you have a solution to suggest us?
I think this is absolutely not possible, because there is no way to access the elements of the iframe's document.
But access to this elements is necessary because all libraries which are rendering html to any form of image need to resolve the Elements inside the document to get the visuals out of it.
In Firefox, you can use the .getScreenshot method of the iframe element to get a screenshot of it's contents. See the documentation:
https://developer.mozilla.org/en-US/docs/Web/API/HTMLIFrameElement/getScreenshot
This only works in Firefox, and only in chrome code, not on the web page itself.

Responsive Iframe height cross-domain without having control of source page

I'm developing a responsive website that will have some iframes, in the iframes I'll load content from other domain which I can't edit it.
So, it is possible somehow, to get the content height? From another domain and without access to source page.
You can't access any content inside an iframe when loading a page from another domain.
It's possible to do cross domain AJAX requests with CORS or JSONP but then you need to have access to the embedded websites. Possibly you could try YQL to get the content. Mirroring on your own server would do the job. Otherwise you will hit SOP.

Same Origin Policy and Facebook

Now I know there are a lot of resources about same origin policy, but I just want a straight up answer for my specific query as I am really struggling to understand.
I am using Facebook plugins on my website, these create iframes that are only visible in the DOM when I use chromes inspect element etc.
Is there a way that I can access these iFrames properties/attributes at all, or is it a resounding "NO CHANCE!". I am spending far too much time on this and I just need to get a final verdict.
Thanks!
Javascript doesn't see the iframe content. Chrome inspector just loads 2 different websites in the same time, yours and the plugins one, so you can play with both of them.
Just curious, how would you like to change it?
In general, JavaScript cannot access iframe content from outside of the iframe, unless the page domain and the iframe domain share the same protocol and host and port. In your case, this could possibly be done using a proxy server to load the iframe content from your domain.
http://en.wikipedia.org/wiki/Same_origin_policy

Understanding Cross-Domain issue in Iframes

This question might seem silly but I need to understand this for clarity.
According to my understanding, cross-domain problem is when the domain of the webpage which contains the IFRAME is different from the domain of the web-page opened in IFRAME.
Going by that logic, nothing should open in IFRAME ever.
When I embed a web-page "bottom:10700" in the IFRAME of my web-page "top:9700", it gives error.I am not able to see the contents in IFRAME. Error is Access denied in accessing property 'constructor'
I am getting the error while accessing the contructor (_1.contructor)
isc.A.Function=function isc_isA_Function(_1){
if(_1==null) return false;
if(isc.Browser.isIE&&typeof _1==this.$a7) return true;
var _2=_1.constructor;
if(_2&&_2.$k!=null){
if(_2.$k!=1)return false;
if(_2===Function)return true
}
This script is run when home page of bottom is opened in an iframe contained in top.
Is there any way, I can make this work. I mean can I set both the domains to be same. I don't have access to remote site's script.
Is resizing the frame after redering it once a cross-domain scenario. If not, then certainly remote site is trying to access the IFRAME element..How can I debug this??
Cross-domain issues are about the communication between iframes. You can always embed any iframe but, if domains differ, iframes cannot interact with each other e.g. execute JS, modify DOM etc.
HTML5 provides a sandbox property that re-enables particular features of the cross-domain iframe interaction. Be careful, it can be dangerous.
It is normal behavior for a page xyz.com to load in an iframe hosted on abc.com. However, you cannot change anything or access its content via code from parent abc.com.
Hope this helped.

Javascript iFrame Limitations

I know that, for security reasons, javascript can't read the contents of an iframe if it belongs to a different domain. This makes sense, given that the entire page could be an iframe with snooping scripts outside of the frame.
The question is - are there equal limitations in the other direction? Can javascript within an iframe (from a different domain) read and manipulate the dom in its parent window?
Thanks!
You can't.
This would be a security hole. Now that everyone is crazy adding facebook iframes to their sites, imagine if javascript from FB could interact with your page ;)
Anyway, i set up a small example, and got the same origin warning when i tried to get a parent's div from inside the iframe (which was in another domain)
If you want to use this in a two domains that you own (not trying to attack anyone) you can do that using ajax as described Here.

Categories