jquery - 想要阻止页面重新加载/离开直到 Ajax 请求完成

Question

我正在开发一个项目，在该项目中我实现了 AJAX 请求以将复杂数据存储到数据库中。我想阻止用户重新加载/离开页面，直到 AJAX 请求完成。我尝试在 AJAX 中添加 async: false 但没有成功。

$.ajax({
  headers: {
    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
  },
  url: "{{url('api/place-order')}}",
  type: "post",
  async: false,
  data: data,
  processData: false,
  contentType: false,
  cache: false,
  success: function(response) {
    console.log("success)
  }
});

提前致谢。

Answer 1

你不能。过去，某些浏览器允许同步 ajax 调用，但大多数浏览器不再允许。

Chrome(也许还有其他浏览器)最近开始支持一个实验性 API ( sendBeacon )，它允许您执行 ajax 调用，即使它不会阻止关闭页面，该调用也会完成从用户的角度来看。但如果你真的想推迟关闭页面，你就不能这样做。但是 sendBeacon 对于主动告诉服务器用户(可能)正在离开(作为超时的辅助手段)可能很有用。 (“也许”，因为当然，他们可能只是刷新页面或导航到同一应用程序/网站中的另一个页面。)