Javascript iFrame之间的双向通信

我完全了解将消息发送到另一个iframe的

window.postMessage

方法，但我希望从接收窗口检索消息已成功接收的答案。我希望它更像一个AJAX调用，有成功和失败的回调，类似这样：

window.postMessage(myMessage)
      .success(mySuccessCallback)
      .failure(myFailureCallback);

我很清楚，如果两个iframe都在同一个域中，我可以直接访问它们，但这不是异步的，也不包括iframe不在同一个域中的情况

---

那么，这是否可行呢？

postMessage

就是开火然后忘记。如果您想知道是否收到了该消息，则其他文档需要将其自己的消息发回

i、 e

页面A向页面B发送消息

页面B有一个事件监听器，当它收到消息时触发

• 所述事件侦听器向页面A发送消息

页面有一个事件监听器，当它收到消息时触发

---

您可以向其添加一个id，以使源代码更清晰，但是您无法检查连接是否失败。或者，您可以经常ping另一侧，以查看它们是否存在连接。如果你不需要失败，你可以：

var communicators={};
function communicator(id){
this.myid=id;
communicators[id]=this;
this.listeners=[];
}
communicator.prototype.post=function(data){
window.postMessage({data:data,id:this.myid});

 return this;
 }
communicator.prototype.done=function(func){
this.listeners.push(func);
return this;
}
communicators.prototype.fire(data){
this.listeners.forEach((listener)=>{listener(data)});
this.listeners=[];
}

window.addEventListener("message",function(event){
//todo: check event.origin
communicators[event.data.id].fire(event.data.data);
}

使用类似于： 发件人：

在接收器端：

conn=new communicator("broadcast");
conn.done(func);

---

双方必须使用相同的id。

查看

event.source.postMessage（message，event.origin）

正如我所说，我完全了解

postMessage

，但正如下面其他人所指出的，这是单向沟通。MDN文章中是否有特别说明？它告诉您如何直接回复发件人。恐怕您没有领会我的意思，我想附加一个回调函数，以便在收到回复时启动回调函数，如果没有，则启动失败回调函数。正如我所说，这些例子都是单向沟通，没有机制。你需要自己创造它。我建议使用我发布的方法，这样你就可以回复发件人。这看起来不错，但我确实需要失败。也许我可以假设，如果我没有在（比如）3秒钟内收到来自接收者的确认消息，就会触发失败。我想我可以在代码的某个地方添加一个超时。我会看一看，谢谢。我考虑过了，但它不允许我以一种好的、干净的方式添加回调，我必须手动在两侧添加事件侦听器。

conn=new communicator("broadcast");
conn.done(func);