IE passes an empty event object with PostMessage

Question

All versions of IE do this. And all other browser work properly..

My code :

window.addEventListener("message", receiveMessage, false);

Which passes to :

  function receiveMessage(event) {
     console.log ( JSON.stringify( event ) ) ;

Which, in IE, returns as : {}

I postMessage with this :

var message = { 'origin' : window.location.origin };
var url     = 'https://mywebsite.html';
frames[$(".fancybox-iframe").attr('name')].postMessage(message, url);

Again, this works just fine in any other browser. Information passes perfectly. And as far as I can remember, this used to work ok in IE.

What versions of IE are you testing? From what I have read only IE11 supports postMessage while IE8, IE9 and IE10 supports different parts. http://stackoverflow.com/questions/16226924/is-cross-origin-postmessage-broken-in-ie10 — Mathias, Mar 12 '14 at 17:56

jfriend00 · Accepted Answer · 2014-03-12T18:00:24.960

IE does not implement window.location.origin. And JSON.stringify() is apparently ignoring properties whose value is undefined (which its MDN documentation says it will do).

Run this jsFiddle in IE to see: http://jsfiddle.net/jfriend00/MP68r/

You can work around the issue by using other properties of window.location depending upon exactly what you want to do with that info.

You could use this as an alternative:

location.href.match(/(^.*?\/\/.*?)[\/$]/)[1].toLowerCase();

This will return the part before the first slash in the path which is basically what the origin is. It is converted to lower case since domain names and protocols are case insensitive so this makes for a canonical comparison.

Wow huge thanks jfriend00. I'm pretty sure you not only nailed this on the head. Thank you thank you thank you. — Trip, Mar 12 '14 at 18:01

IE passes an empty event object with PostMessage

1 Answers1