javascript - 两个窗口之间交换信息

Question

我不确定如何在标题中简短地解释我的问题，所以请原谅我。假设我在某个随机页面中打开了我的网站，并且有一个注册按钮。非常简单，但就我而言，我要求注册表单出现在其他选项卡(或窗口)中。不是“RederPartial”，也不是某种弹出窗口，合法的新选项卡。问题是，我希望能够从我的随机页面中检测注册何时完成(即创建了新用户)。我怎样才能传递这些信息？无需重新加载第一页

Answer 1

有多种方法可以使两个窗口相互通信(通过服务器、使用 cookies、使用文件系统 API 或本地存储。

Locale Storage是迄今为止在来自同一域的两个窗口之间进行通信的最简单方法，但较旧的浏览器不支持它。由于无论如何您都需要联系服务器来了解某人何时注册，因此我建议使用服务器(Ajax//web 套接字)。

这是一个稍微简单的 AJAX 解决方案，您可以在随机页面中使用它:

(function(){
    var formOpened = false;
    var registered = false;

    //Change to whatever interaction is needed to open the form
    $('#registerbutton').on('click', function(){
        if (!formOpened){
            formOpened = true;

            //Will try to poll the server every 3 seconds
            (function pollServer(){
                $.ajax({
                    url: "/ajax/pollregistered",
                    type: "GET",
                    success: function(data) {
                        if (data.registered){
                            registered = true;
                            //do other stuff here that is needed after registration
                        }
                    },
                    dataType: "json",
                    complete: setTimeout(function() {if (!registered) pollServer();}, 3000),
                    //will timeout if request takes longer than 2 seconds
                    timeout: 2000,
                })
            })();

            //opens the new tab
            var win = window.open('/registrationform', '_blank');
            win.focus();
        }
    });
})();

然后，您可以在“/ajax/pollregistered”操作中使用访问者的 session key 来编写后端代码，以检查该访问者是否以及何时注册为您网站的用户。

如果您不介意使用本地存储，您可以轮询存储而不是服务器，并在注册时将注册页面写入本地存储。这对您的服务器来说压力较小，但对于使用旧浏览器的用户可能不起作用。

同样值得一提的是，这种打开新选项卡的方法并不完全可靠。从技术上讲，没有一种确定的方法可以使用 JavaScript 打开新选项卡。这取决于浏览器和用户的偏好。对于使用防弹出插件的用户来说，打开新选项卡可能会被阻止。

话虽这么说，我强烈建议修改您的设计并尝试找到一种仅使用一个窗口的方法。这可能对您自己和您的用户都更好。