onbeforeunload 中的 Ajax 第一次无法正常工作答案

【问题标题】：Ajax inside onbeforeunload is not working the first timeonbeforeunload 中的 Ajax 第一次无法正常工作
【发布时间】：2015-09-10 14:15:19
【问题描述】：

我一直在尝试通过调用以下脚本来绑定beforeunload 事件，以便我可以通过AJAX 转到指定的URL。问题是AJAX 第一次没有工作，因为我第一次刷新页面时没有调用 URL。第二次ajax工作。当我将async 设置为false 时，这个问题得到了解决，但是success 中的警报弹出窗口没有出现。我需要提醒框也显示在success 块中。

 <script type="text/javascript">
  $( document ).ready(function() {
    // this method will be invoked when user leaves the page, via F5/refresh, Back button, Window close
    $(window).bind('beforeunload', function(event){
          // invoke the servlet, to logout the user
      $.ajax({
        cache: false,
        type: "GET",
        url: "LogoutController" ,
        success: function (data) {
          alert("You have been logged out");
        }

      });
    });
 });
</script>

【问题讨论】：

你用的是哪个浏览器？
只是提醒您，每当用户浏览您网站中的链接时，也会调用您的方法。因此，您的用户将在他们访问的每个页面上注销（如果 AJAX 调用设法有时间完成，它可能不会，并且 - 当然 - 如果此代码存在于每个页面上）。 beforeunload 在每个页面解构时触发；不仅仅是您在评论中列出的事件。尝试跟踪离开站点/页面的用户非常困难，并且容易出现许多问题，因此大多数站点依赖会话超时来自动注销。
@Vaibs_Cool 我需要让它仅适用于 Chrome。
@Pebbl 好消息是我正在开发一个单页应用程序。没有下一页/上一页。离开当前页面无论如何都会导致注销。我现在可以为我的单页网络应用做些什么？
@user2918640 ~ 啊，好的。如果用户刷新页面，仍然会是一个奇怪的行为，但是你喜欢:) - 你可以做你正在做的事情，确保请求是同步的（异步不会削减它，正如你发现的那样）。但是浏览器不会发出警报，因为此时页面将被解构（&只会被同步请求暂停）。最好使用“注销”按钮将“注销”留给用户。您可以设置要显示的 cookie 消息（如果它们位于您控制的页面上）。要么看看Websockets

标签： javascript jquery ajax redirect onbeforeunload

【解决方案1】：

beforeunload 将在关闭页面之前等待事件处理程序完成其执行。由于 ajax 调用是异步的，beforeunload 不会等待它完成（但是您的服务器仍然应该收到请求）。这是预期的行为，我不认为这是一种解决方法。

可以使用以下代码重现此行为：

window.onbeforeunload = function () {
    console.log("bye");
    setTimeout(function () {
        console.log("bye1");
    }, 200);
    console.log("bye2")
};

//bye
//bye2

另外，您应该注意，根据MDN，规范声明 alert() 可以被忽略：

自 2011 年 5 月 25 日起，HTML5 规范规定调用 window.alert()、window.confirm() 和 window.prompt() 方法可能是在此事件期间被忽略。

当这种情况发生在 chrome 上时（我只检查了浏览器），您将在控制台中收到以下消息：

Blocked alert('test') during beforeunload.

【讨论】：

我可以使用 async to false 但在这种情况下，为什么成功块内的警报框没有弹出？或者我如何等到控制器调用完成？
将 async 设置为 false 将使 onbeforeunload 等待控制器调用完成，但您的警报可能仍会被浏览器忽略。