html - dojo 1.8 集成html5 postmessage

Question

我试图让一些 html5 发布消息与 dojo 1.8 一起使用，我创建了一个 jsfiddle 来尝试更好地解释它。需要注意的一件事是按钮正在 iframe 中加载。所以基本上，如果在 iframe 中发生点击，那么父节点应该接收并处理该消息。任何指针将不胜感激。

http://jsfiddle.net/AvPFv/

Answer 1

基本上，您应该message在 iframe 窗口上收听，即iframe.contentWindow. 另外，请注意dojo您的 iframe 中没有。

我创建了一个 jsFiddle 来展示它是如何工作的：http: //jsfiddle.net/phusick/H7Zh8/但恐怕将所有内容都放在一个文件中会非常混乱，即在父窗口的上下文中，因为它没有正确解释window参考指向的位置，也没有模拟真实世界的使用。我建议您在具有两组脚本的 localhost 上尝试它，一组用于父窗口，一组用于 iframe。

require([
    "dojo/dom",
    "dojo/on",
    "dojo/date/locale",
    "dojo/domReady!"        
], function(
    dom,
    on,
    locale    
) {

    var buttonNode = dom.byId("postMessageButton");
    var iframeNode = dom.byId("iframe");
    var iframe = iframeNode.contentWindow;
    var iframeButtonNode = iframe.document.getElementById("postMessageButton");

    on(buttonNode, "click", function() {
        iframe.postMessage("hello from parent", "*");       
    });

    on(iframe, "message", function(event) {
        var msgNode = iframe.document.getElementById("msg");
        msgNode.innerHTML += formatMessage(event);
        event.source.postMessage("echo from iframe", "*");
    });

    on(iframeButtonNode, "click", function() {
        iframe.parent.postMessage("hello from iframe", "*");
    })

    on(window, "message", function(event) {
        dom.byId("msg").innerHTML += formatMessage(event);
    });


    function formatMessage(event) {
        var time = locale.format(new Date(event.timeStamp),{
            selector: "time",
            formatLength: "medium"
        });
        return time + ": " + event.data + "<br>";
    }

});