$("iframe").each(function(i, e) {
console.log("Monitoring messages sent to: iframe(" + i + ")#" + $(this).attr("id"));
monitorEvents(this.contentWindow, "message");
// Send a test message to this iframe
this.contentWindow.postMessage("Hi iframe - " + i, "*");
});
console.log("Monitoring messages sent to window");
monitorEvents(window, "message");
// Send a test message to the window
window.postMessage("Hi window", "*");
(function($) {
var $window = $(window);
$window.add("iframe").on("message", function(e) {
console.log("Received messsage from " + e.originalEvent.origin + ", data = " + e.originalEvent.data);
});
})(jQuery);
Firebug (as of 1.11 beta 1) supports this with monitorEvents(). You can do something like this:
$("iframe").each(function(i, e) {
console.log("Monitoring messages sent to: iframe(" + i + ")#" + $(this).attr("id"));
monitorEvents(this.contentWindow, "message");
// Send a test message to this iframe
this.contentWindow.postMessage("Hi iframe - " + i, "*");
});
console.log("Monitoring messages sent to window");
monitorEvents(window, "message");
// Send a test message to the window
window.postMessage("Hi window", "*");
EDIT:Also works in Chrome, though when I tried the above code I encountered a security error that the document.domain values were not the same, so the behavior of these two implementations may be slightly different.
UPDATE: I have submitted a feature request to the Chrome team asking that postMessage events appear in the timeline. Also, I found an extension called JScript Tricks that can inject arbitrary JavaScript code into a page when it is loaded. You can add the following code to it to monitor events once the page loads. It works pretty well, though it might miss events that occur immediately (e.g. before onload, if that's possible).
(function($) {
var $window = $(window);
$window.add("iframe").on("message", function(e) {
console.log("Received messsage from " + e.originalEvent.origin + ", data = " + e.originalEvent.data);
});
})(jQuery);
发布评论
评论（2）
Firebug （自 1.11 beta 1 起）通过
monitorEvents()支持此功能。你可以这样做：（@Pierre：感谢您提到功能请求)
编辑： 也适用于 Chrome ，尽管当我尝试上面的代码时，我遇到了一个安全错误，即
document.domain值不相同，因此这两个实现的行为可能略有不同。更新：我已提交了功能请求 向 Chrome 团队请求 postMessage 事件出现在时间线中。另外，我还发现了一个名为 JScript Tricks 的扩展，它可以注入任意 JavaScript 代码加载时进入页面。您可以向其中添加以下代码以在页面加载后监视事件。它工作得很好，尽管它可能会错过立即发生的事件（例如，在加载之前，如果可能的话）。
Firebug (as of 1.11 beta 1) supports this with
monitorEvents(). You can do something like this:(@Pierre: thanks for mentioning that feature request)
EDIT: Also works in Chrome, though when I tried the above code I encountered a security error that the
document.domainvalues were not the same, so the behavior of these two implementations may be slightly different.UPDATE: I have submitted a feature request to the Chrome team asking that postMessage events appear in the timeline. Also, I found an extension called JScript Tricks that can inject arbitrary JavaScript code into a page when it is loaded. You can add the following code to it to monitor events once the page loads. It works pretty well, though it might miss events that occur immediately (e.g. before onload, if that's possible).
已发出 Firebug 功能请求。
A firebug feature-request has been issued.