2009-05-11 2 views
10

저는 ASP.Net MVC를 사용하고 있습니다. 그러나 이것은 모든 프레임 워크에 적용됩니다.jQuery AJAX 및 다른 dataTypes 처리

대부분의 경우 보통의 HTML을 반환하는 Ajax 호출을 내 서버에 보내지 만 오류가 발생하면 상태 메시지가있는 JSON 객체를 반환하고 싶습니다. 다른 것들). jQuery 호출에서 dataType 옵션을 사용하여이 작업을 처리 할 수있는 방법이없는 것 같습니다. 기본적으로 모든 것을 html로 구문 분석하여 "{ status: 'error', message: 'something bad happened'}"으로 채워진 <div>으로 이어지는 것으로 보입니다.

[편집] dataType 개체를 무시하고 jQuery가 알아낼 수 있도록합니다. 결과의 유형을 string으로보고 HTML로 처리합니다.

내가 한 가지 해결책은 결과 개체를 JSON으로 구문 분석하려고하는 것입니다. 작동한다면 JSON 객체라는 것을 알게됩니다. 예외를 throw하는 경우는 HTML입니다 : 그러나

$.ajax({ 
    data: {}, 
    success: function(data, textStatus) { 
     try { 
      var errorObj = JSON.parse(data); 
      handleError(errorObj); 
     } catch(ex) { 
      $('#results').html(data); 
     } 
    }, 
    dataType: 'html', // sometimes it is 'json' :-/ 
    url: '/home/AjaxTest', 
    type: 'POST' 
}); 

, 그 방법으로 예외를 사용하는 나 같은 아주 나쁜 디자인 (그리고 적어도 말을 직관적)을 친다. 더 좋은 방법이 있습니까? JSON 객체에서 전체 응답을 래핑하는 방법을 생각했지만,이 상황에서는 옵션이라고 생각하지 않습니다.

// ASP.NET MVC Action: 
[AcceptVerbs(HttpVerbs.Post)] 
public ActionResult AjaxTest(int magic) { 
    try { 
     var someVal = GetValue(); 
     return PartialView("DataPage", someVal); 
    } catch (Exception ex) { 
     this.HttpContext.Response.StatusCode = 500; 
     return Json(new { status = "Error", message = ex.Message }); 
    } 
} 




// jQuery call: 

$.ajax({ 
    data: {}, 
    success: function(data, textStatus) { 
     $('#results').html(data); 
    }, 
    error: function() { 
     var errorObj = JSON.parse(XMLHttpRequest.responseText); 
     handleError(errorObj); 
    }, 
    dataType: 'html', 
    url: '/home/AjaxTest', 
    type: 'POST' 
}); 
+0

흠, 흥미로운 상황,하지만 서로 다른 형태를 돌려주는 방법을 가진 경우 모르겠어요은 좋은 생각이다 상태 메시지를 반환하는 다른 메서드를 호출하십시오. –

답변

9

JSON 오류의 경우 200보다 서버에서 500 상태 코드를 반환 할 수 있습니다. 그러면 jquery 클라이언트 코드는 오류 처리를 위해 $ .ajax 함수에서 오류 : 처리기를 사용할 수 있습니다. 500 응답에서 JSON 오류 객체를 responseText에서 파싱 할 수 있습니다. 200 응답에서 정상적으로 div에서 HTML을 무시할 수 있습니다.

+0

허. 좋은 생각이야. –

+0

환상적. 나는 치명적인 실패 이외의 것을 위해 500을 사용하는 것에 대해 조금주의를 기울이지 만 여기서는 여전히 최선의 선택이라고 생각한다. 게시물을 편집하여 코드를 보여 드리겠습니다. – swilliams

+3

반품 400 (잘못된 요청)은 500보다 좋을 수 있습니다. –

6

스티브의 생각은 좋은 일이지만, 나는 완전성이을에 추가 해요 :

여기에 스티브 Willcock에서받은 솔루션입니다.

json의 dataType을 지정했지만 HTML을 반환하면 jQuery가 정상적으로 처리하는 것처럼 보입니다.

if($_GET['type'] == 'json') { 
    header('Content-type: application/json'); 
    print '{"test":"hi"}'; 
    exit; 
} else { 
    header('Content-type: text/html'); 
    print '<html><body><b>Test</b></body></html>'; 
    exit; 
} 

$_GET['type'] 그냥 내가 테스트하는 동안 돌아 제어 할 수 있습니다 :

