浏览器窗口通信之 post-robot 示例

小渣渣

需求：之前使用 PostMessage 测试过浏览器窗口直接的通信，今天使用一个第三方的库 post-robot 进行跨域窗口之间的通信。

JS 判断当前页面是否是 Iframe 或者 Popup 窗口
https://www.itsvse.com/thread-10342-1-1.html

HTML5 之 PostMessage 跨窗口通信
https://www.itsvse.com/thread-10343-1-1.html

post-robot 其实是对 PostMessage 方式进行通信进一步的封装，特点（向另一个窗口发送消息）如下：

• 从您发送消息的窗口获得回复
• 跨不同域将函数传递到另一个窗口
• 处理任何阻止您的消息通过的错误
• 不要担心序列化您的消息；只发送 javascript 对象
• 使用promises或async/await等待您发送消息的窗口的响应
• 在某个域上的两个窗口之间建立安全消息通道
• 在 IE 中的父窗口和弹出窗口之间发送消息
  

NPM 地址：https://www.npmjs.com/package/post-robot
GitHub 代码地址：https://github.com/krakenjs/post-robot

首先，先看一下效果图，如下：



父窗口 popup 出一个子窗口，然后向子窗口发送消息，并且能够得到子窗口的回应，当然，子窗口向父窗口发送消息也能得到回应，类似 HTTP 的请求响应模式。

父窗口代码如下：

登录可见。

子窗口代码如下：

登录可见。

（完）

ganmian

hellohellohello