如何使用不同的协议（HTTP与HTTPS）在弹出窗口上侦听事件？

Question

我希望能够从任何非安全页面安全地对我网站上的用户进行身份验证。所以我制作了一个window.open()弹出框来打开一个安全的登录表单。计划是在用户注册或验证后，弹出窗口将关闭，父窗口将刷新。

关闭弹出窗口工作正常，但是，由于Cross Site Scripting规则，在尝试刷新父级时，我得到以下内容：

Unsafe JavaScript attempt to access frame with URL http://localhost/ from frame with URL https://localhost/signin_popup. The frame requesting access has a protocol of 'https', the frame being accessed has a protocol of 'http'. Protocols must match.

我不能简单地在onunload的父级订阅，因为身份验证弹出窗口可能会在准备好刷新父级之前遍历几个页面。我目前正在尝试查看是否可以将自定义事件绑定到父节点的弹出窗口对象，并从弹出窗口中触发它们，但无济于事。

因此...

如何让弹出窗口与父窗口交互，或者让父窗口在协议不匹配时订阅弹出窗口的自定义事件？

Answer 1

您应该能够使用postMessage-API

实现跨源窗口通信

将讯息发布到其他窗口：

otherWindowRef.postMessage( 'message', origin );

然后您将在另一个窗口收到它：

window.addEventListener( "message", function() {
   //message was received 
}, false );

另一个窗口同样会.postMessage回到主窗口，主窗口会收到一条消息事件。