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.
Related
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
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.
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.
I have an iframe loaded inside a parent page - the iframe and parent page are on different domains.
Can my iframed site detect the actual browser dimensions?
You can use the web API window.postMessage method too. It safely enables cross origin communication.
https://developer.mozilla.org/en-US/docs/Web/API/Window.postMessage
The simple answer, is no. It cannot. Unless by some means the parent window can dynamically send data to the object inside the iframe...
However if the content inside the iframe was all made in %'s so that it would scale nicely (similar to a fluid web page layout), this could help?
What is it that you are directly trying to achive?
I ended up using the excellent postMessage plugin from Ben Alman
http://benalman.com/projects/jquery-postmessage-plugin/
this allows for cross domain communication where you have control over both domains.
We are using Buto to host our videos and showing them in a lightbox (FancyBox) on our site via a floating IFrame.
Problem is that the videos are of different heights and widths, and we don't know these dimensions in the simple html pages (no server-side code) that link to the videos, so whatever dimensions we choose for the IFrame are going to be wrong for some of the videos.
I'd like to have some javascript that runs after the Video has loaded and resizes the IFrame to neatly fit around the video.
Is this even possible, given that the Iframe is hosting content from another domain? Can anyone recommend an alternative?
Thanks!
Because of the Same Origin Policy you can't access iframe's content if domain, port and protocol don't match with the hosting page ones.
You should use a proxy page (here an example), or accessing Buto via API (no JSONP, unfortunately), but you need to run some server-side code for that...