나는 다음 코드로이 이론을 테스트했다. 상황이 옳은지 잘못되었는지에 따라 당신은 하나 또는 다른 것을 반환 할 것입니다. 그 과거,이 jQuery 코드와 : 우리는 데이터 형 JSON을 지정하더라도
$.ajax({ 
    url: 'php.php?type=html', // return HTML in this test 
    dataType: 'json', 
    success: function(d) { 
     console.log(typeof d); // 'xml' 
    } 
}); 

는 jQuery를 (1.3.2)이 아니 그 것을 이해한다.

$.ajax({ 
    url: 'php.php?type=json', 
    dataType: 'json', 
    success: function(d) { 
     console.log(typeof d); // 'object' 
    } 
}); 

이렇게하면 문서화되지 않은 행동을 통해 원하는대로 할 수 있습니다.

+0

이것은 ASP.Net MVC의 함수 일 수 있지만 typeof 데이터는 HTML 및 JSON 결과 모두에 대해 '문자열'을 나타내고 있으므로 HTML로 핸들을 가져옵니다. – swilliams

+0

mm. 일초. –

+0

ASP.NET이 ASP.NET MVC에서 가져 오는 응답은 오류로 구문 분석됩니다. jQuery에서 error() 콜백을 처리하면 ... 작동하는 HTML을 얻을 수 있지만 예외 처리 코드처럼 "올바르게"보이지 않습니다. 내가 PHP를 사용했다면 이것은 분명히 유효한 해결책 일 것입니다. – swilliams

3

POST에서 상태 (성공 또는 오류)에 관계없이 JSON 만 반환하고 결과를 표시하려면 GET을 사용하십시오.
당신이 나에게 묻는다면 그것은 더 좋은 접근법처럼 보입니다.

0

또는 항상 JSON 응답을 반환하고 하나의 매개 변수를 HTML 콘텐츠로 사용할 수 있습니다.같은

뭔가 :

{ 
    "success" : true, 
    "errormessage" : "", 
    "html" : "<div>blah</div>", 
} 

난 당신 만 HTML 값에 따옴표를 탈출해야 거라고 생각하고, JSON 파서는 당신을 위해 취소합니다.

+0

불행히도 매우 빨리 복잡해집니다. – swilliams

0

MVC/Ajax/JQuery에서 똑같은 문제가 발생하여 여러 데이터 유형 (JSON 및 HTML)을 사용하고 싶습니다. HTML 데이터 유형을 사용하여 데이터를 반환하라는 AJAX 요청이 있지만 AJAX 요청에서 되돌아 오는 데이터를 JSON 객체로 변환하려고 시도합니다. 나는 나의 성공 콜백에서 호출이이 같은 기능을 가지고 :

_tryParseJson: function (data) { 
     var jsonObject; 

     try { 
      jsonObject = jQuery.parseJSON(data); 
     } 
     catch (err) { 
     } 

     return jsonObject; 
    } 

내가 다음 된 JSONObject 및 ERRORMESSAGE 속성이 존재하는 경우, 에러가 발생한 것을, 그렇지 않으면 오류가 발생하지 않은 것으로 가정합니다.

0

나는 ajax 성공 및 오류 콜백 만 사용하여이 작업을 수행했다. 이 방법으로 서버에서 문자열과 json 객체의 응답을 혼합 할 수 있습니다.

이하 json을 수락 할 준비가되었지만 "parsererror"상태 (jquery가 json으로 들어오는 코드를 json으로 구문 분석 할 수 없다는 의미입니다.)가 요청 상태이므로 "OK"(200)를 입력하면 응답이 문자열로 처리됩니다. "parsererror"와 "OK"이외의 다른 것, 나는 오류로 처리합니다. 어쩌면 당신은 첫 번째 방법은 부울을 반환해야하고 $ 아약스 콜백을 수행 할 수 있습니다 -

$.ajax({ 
    dataType: 'json', 
    url: '/ajax/test', 
    success: function (resp) { 
     // your response json object, see if status was set to error 
     if (resp.status == 'error') { 
     // log the detail error for the dev, and show the user a fail 
     console.log(resp); 
     $('#results').html('error occurred'); 
     } 
     // you could handle other cases here 
     // or use a switch statement on the status value 
    }, 
    error: function(request, status, error) { 
     // if json parse error and a 200 response, we expect this is our string 
     if(status == "parsererror" && request.statusText == "OK") { 
     $('#results').html(request.responseText); 
     } else { 
     // again an error, but now more detailed and not a parser error 
     // and we'll log for dev and show the user a fail 
     console.log(status + ": " + error.message); 
     $('#results').html('error occurred'); 
     } 
    } 
    });