Skip to content

Instantly share code, notes, and snippets.

@m0er m0er/page.js
Last active Dec 10, 2015

Embed
What would you like to do?
cross-domain iframe communication
// Reference
// http://benalman.com/projects/jquery-postmessage-plugin/
// http://softwareas.com/cross-domain-communication-with-iframes
// Related My post
// http://wp.me/p12fxZ-dS
// Wrapper page
var iframeSrc = "http://embedded-website.com/foobar/page.html#" + encodeURIComponent(document.location.href),
$iframe = $("<iframe>").attr("src", iframeSrc).appendTo("#container");
$.receiveMessage(
function(e) {
var urlParams = queryStringToJson(e.data);
var iframeHeight = Number(urlParams.height);
var iframeWidth = Number(urlParams.width);
$iframe.height(iframeHeight).width(iframeWidth);
},
"http://embedded-website.com"
);
function queryStringToJson(queryString) {
var match,
pl = /\+/g, // Regex for replacing addition symbol with a space
search = /([^&=]+)=?([^&]*)/g,
decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
query = queryString,
urlParams = {};
while (match = search.exec(query))
urlParams[decode(match[1])] = decode(match[2]);
return urlParams;
}
// Inner page
var parentUrl = decodeURIComponent( document.location.hash.replace( /^#/, '' ) )
function resize() {
$.postMessage(
{height: 1200, width:900},
parentUrl,
parent
);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.