web-dev-qa-db-fra.com

Html5 - Cross Browser Iframe postmessage - enfant à parent?

J'ai suivi ce didacticiel - http://www.youtube.com/watch?v=R2hOvZ7bwX , qui explique comment utiliser postmessage pour transmettre en toute sécurité un message entre iframe et parent. se retrouver avec quelque chose comme ça - http://html5demos.com/postmessage2

Mon problème est que j'ai besoin de travailler dans le sens opposé (enfant à parent) et de ne pas savoir comment cibler la fenêtre parent.

c'est mon code de destinataire (dans le parent) -

function handlingMsg(e)
{alert("works")
    if(e.Origin == "http://uc.dialogue.net")
        {
                var blah = e.data;
                alert(blah);    
        }
        else{alert("error");}
}
addEventListener("message",handlingMsg, true);

et ceci est la fonction d'envoi qui est déclenchée par un formulaire simple (dans l'enfant) -

   var text=$('.srchInput').val();
   window.parent.postMessage(text, "http://uc.dialogue.net");   

Devrais-je cibler le parent d'une manière différente?

Salut Paul

61
Dancer
var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var eventer = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";

// Listen to message from child window
eventer(messageEvent,function(e) {
    var key = e.message ? "message" : "data";
    var data = e[key];
    //run function//
},false);

Le faire fonctionner avec ce qui précède dans la page parent et ce qui suit dans la page enfant -

parent.postMessage("loadMyOrders","*");  //  `*` on any domain         

Code copié de ici .

101
Dancer

Une version moderne et simplifiée de la réponse acceptée (qui supprime le support Legacy ie8 en faveur de la nuance):

window.addEventListener('message',function(e) {
    var key = e.message ? 'message' : 'data';
    var data = e[key];
    //run function//
},false);

S'il te plait regarde:

24