使用ajax

Question

我有一个网页，该网页使用带有某些请求参数的window.open打开一个弹出窗口。该参数是从ajax调用获得的，并且window.open在xhr的处理程序内被调用

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (this.readyState == 4) {
        switch (this.status) {
            case 200:
                window.open("script.php?param2="+this.responseText, "_blank", "...");
                break;
            default:
                alert('aw snap');
                break;
            }
        }
    };
xhr.open("GET", "first_script.php?param1=3", false);
xhr.send();

如您所见，此ajax调用已同步，这在浏览器的控制台中生成警告。如果使此ajax调用异步，则不会出现警告，但弹出窗口将被浏览器阻止，因为它不是由用户直接调用的。

我基本上需要通过ajax调用获取一些数据，等待它，然后使用获取的数据作为请求参数调用window.open。

我在这里看到了有关如何等待异步请求的解决方案： How do I return the response from an asynchronous call?

但是，建议该主题中的讨论完全不要使用同步调用，因为这被认为是不好的做法。

我真的很困惑。您能给我一个提示，如何以正确的方式实现这种行为吗？我认为，我试图实现的行为非常普遍。必须有一种正常的方法来完成此操作，而无需重新发明轮子。

Answer 1

您应该避免，因为同步XHR在现代浏览器中已被弃用。

弹出窗口阻止程序通常会阻止显示的所有弹出窗口，这些弹出窗口不是由直接的用户操作（例如单击按钮或链接）触发的。

解决问题的方法是，在发送异步XHR之前创建并存储一个新窗口，并在收到响应时更改其位置：

    var newWindow = window.open("", "_blank");
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function() {
        if (this.readyState == 4) {
            switch (this.status) {
                case 200:
                    newWindow.location = "script.php?param2="+this.responseText;
                    break;
                default:
                    alert('aw snap');
                    break;
            }
        }
    };
    xhr.open("GET", "first_script.php?param1=3", true);
    xhr.send();