使用 ajax 的 onBeforeUnload 不适用于 IE答案

【问题标题】：onBeforeUnload with ajax does not work with IE使用 ajax 的 onBeforeUnload 不适用于 IE
【发布时间】：2012-02-28 10:33:10
【问题描述】：

我只是想知道为什么这不适用于 IE。它适用于 Chrome 和 Firefox。

    window.onbeforeunload = function()
{
    fetch("http://"+window.location.hostname+"/process_sc.php?cC=" + 1);
} 

function fetch(url) {
    var x = (window.ActiveXObject) ? new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest();
    x.open("GET", url, false);
    x.send(null);
}

【问题讨论】：

为什么要在“onbeforeunload”上调用 Ajax....
developer.mozilla.org/en/DOM/window.onbeforeunload
@Sudhir 为什么？还有其他方法吗？

标签： javascript ajax

【解决方案1】：

你怎么知道它不起作用？

一般来说，beforeunload 事件、unload 事件和实际页面退出之间的时间很短。在页面卸载时，所有正在运行的脚本都会被删除（例如，浏览器会关闭窗口或导航到用户提供的地址）。

这里可能发生的情况是浏览器在页面卸载之前真的没有时间发送 ajax 请求。

我已经看到了几种方法来确保在页面卸载之前完成您的最终请求。其中之一是发送请求，然后引入运行 X 毫秒的循环，推迟 unload 事件并确保 ajax 请求可以完成。

window.onbeforeunload = function() {
    fetch("http://"+window.location.hostname+"/process_sc.php?cC=" + 1);
    // here we force browser to wait for 300 seconds before proceeding with unload
    var t = Date.now() + 300;
    while(Date.now() < t) {};
}

【讨论】：

您好，它仅在我第一次打开 IE 时有效。我在 process_sc.php 文件上有一个 php 代码，每次执行此 URL 时，我的表中的值都会增加 1：http://"+window.location.hostname+"/process_sc.php?cC=" + 1。我第二次点击上面代码的页面上的链接，它似乎没有调用 fetch 函数，因为我的表中的值不再增加。
当我双击出站链接时，fetch 函数被调用了两次，这没问题，但唯一的问题是它不会触发 x.open("GET", url, false);
不，它不会在 IE 中返回任何错误。它适用于 chrome 和 firefox。我只是想知道为什么它在 IE 中表现不佳。
在调用 fetch 函数后尝试输入简单的alert('test');，然后检查问题是否消失。
正如我所说，只要使用 onbeforeunload 事件卸载页面，就会调用 fetch 函数。唯一的问题是 x.open("GET", url, false);不会在您第二次加载页面时触发。这就像当你打开 IE 时 x.open("GET", url, false);卸载页面时调用 w/out 问题。但是当您单击后退按钮时，当您卸载页面时它将不再起作用。

【解决方案2】：

问题是您使用 GET 而不是 POST 请求。浏览器可能会使用第一个请求的缓存结果。

这解释了这样一个事实，即“它仅在我第一次打开 IE 时才有效”，正如在另一个答案中所写的那样。

顺便说一下，onunload 中的 AJAX 调用似乎只有在您使用 XMLHttpRequest.open(...) 中的参数 async = false 时才能在 IE10 中可靠地工作，您已经这样做了。

【讨论】：