如何监听form表单提交打开的第三方授权弹窗的关闭事件？

• 初始绑定的onbeforeunload属于window.open创建的空白同源页面的事件，form提交触发弹窗跳转跨域站点时，空白页面被卸载，因此会触发一次日志
• 弹窗跳转到非同源的第三方授权站点后，受浏览器同源策略限制，你无法操作/监听第三方页面的任何事件，原有绑定的事件直接失效，因此关闭弹窗时不会再触发日志

你可以通过轮询弹窗实例的closed属性判断弹窗是否被关闭，该属性不受同源策略限制，跨域场景下也可以正常读取，仅修改Main.js即可实现需求，代码如下：

// Main.js
const fnPopup = () => {
    var popup = window.open('', 'pChk', 'width=500, height=500, scrollbars=no, status=no, menubar=no');

    document.autho_form.action = "https://myAuthorizationSite.com/autho.cb";
    document.autho_form.target = "pChk";
    document.autho_form.submit();

    // 轮询判断弹窗状态
    const checkPopupClose = setInterval(() => {
        if (popup.closed) {
            clearInterval(checkPopupClose);
            console.log("[TEST] This Popup will be closed");
            // 此处可添加弹窗关闭后需要执行的其他逻辑
        }
    }, 300); // 轮询间隔可根据实际需求调整
};

该方案兼容性极强，所有支持window.open的浏览器都可正常使用，也不需要对第三方授权站点做任何修改。

内容的提问来源于stack exchange，提问作者Honken