连接丢失后，ajax 请求在 chrome 中挂起

Posted 2023-03-05

【中文标题】连接丢失后，ajax 请求在 chrome 中挂起

【英文标题】：ajax requests hangs in chrome after connection lost

【发布时间】：2018-03-22 23:27:49

【问题描述】：

我注意到 google chrome 中有一些奇怪的行为：

如果我们在没有网络连接的情况下发送 ajax 后请求，我们会在控制台中收到 err_internet_disconnected 异常（我认为，没关系） 如果我们在这个请求期间发送了长的 ajax 请求并失去了网络连接，谷歌浏览器不会中止它，控制台和 devconsole 的网络选项卡中没有 err_internet_disconnected 异常，这个请求被标记为待处理（即使在连接出现之后） .事实上，这个连接挂了，没有机会在 js 代码中处理这个（我们期望得到 ajax 错误，但没有任何反应）。

您对如何处理这种行为有什么建议吗？

编辑： 代码示例：

$.ajax(
   url: "https://someserver.com/ws.asmx/ExecuteEx?pureJson",
   type: "POST",
   contentType: "application/json",
   data: data,
   success: function() 
      console.log("success");
   ,
   error: function() 
      console.log("error");
   
)

我在编辑这篇文章时在此页面的 chrome 开发控制台中尝试了此代码。截图如下。 第一个请求是我的。我发送了它，然后拔下网线。 第二个请求失败（因为拔掉了网线）。 然后我插入网线，第三次请求成功。但是第一个请求仍然处于待处理状态（尽管网络连接丢失）。

devconsole's network tab

【问题讨论】：

你能发布你的ajax代码吗？

@DiskJunky ，是的，我已经编辑了这篇文章

您是否设置了timeout 属性？见Set timeout for ajax (jQuery)。如果超时后连接丢失，那应该中止请求。您是否也测试过任何其他浏览器，例如 FireFox 或 IE？

至少 FireFox 具有相同的行为。我知道“超时”属性，但即使需要数小时来处理服务器上的请求，我们也需要得到结果。但是你提到的 timeout 属性让我知道如何使用 timeout 绕过这个问题。

【参考方案1】：

设置timeout 属性。如果超时后连接丢失，则应该中止请求。

$.ajax(
   url: "https://someserver.com/ws.asmx/ExecuteEx?pureJson",
   type: "POST",
   contentType: "application/json",
   data: data,
   timeout: 1000, // value in milliseconds
   success: function() 
      console.log("success");
   ,
   error: function() 
      console.log("error");
   
)

---

另见ajax documentation

超时

为请求设置超时（以毫秒为单位）。值为 0 表示不会有超时。这将覆盖使用 $.ajaxSetup() 设置的任何全局超时。超时时间从 $.ajax 调用开始；如果有几个其他请求正在进行，并且浏览器没有可用的连接，则请求可能会在发送之前超时。

【讨论】：

如果等待时间增加（超过 1000 毫秒超时），ajax 会发生什么？ ajax 会继续处理请求吗？如果我们不拔掉连接会发生什么？并且 ajax 不断请求服务器和 xhr 在控制台中以红色显示（待处理）？如何处理？以及如何复制/测试这种情况？

@CuriousDeveloper - 现有问题的 cmets 不是询问您的问题或任何新问题的正确位置。请使用您的具体和相关详细信息打开一个新问题。另请参阅How to Ask。

【参考方案2】：

尝试替换$中的错误函数。 Ajax(用这段代码比较结果

error: function (request, status, error) 
        console.log(request.responseText);
        console.log(request.status);
        console.log(request.error);
    

希望对你有所帮助。

【讨论】：

没用（