jQuery Ajax错误处理，显示自定义异常消息

jQuery Ajax error handling, show custom exception messages

有没有什么方法可以在jQuery AJAX错误消息中显示自定义异常消息作为警告?

例如，如果我想通过Struts by throw new ApplicationException("User name already exists");在服务器端抛出异常，我想在jQuery AJAX错误消息中捕获这条消息("user name already exists")。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

jQuery("#save").click(function () {
if (jQuery('#form').jVal()) {
jQuery.ajax({
type:"POST",
url:"saveuser.do",
dataType:"html",
data:"userId=" + encodeURIComponent(trim(document.forms[0].userId.value)),
success: function (response) {
jQuery("#usergrid").trigger("reloadGrid");
clear();
alert("Details saved successfully!!!");
},
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(thrownError);
}
});
}
});

在第二个警告中，我警告抛出的错误，我得到undefined，状态代码是500。

我不知道我错在哪里。我能做什么来解决这个问题?

确保将Response.StatusCode设置为200之外的值。使用Response.Write编写异常消息，然后使用…

1	xhr.responseText

. .在你的javascript。

相关讨论

控制器:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

public class ClientErrorHandler : FilterAttribute, IExceptionFilter
{
public void OnException(ExceptionContext filterContext)
{
var response = filterContext.RequestContext.HttpContext.Response;
response.Write(filterContext.Exception.Message);
response.ContentType = MediaTypeNames.Text.Plain;
filterContext.ExceptionHandled = true;
}
}

[ClientErrorHandler]
public class SomeController : Controller
{
[HttpPost]
public ActionResult SomeAction()
{
throw new Exception("Error message");
}
}

视图脚本:

1
2
3
4
5
6
7
8
9

$.ajax({
type:"post", url:"/SomeController/SomeAction",
success: function (data, text) {
//...
},
error: function (request, status, error) {
alert(request.responseText);
}
});

相关讨论

服务端:

1
2
3
4
5
6
7
8
9

doPost(HttpServletRequest request, HttpServletResponse response){
try{ //logic
}catch(ApplicationException exception){
response.setStatus(400);
response.getWriter().write(exception.getMessage());
//just added semicolon to end of line

}
}

ClientSide:

1
2
3
4
5
6
7
8
9

jQuery.ajax({// just showing error property
error: function(jqXHR,error, errorThrown) {
if(jqXHR.status&&jqXHR.status==400){
alert(jqXHR.responseText);
}else{
alert("Something went wrong");
}
}
});

通用Ajax错误处理

如果我需要对所有ajax请求执行一些通用的错误处理。我将设置ajaxError处理程序，并将错误显示在html内容顶部名为errorcontainer的div上。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

$("div#errorcontainer")
.ajaxError(
function(e, x, settings, exception) {
var message;
var statusErrorMap = {
'400' :"Server understood the request, but request content was invalid.",
'401' :"Unauthorized access.",
'403' :"Forbidden resource can't be accessed.",
'500' :"Internal server error.",
'503' :"Service unavailable."
};
if (x.status) {
message =statusErrorMap[x.status];
if(!message){
message="Unknown Error
.";
}
}else if(exception=='parsererror'){
message="Error.
Parsing JSON Request failed.";
}else if(exception=='timeout'){
message="Request Time out.";
}else if(exception=='abort'){
message="Request was aborted by the server";
}else {
message="Unknown Error
.";
}
$(this).css("display","inline");
$(this).html(message);
});

You need to convert the responseText to JSON. Using JQuery:

1 2	jsonValue = jQuery.parseJSON( jqXHR.responseText ); console.log(jsonValue.Message);

相关讨论

如果调用asp.net，这将返回错误消息标题:

我没有亲自编写formatErrorMessage的所有内容，但是我发现它非常有用。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

这就是我所做的，到目前为止它在MVC 5应用程序中是有效的。

控制器的返回类型是ContentResult。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

