IE8 postMessage troubles

Discussion in 'JavaScript' started by grutland, Jul 6, 2014.

0
  1. #1
    Hello,

    I've finally had to break and ask the internet with help on this matter, I really wanted the satisfaction of figuring it out myself but I've spent too long on it now.
    I know this is possible because Facebook do it and easyXDM claim to be able to do it (but it didn't really seem to work).

    I can get postMessage working in IE8 between a page and an iframe on the same page, but I need to get it work across different windows.
    I think iframe's are still the key to getting this working, but I just quite work out how.

    Has anyone managed to get it working, and if so, how?

    I tried to upload the two simple test files, but it's not working, so these are the two files:

    parent.html
    <!DOCTYPE html>
<html>
    <body>
        <script type="text/javascript">
            var child_window, child_window_interval;
            var event_method = window.addEventListener ? 'addEventListener' : 'attachEvent';
            var message_event = event_method === 'attachEvent' ? 'onmessage' : 'message';

            if (event_method === 'attachEvent') {
                window[event_method](message_event, listener, false);
            } else {
                window[event_method](message_event, listener);
            }

            function open_child() {
                var name = 'ChildDialog';
                var specs = 'width=500,height=500,location=no,resizable=no,scrollbars=yes,status=no,titlebar=no,toolbar=no';

                child_window = window.open('child.html', name, specs);
                child_window_interval = setInterval(check_close, 100);

                document.getElementById('response').innerHTML = '';
            }

            function check_close() {
                if (child_window.closed) {
                    listener({
                        data: {
                            cancelled: true
                        }
                    });
                }
            }

            function listener(e) {
                if (!e.data.cancelled && e.origin !== location.protocol + '//' + location.host) return;
                document.getElementById('response').innerHTML = JSON.stringify(e.data);
                clearInterval(child_window_interval);
            }
        </script>

        <button type="button" onclick="open_child();">Open</button>

        <div id="response"></div>
    </body>
</html>
    Code (markup):
    child.html
    <!DOCTYPE html>
<html>
    <body>
        <script type="text/javascript">
            window.opener.postMessage({
                key1: 'test 1',
                key2: 'test 2'
            }, location.protocol + '//' + location.host);

            window.close();
        </script>
    </body>
</html>
    Code (markup):
    Thanks.
     
    grutland, Jul 6, 2014 IP
  2. youheardit

    youheardit Greenhorn

    Messages:
    2
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    13
    #2
    Can't you see any error messages in your browser console?
     
    youheardit, Jul 10, 2014 IP
  3. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #3
    With AJAX in the mix, why are you even opening new windows, much less trying to pass values back and forth betwixt them? I mean if it's all just scripttardery anyways, make a DIV and make it behave LIKE a window -- that way you aren't trying to dance around the various cross-site exploit blocks browser makers have been putting in place the past decade.

    Which is why even if you get that mess working in IE8, it probably won't work in anything newer!
     
    deathshadow, Jul 17, 2014 IP