加载资源失败：Safari 上的请求超时

Question

我们的 Web 应用程序现在可以在大多数浏览器上正常运行一年多。 最近我们发现它在 Safari 上运行不佳。

很多操作最终都会出现以下错误：Failed to load resource: Request timed out。有趣的是动作实际上是正确执行的之后（大部分时间）。

查看错误时，似乎是有 ajax 请求时发生的。

首先我尝试通过执行以下操作来更改 ajax 超时设置：

 $.ajax({
      "type"      : methode,
      "dataType"  : "json",
      "url"       : url,
      "async"     : async,
      "data"      : donneesEnvoyees,
      "timeout"   : 60000
 })

这并没有改变任何东西，错误实际上是在大约 10 秒后出现的，小于定义的超时时间。

在互联网上阅读了一些内容后，我看到了一些关于指定 no-cache 的答案，以便 safari 不会将 post 参数保留在缓存中。 我不能说我完全理解这一点，但我仍然尝试了以下方式：

$.ajax({
     "type"      : methode,
     "headers"   : { "cache-control": "no-cache" }, <-- added this line
     "dataType"  : "json",
     "url"       : url,
     "async"     : async,
     "data"      : donneesEnvoyees,
     "timeout"   : 60000
 })

如你所料，我仍然遇到同样的错误。

你知道发生了什么吗？为什么这个错误只发生在 Safari 而不是其他浏览器上？如何解决？

Answer 1

在您的 ajax 设置中设置 async: true。它将使浏览器保持连接并在收到响应后关闭。

Answer 2

如果您从代码中删除dataType : "json"，我认为您的问题将得到解决如果您的ajax 页面的返回不是正确的JSON 字符串。我注意到如果提供了dataType : "json" 并且返回数据不是JSON 类型，则$.ajax() 不会转到成功函数。

PS
有些东西，比如 AJAX 设置关键字 type, dataType, url 等不应该用双引号引起来。即使代码即使使用当前的方式也可以工作，但我提到的是正确的方式。

$.ajax({
      type      : methode,
      dataType  : "json",
      url       : url,
      async     : async,
      data      : donneesEnvoyees,
      timeout   : 60000,
      success   : function(data){
                alert('success');
      }
});

我假设您已经通过这个 ajax 调用添加了一个 success 函数，您可以使用它来根据结果使用不同的操作。

Answer 3

我遇到了同样的问题。通过将 CORS 标头和响应状态代码添加为 200

进行了修复

 res.header('Access-Control-Allow-Origin', '*');
 res.status(200);

方法和原因

通过阅读 jQuery 的源代码深入了解错误后，我意识到真正的问题是 jQuery+Safari 中的 XMLHttpRequest 调用 onError 并带有 http 状态码0。所以我添加了CORS头并给它一个200状态码来解决问题。