我正在尝试使用 jQuery 设置一个通用的 AJAX 成功/错误处理程序,我可以在多个项目中使用它。我这样做的原因是因为在 AJAX 请求期间可能会发生许多可能的“错误”。以下是我目前处理过的问题以及状态编号:
- 0:未知错误
- 1:成功
- 2:未登录
- 3:超时
- 4:不允许(基于权限)
- 404错误
对于前 5 个错误,我不得不手动处理它们。为此,我能找到的唯一方法是在 AJAX 调用的成功函数内运行 cl4.process_ajax
方法,使用 JSON 数据中的状态键/属性来确定状态是。对于 404 或其他一些 AJAX 错误(即无法解析的 JSON),我在 jQuery 中使用了 ajaxError()
全局事件处理程序。
基本思路是当出现错误时在#ajax_errors
里面的屏幕顶部显示错误,向下滑动使其看起来“漂亮”。可以单击每个错误以将其隐藏。
这是我如何使用它的示例。 cl4.process_ajax
也可以放在 if 子句中,只允许代码在成功时执行。
$.getJSON('/path/to/page?c_ajax=1', function(return_data) {
cl4.process_ajax(return_data);
if (return_data !== null && typeof return_data == 'object' && typeof return_data.html != 'undefined') {
$('#div').html(return_data.html);
} else {
$('#div').html('');
}
});
查询参数 c_ajax
告诉登录和权限检查返回一个 JSON 数组,而不是像通常那样将用户重定向到登录或无访问页面。
只需包含 error_msg 键/属性,即可在服务器上轻松自定义显示的消息。这将使处理翻译之类的事情变得容易,也使代码更加灵活。我已经包含了在调试时显示调试消息的功能,因此在开发过程中很容易确定错误是什么(与一般用户消息相比)。
JSON 编码的数组应该类似于:
array(
status => the status using the constants in AJAX
error_msg => message to be displayed the user at the top of the page
debug_msg => message to be displayed in debug mode
html => the html to display
... any other data for that request
)
错误处理代码如下:
// setup the cl4 object and the debug flag
// these are typically else where and cl4 has other stuff in it
var cl4 = {};
var cl4_in_debug = TRUE; // probably default to false, but for this makes it easier to test
cl4.default_error_msg = 'There was a error loading some of the content on this page.<br>Try reloading the page or contacting an administrator.';
/**
* attach an AJAX error hander to the ajax_error element
*/
$('#ajax_errors').ajaxError(function() {
cl4.add_ajax_error(cl4.default_error_msg);
});
/**
* Call within a ajax success function to deal with the response of an ajax call
*/
cl4.process_ajax = function(return_data) {
if (typeof return_data != 'object' || return_data === null) {
cl4.add_default_ajax_error(return_data);
return false;
}
if (cl4.in_debug && typeof return_data.debug_msg != 'undefined'/* && return_data.debug_msg != ''*/) {
cl4.add_ajax_error(return_data.debug_msg);
}
// check to see if we've received the status, because we need it for the rest
if (typeof return_data.status == 'undefined') {
return;
}
switch (return_data.status) {
// successful
case 1 :
return true;
break;
// not logged in
case 2 :
cl4.add_default_ajax_error(return_data, 'You are no longer logged in. <a href="/login">Click here to login.</a>');
return false;
break;
// timed out
case 3 :
cl4.add_default_ajax_error(return_data, 'Your login has timed out. To continue using your current login, <a href="/login/timedout">click here to enter your password.</a>');
return false;
break;
// not allowed (permissions)
case 4 :
cl4.add_default_ajax_error(return_data, 'You do not have the necessary permissions to access some of the functionality on this page.');
return false;
break;
// unknown error
case 0 :
default :
cl4.add_default_ajax_error(return_data);
return false;
}
};
/**
* ajax error function, will show a red div at the top of the page if there is a problem with any of the ajax on the page
*/
cl4.add_ajax_error = function(error) {
$('#ajax_errors').append('<div>' + error + '</div>');
$('#ajax_errors div').click(function() {
$(this).slideUp(function() {
$(this).remove();
});
}).slideDown();
};
/**
* Adds a default message if there is no error_msg in the return_data object
*/
cl4.add_default_ajax_error = function(return_data, default_msg) {
if (arguments.length == 1) {
default_msg = cl4.default_error_msg;
}
if (return_data !== null && typeof return_data == 'object' && typeof return_data.error_msg != 'undefined' && return_data.error_msg != '') {
cl4.add_ajax_error(return_data.error_msg);
} else {
cl4.add_ajax_error(default_msg);
}
};
对此有什么想法吗?有更好的方法吗?除了无法解析的数据或 404(或类似)错误之外,我没有发现太多关于处理 AJAX“错误”的信息。另外,有没有更好的方法来处理 jQuery 中的这些类型的错误。 (我尝试使用成功处理程序,但它们似乎都在当前请求的成功处理程序之后运行。)
抱歉,代码量太大了……我希望它更短一些,但是
顺便说一句,我想将其设置为社区 wiki,但由于某种原因我没有复选框。
最佳答案
如果你的检查函数返回一个 bool 值来指定处理程序是否应该继续执行,那么你可以做类似的事情会更清晰:
$.getJSON('/path/to/page?c_ajax=1', function(return_data) {
if(!cl4.process_ajax(return_data)) return;
$('#div').html(return_data.html);
});
当然你也可以在 if block 中清除你的 div - 但我认为这个例子很好地展示了我的意图(如果可以在错误检查器中完成,则不要在处理程序本身中编写与基本错误检查相关的代码本身)。
关于javascript - 处理 AJAX 错误、未登录等 - 关于此方法的想法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5344882/