取消的 AJAX 请求会减慢后续导航

Posted 2023-02-19

【中文标题】取消的 AJAX 请求会减慢后续导航

【英文标题】：Canceled AJAX request slows subsequent navigation

【发布时间】：2012-09-04 14:15:26

【问题描述】：

在我的应用程序中，当用户请求报告时，会对执行大量数字运算和 mysql 请求的文件进行 jquery AJAX（使用 .load()）调用。加载一般需要5-6秒，加载过程中使用.ajaxStart()和.ajaxStop()显示加载gif。

问题：

如果用户单击“生成报告”按钮，然后改变主意并尝试导航到另一个页面，应用程序将挂起，并且在 5-6 秒内没有导航到新页面。我可以从加载 gif 的删除中看出 .ajaxStop() 在尝试导航到新页面时立即触发，但似乎 ajax 请求在浏览器加载下一页之前完成。

这是正常行为吗？有关如何修复/重组此问题的任何建议？

【问题讨论】：

我只是想发表评论并告诉你，你并不孤单！我有这个确切的问题。从 Chrome 的检查器和 Firebug 来看，浏览器已经取消了使用 AJAX 发出的待处理网络请求，并且只有下一页的“新”请求为“待处理”。然而，在它真正选择离开之前，它似乎仍会挂起 5-10 秒。

这里相同：浏览器总是延迟到现有的 ajax 请求完成。即使不再需要响应。

您是否在使用通过跨域请求添加 OpenID 凭据的库？

【参考方案1】：

我相信 .ajaxStop() 只有在 beforeSend 回调返回 false 时才会取消 ajax 请求。在这种情况下，呼叫尚未启动，服务器尚未收到请求。一旦请求被发送到服务器，页面将不再控制请求，直到它返回。 .ajaxStop() 请求在离开页面时触发，因为最后一次 ajax 调用已成功完成，因此终止执行。

如果通过在 beforeSend 回调函数中返回 false 取消最后一个未完成的 Ajax 请求，也会触发 ajaxStop 事件。

以上是来自 jquery api 网站的.ajaxStop() 命令的摘录。看起来，一旦进行了调用并发送了请求，您的服务器正在完成调用，即使用户正在导航到不同的页面。如果是这么大的电话，可能会导致您遇到延迟。

希望这会有所帮助。

【讨论】：

我相信他们更担心浏览器似乎仍在等待 AJAX 请求返回，即使他们正在尝试导航到另一个页面。是的，服务器无法停止，无论如何都会愉快地处理请求；但是浏览器应该已经停止关心了。它不应该等待请求返回。