包装 jQuery 的 $.ajax() 方法来定义全局错误处理
Posted
技术标签:
【中文标题】包装 jQuery 的 $.ajax() 方法来定义全局错误处理【英文标题】:Wrap jQuery's $.ajax() method to define global error handling 【发布时间】:2011-05-19 12:31:06 【问题描述】:从this one 之类的问题中分离出来,我希望包装jQuery 的$.ajax() 方法,这样我就可以在一个位置提供错误处理,然后所有应用程序的远程调用都会自动使用该方法。
简单的方法是简单地创建一个新名称,类似于 $.get() 和 $.post() 如何实现 $.ajax() 的外观。但是,我希望重用名称 $.ajax(),这样我们就可以使用标准的 jQuery 语法来保留我们的其余代码,从而隐藏我们添加了自己的错误处理的事实。这是否实用和/或好实现,或者可能是一个可怕的想法?
编辑:到目前为止的响应表明 .ajaxError() 是要走的路。我知道这会捕获 400 和 500 级错误,但是有没有办法(使用此事件处理程序或其他方式)也可以捕获 302 重定向?我正在尝试处理重定向到登录页面的响应,但我们希望在它是 XHR 请求时拦截该重定向,允许用户取消操作而不是强制它们自动转发。
【问题讨论】:
附带说明,对未登录的 AJAX 请求的响应可能应该返回 401 而不是 302。无论如何值得深思。 【参考方案1】:你可能想看看$.ajaxError
。
$(document).ajaxError(function myErrorHandler(event, xhr, ajaxOptions, thrownError)
alert("There was an ajax error!");
);
jQuery 提供a whole bunch of other ways to attach global handlers。
要回答您的编辑,您可以使用 $.ajaxSuccess
捕获成功的 ajax 请求,并且您可以使用 $.ajaxComplete
捕获所有(成功和失败)请求。可以从xhr
参数中获取响应码,比如
$(document).ajaxComplete(function myErrorHandler(event, xhr, ajaxOptions, thrownError)
alert("Ajax request completed with response code " + xhr.status);
);
【讨论】:
@Marc L:已编辑以匹配您的额外信息。此外,您可能会觉得这很有趣:***.com/questions/199099/… 尝试$(document).ajaxError(…);
- 使用$.ajaxError(...)
对我不起作用。
这不会捕获 302/重定向 :( - 否则很好的解决方案!【参考方案2】:
jQuery 有一个名为 $.ajaxSetup() 的方便方法,它允许您设置适用于所有基于 jQuery 的 AJAX 请求的选项。通过将此方法放在您的主文档准备功能中,所有设置将自动应用于您的其余功能并在一个位置
$(function ()
//setup ajax error handling
$.ajaxSetup(
error: function (x, status, error)
if (x.status == 403)
alert("Sorry, your session has expired. Please login again to continue");
window.location.href ="/Account/Login";
else
alert("An error occurred: " + status + "nError: " + error);
);
);
参考:https://cypressnorth.com/programming/global-ajax-error-handling-with-jquery/
【讨论】:
我认为这比 ajaxError() 更好,因为不需要将侦听器绑定到 DOM,并且当你说全局时更有意义。 @Wancieho 见 Global callback functions should be set with their respective global Ajax event handler methods—.ajaxStart(), .ajaxStop(), .ajaxComplete(), .ajaxError(), .ajaxSuccess(), .ajaxSend()—rather than within the options object for $.ajaxSetup(). 和 As of jQuery 1.9, all the handlers for the jQuery global Ajax events, including those added with the .ajaxError() method, must be attached to document. 为丑陋的格式道歉,只能在评论中做这么多?【参考方案3】:实际上,jQuery 提供了这个钩子,.ajaxError()
就是为了这个目的。当来自页面的 ajax 请求完成并出现错误时,将调用您与 $ajaxError()
绑定的所有处理程序。指定选择器允许您在 .ajaxError()
处理程序中引用 this
。
要使用它来处理页面上的所有 ajax 请求错误并使用this
指向document
,您可以执行以下操作:
$(document).ajaxError(function(event, request, settings)
alert("Error requesting page: " + settings.url);
);
【讨论】:
澄清一下,ajaxError 处理所有 ajax 失败,而不仅仅是那些匹配选择器的失败。使用选择器只允许您在回调中使用this
关键字来引用该元素。【参考方案4】:
我认为这是个坏主意。我认为包装$.ajax
很好,但您正在谈论重新定义它。任何没有意识到这一点的人都会得到意想不到的结果。
正如其他人所提到的,将处理程序绑定到$.ajaxError
是可行的方法。
【讨论】:
以上是关于包装 jQuery 的 $.ajax() 方法来定义全局错误处理的主要内容,如果未能解决你的问题,请参考以下文章
jquery AJAX提交前beforesend无效,大家帮我看下谢谢。
JQuery - $.ajax() - 使用 JSONP 的跨域 - 仅在 IE 8 中获取“解析器错误”(在 IE 7 中工作)