JQuery Ajax - 如何在进行 Ajax 调用时检测网络连接错误

IT技术 javascript ajax jquery
2021-01-27 18:45:45

我有一些 Javascript JQuery 代码，它每 5 分钟对服务器进行一次 Ajax 调用，它是为了保持服务器会话处于活动状态并保持用户登录。我正在使用$.ajax()JQuery 中的方法。这个函数似乎有一个“错误”属性，我试图在用户的互联网连接中断时使用它，以便 KeepAlive 脚本继续运行。我正在使用以下代码：

var keepAliveTimeout = 1000 * 10;

function keepSessionAlive()
{
    $.ajax(
    {
        type: 'GET',
        url: 'http://www.mywebapp.com/keepAlive',
        success: function(data)
        {
            alert('Success');

            setTimeout(function()
            {
                keepSessionAlive();
            }, keepAliveTimeout);
        },
        error: function(XMLHttpRequest, textStatus, errorThrown)
        {
            alert('Failure');

            setTimeout(function()
            {
                keepSessionAlive();
            }, keepAliveTimeout);
        }
    });
}

当我运行它时，我会每 10 秒在屏幕上的警告框中弹出“成功”，这很好。然而，一旦我拔掉网络电缆，我什么也得不到，我期待错误函数被调用并看到一个“失败”警告框，但没有任何react。

假设“错误”功能仅适用于从服务器返回的非“200”状态代码，我是否正确？有没有办法在进行 Ajax 调用时检测网络连接问题？

6个回答
// start snippet
error: function(XMLHttpRequest, textStatus, errorThrown) {
        if (XMLHttpRequest.readyState == 4) {
            // HTTP error (can be checked by XMLHttpRequest.status and XMLHttpRequest.statusText)
        }
        else if (XMLHttpRequest.readyState == 0) {
            // Network error (i.e. connection refused, access denied due to CORS, etc.)
        }
        else {
            // something weird is happening
        }
    }
//end snippet
有关更多信息，XMLHttpRequest.readyState请参阅ajax_xmlhttprequest_response.asp
2021-03-23 18:45:45
并使用 ajax 表单执行相同的操作：<form ... data-ajax-failure="YourMethod" ...></form>并使用您的方法function YourMethod(XMLHttpRequest) { ..same code... }
2021-04-11 18:45:45
这应该是公认的答案。在您提供给 $.ajax 的错误函数中，第一个参数提供了各种状态信息。即使您没有设置超时，它也会这样做。
2021-04-13 18:45:45

您应该添加：timeout: <number of miliseconds>,在$.ajax({}). 此外，cache: false,在某些情况下可能会有所帮助。

$.ajax 有据可查，您应该检查那里的选项，可能会发现有用的东西。

祝你好运！

有很多东西根本没有记录在 Ajax 中，并且以某种方式隐藏了:(
2021-03-24 18:45:45

由于我无法复制该问题，因此我只能建议尝试在 ajax 调用上超时。在 jQuery 中，您可以使用 $.ajaxSetup 设置它（并且它对于您的所有 $.ajax 调用都是全局的），或者您可以专门为您的调用设置它，如下所示：

$.ajax({
    type: 'GET',
    url: 'http://www.mywebapp.com/keepAlive',
    timeout: 15000,
    success: function(data) {},
    error: function(XMLHttpRequest, textStatus, errorThrown) {}
})

JQuery 将在您的调用中注册 15 秒超时；之后，如果没有来自服务器的 http 响应代码，jQuery 将执行错误回调，并将 textStatus 值设置为“超时”。有了这个，您至少可以停止 ajax 调用，但您将无法区分真正的网络问题和连接丢失。

我在这种情况下看到的是，如果我拔下客户端机器的网线并进行调用，则会调用ajax成功处理程序（为什么，我不知道），并且数据参数为空字符串。因此，如果您将真正的错误处理排除在外，您可以执行以下操作：

function handleError(jqXHR, textStatus, errorThrown) {
    ...
}

jQuery.ajax({
    ...
    success: function(data, textStatus, jqXHR) {
        if (data == "") handleError(jqXHR, "clientNetworkError", "");
    },
    error: handleError
});

如果您要跨域调用 Use Jsonp。否则不返回错误。

其它你可能感兴趣的问题
上一篇如何通过 jquery/javascript 在 <head> 中添加任何内容？ 下一篇javascript 必须在 head 标签中吗？