After extensive research it appears that this should work, but in IE8 the letsgo function never gets called... any help?
<script type="text/javascript">
function resizeCrossDomainIframe() {
if (window.addEventListener) {
window.addEventListener('message', letsgo, false);
} else if (window.attachEvent) {
window.attachEvent('onmessage', letsgo);
}
}
function letsgo(event) {
var iframe = document.getElementById('my_iframe');
if (event.origin !== 'http://mysite.com') return; // only accept messages from the specified domain
if (isNaN(event.data)) return; // only accept something which can be parsed as a number
var height = parseInt(event.data) + 32; // add some extra height to avoid scrollbar
iframe.height = height + "px";
}
</script>
<iframe src='http://mysite.com/products/default.aspx?iframe=true&partnerid=222&site=localhost:62014' frameborder="0" width="100%" scrolling="auto" style="min-height: 750px; min-width: 600px; background-color: #fff;" id="my_iframe" onload="resizeCrossDomainIframe();">
</iframe>
Security-Reviewing Uses of postMessage()postMessage is generally considered very secure as long as the programmer is careful to check the origin and source of an arriving message. Acting on a message without verifying its source opens a vector for cross-site scripting attacks.
The postMessage() function is asynchronous, meaning it will return immediately. So you can not do synchronous communication with it. In your example, the posted message will vanish in the void, because there is no listener for the message event at the time the postMessage() function is executed.
postMessage() The window. postMessage() method safely enables cross-origin communication between Window objects; e.g., between a page and a pop-up that it spawned, or between a page and an iframe embedded within it.
postMessage() is used by the application to allow cross-origin communication between different window objects, e.g. between a page and a pop-up that it spawned or between a page and an iframe embedded within it.
I got it, must have been a race condition. I took out the onload.
<script type="text/javascript">
if (window.addEventListener) {
window.addEventListener('message', letsgo, false);
} else if (window.attachEvent) {
window.attachEvent('onmessage', letsgo);
}
function letsgo(event) {
var iframe = document.getElementById('my_iframe');
if (event.origin !== 'http://mysite.com') return; // only accept messages from the specified domain
if (isNaN(event.data)) return; // only accept something which can be parsed as a number
var height = parseInt(event.data) + 32; // add some extra height to avoid scrollbar
iframe.height = height + "px";
}
</script>
<iframe src='http://mysite.com/products/default.aspx?iframe=true&partnerid=222&site=localhost:62014' frameborder="0" width="100%" scrolling="auto" style="min-height: 750px; min-width: 600px; background-color: #fff;" id="my_iframe" >
</iframe>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With