public ContentResult DoSomething()
{
if(somethingIsTrue)
{
Response.StatusCode = 500 //Anything other than 2XX HTTP status codes should work
Response.Write("My Message");
return new ContentResult();
}

//Do something in here//
string json ="whatever json goes here";

return new ContentResult{Content = json, ContentType ="application/json
<hr>
<p>
If someone is here as in 2016 for the answer, use <wyn>.fail()</wyn> for error handling as <wyn>.error()</wyn> is deprecated as of jQuery 3.0
</p>

[cc]$.ajax("example.php" )
.done(function() {
alert("success" );
})
.fail(function(jqXHR, textStatus, errorThrown) {
//handle error here
})

希望对大家有所帮助

相关讨论

一般/可重用的解决方案

这个答案为以后遇到这个问题的人提供了参考。解决方案包括两件事:

当服务器上的验证失败时抛出的自定义异常ModelStateException(当我们使用数据注释和强类型控制器动作参数时，模型状态报告验证错误)自定义控制器操作错误过滤器HandleModelStateExceptionAttribute，它捕获自定义异常并返回HTTP错误状态和主体中的模型状态错误

这为jQuery Ajax调用提供了最佳的基础设施，以便使用success和error处理程序充分发挥它们的潜力。

客户端代码

1
2
3
4
5
6
7
8
9
10

$.ajax({
type:"POST",
url:"some/url",
success: function(data, status, xhr) {
// handle success
},
error: function(xhr, status, error) {
// handle error
}
});

服务器端代码

1
2
3
4
5
6
7
8
9
10

[HandleModelStateException]
public ActionResult Create(User user)
{
if (!this.ModelState.IsValid)
{
throw new ModelStateException(this.ModelState);
}

// create new user because validation was successful
}

在这篇博客文章中详细介绍了整个问题，您可以在其中找到在您的应用程序中运行它的所有代码。

我发现这很好，因为我可以解析出我从服务器发送的消息，并向用户显示友好的消息，而不需要stacktrace…

1
2
3
4
5
6

error: function (response) {
var r = jQuery.parseJSON(response.responseText);
alert("Message:" + r.Message);
alert("StackTrace:" + r.StackTrace);
alert("ExceptionType:" + r.ExceptionType);
}

这可能是由于JSON字段名没有引号造成的。

将JSON结构从:

1
2
3
4
5

{welcome:"Welcome
<div class="suo-content">[collapse title=""]<ul><li>这应该无关紧要，除非键是JS中的保留字。我不认为这是问题所在。</li><li>JSON.stringify({欢迎:"欢迎"})- - >{"欢迎":"欢迎"}</li></ul>[/collapse]</div><hr><p>[cc] error:function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(thrownError);
}

在代码错误中，ajax请求捕获客户机到服务器之间的错误连接如果要显示应用程序的错误消息，请在成功范围内发送

如

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

success: function(data){
// data is object send form server
// property of data
// status type boolean
// msg type string
// result type string
if(data.status){ // true not error
$('#api_text').val(data.result);
}
else
{
$('#error_text').val(data.msg);
}

}

我相信Ajax响应处理程序使用HTTP状态代码来检查是否有错误。

因此，如果您只是在服务器端代码上抛出一个Java异常，但是HTTP响应没有500个状态代码jQuery(或者在本例中可能是XMLHttpRequest对象)，那么它只会假定一切正常。

我这样说是因为我在ASP中遇到过类似的问题。我抛出了一个ArgumentException之类的东西("不知道该做什么……")，但是错误处理程序没有触发。

然后，无论是否有错误，我都将Response.StatusCode设置为500或200。

jQuery。parseJSON对于成功和错误都很有用。

1
2
3
4
5
6
7
8
9
10

$.ajax({
url:"controller/action",
type: 'POST',
success: function (data, textStatus, jqXHR) {
var obj = jQuery.parseJSON(jqXHR.responseText);
notify(data.toString());
notify(textStatus.toString());
},
error: function (data, textStatus, jqXHR) { notify(textStatus); }
});

在xhr对象中抛出异常的JSON对象。只使用

1	alert(xhr.responseJSON.Message);

JSON对象公开了另外两个属性:"ExceptionType"和"StackTrace"

1
2
3
4
5

$("#save").click(function(){
$("#save").ajaxError(function(event,xhr,settings,error){
$(this).html{'error: ' (xhr ?xhr.status : '')+ ' ' + (error ? error:'unknown') + 'page: '+settings.url);
});
});

使用以下命令在服务器上抛出一个新的异常:

响应。StatusCode = 500

响应。StatusDescription = ex.Message ()

我相信StatusDescription会返回给Ajax调用…

例子:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

Try

Dim file As String = Request.QueryString("file")

If String.IsNullOrEmpty(file) Then Throw New Exception("File does not exist")

Dim sTmpFolder As String ="Temp" & Session.SessionID.ToString()

sTmpFolder = IO.Path.Combine(Request.PhysicalApplicationPath(), sTmpFolder)

file = IO.Path.Combine(sTmpFolder, file)

If IO.File.Exists(file) Then

IO.File.Delete(file)

End If

Catch ex As Exception

Response.StatusCode = 500

Response.StatusDescription = ex.Message()

End Try

Although it has been many years since this question is asked, I still don't find xhr.responseText as the answer I was looking for. It returned me string in the following format:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

"{"error":true,"message":"The user name or password is incorrect
<hr>< pre > <代码> $ (" # fmlogin")。submit(函数(){$ (" # fmlogin") .ajaxError(函数(事件、xhr设置,错误){$(" #加载").fadeOut("快");$ (" # showdata") .fadeIn("慢");$ (" # showdata")。html('错误，请稍后重试或重新加载页面。原因:' + xhr.status ');setTimeout(函数(){$ (" # showdata") .fadeOut({"不透明度":"0 n <hr><p>这个函数基本上生成唯一的随机API键，如果没有生成，则弹出带有错误消息的对话框</P><p>在页面视图:</P>[cc]
<label class="col-sm-2 control-label" for="input-storename"><?php echo $entry_storename; ?></label>

<input type="text" class="apivalue" id="api_text" readonly name="API" value="<?php echo strtoupper(substr(md5(rand().microtime()), 0, 12)); ?>" class="form-control" />
<button type="button" class="changeKey1" value="Refresh">Re-Generate</button>

<script>
$(document).ready(function(){
$('.changeKey1').click(function(){
debugger;
$.ajax({
url :"index.php?route=account/apiaccess/regenerate",
type :'POST',
dataType:"json",
async:false,
contentType:"application/json; charset=utf-8",
success: function(data){
var result = data.sync_id.toUpperCase();
if(result){
$('#api_text').val(result);
}
debugger;
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError +"

" + xhr.statusText +"

" + xhr.responseText);
}

});
});
});
</script>

从控制器:

1
2
3
4
5
6
7
8

public function regenerate(){
$json = array();
$api_key = substr(md5(rand(0,100).microtime()), 0, 12);
$json['sync_id'] = $api_key;
$json['message'] = 'Successfully API Generated';
$this->response->addHeader('Content-Type: application/json');
$this->response->setOutput(json_encode($json));
}

可选回调参数指定在load()方法完成时要运行的回调函数。回调函数可以有不同的参数:

Type: Function( jqXHR jqXHR, String textStatus, String errorThrown )

如果请求失败，将调用的函数。该函数接收三个参数:jqXHR(在jQuery 1.4中)。对象，描述发生的错误类型的字符串，如果发生了异常，则为可选异常对象。第二个参数(除了null)的可能值是"timeout"、"error"、"abort"和"parsererror"。当HTTP错误发生时，errorthrow接收HTTP状态的文本部分，例如"未找到"或"内部服务器错误"。从jQuery 1.5开始，错误设置可以接受一个函数数组。每个函数将依次调用。注意:跨域脚本和跨域JSONP请求不调用此处理程序。

首先，我们需要在web.config中设置:

1
2
3
4
5
6

除了jquery级别的错误部分，你还需要解析包含异常的错误响应，比如:

1
2
3

.error(function (response, q, t) {
var r = jQuery.parseJSON(response.responseText);
});

然后使用r。您可以实际显示异常文本。

检查完整的代码:http://www.codegateway.com/2012/04/jquery-ajax-hand-exception -throw -by.html