Search code examples
javascripthtmlpostmessage

Either postMessage or addEventListener not working


The following JavaScript code uses the HTML5 postMessage / addEventListener functions to send a message to itself:

window.addEventListener('testMsg', function(event) {
   alert('got a message');   /* Never happens. Why? */
}, false );

window.addEventListener('load', function(event) {
   alert('sending message');    
   window.postMessage('testMsg', '*');
}, false);

A corresponding fiddle:

http://jsfiddle.net/ZGvLg/3/

The message is never received. What is the reason?


Solution

  • I have modified the fiddle. You were listening to the wrong event.

    FIDDLE

    Should be

    window.addEventListener('message', function(event) {
        alert('got a message');   /* Never happens. Why? */
    }, false );
    
    window.addEventListener('load', function(event) {
        alert('sending message');    
        window.postMessage('message', '*');
    }, false);