I have an iframe I'm using to pull in some content hosted by a 3rd party vendor to our website. We are trying to determine the height of that content to adjust the iframe height but I'm getting cross site scripting errors. I wasn't aware that sub-domains count as a cross-site. Is there some way around this without having to keep them on matching sub-domains?
For reference, our weekly marketing is hosted by the 3rd party vendor in flash but with the sub-domain we can redirect to them while keeping the user on our domains for cookie purposes.
From one of your subdomains, you can (with some exceptions) set the domain to allow broader access to other subdomains in the same main domain.
Take a look at this page:
http://www.tomhoppe.com/index.php/2008/03/cross-sub-domain-javascript-ajax-iframe-etc/
Also take a look at cross window messaging
This first page is the sender - it's calling postMessage (sending the textual message) and also holds the iframe within which the receiving window is held.
<iframe src="http://dev.jquery.com/~john/message/" id="iframe"></iframe>
<form id="form">
<input type="text" id="msg" value="Message to send"/>
<input type="submit"/>
</form>
<script>
window.onload = function(){
var win = document.getElementById("iframe").contentWindow;
document.getElementById("form").onsubmit = function(e){
win.postMessage( document.getElementById("msg").value );
e.preventDefault();
};
};
</script>
The follow page is the receiver - it has an event listener bound which watches for messages being passed to it and injects them in to the DOM.
<b>This iframe is located on dev.jquery.com</b>
<div id="test">Send me a message!</div>
<script>
document.addEventListener("message", function(e){
document.getElementById("test").textContent =
e.domain + " said: " + e.data;
}, false);
</script>