IT story

아약스 요청에 대해 "파서 오류"를 반환하는 jQuery

hot-time 2020. 5. 26. 07:47
반응형

아약스 요청에 대해 "파서 오류"를 반환하는 jQuery


Ajax 요청에 대해 jquery에서 "parsererror"를 얻은 후 POST를 GET으로 변경하여 몇 가지 다른 방식으로 데이터를 반환하려고 시도했지만 (클래스 생성 등) 문제가 무엇인지 파악할 수 없습니다.

내 프로젝트는 MVC3에 있으며 jQuery 1.5를 사용하고 있습니다. 드롭 다운이 있고 onchange 이벤트에서 선택한 항목을 기반으로 데이터를 가져 오기 위해 호출을 시작합니다.

드롭 다운 : (이것은 Viewbag의 목록에서 "Views"를로드하고 이벤트가 정상적으로 작동합니다)

@{
    var viewHtmls = new Dictionary<string, object>();
    viewHtmls.Add("data-bind", "value: ViewID");
    viewHtmls.Add("onchange", "javascript:PageModel.LoadViewContentNames()");
}
@Html.DropDownList("view", (List<SelectListItem>)ViewBag.Views, viewHtmls)

자바 스크립트 :

this.LoadViewContentNames = function () {
    $.ajax({
        url: '/Admin/Ajax/GetViewContentNames',
        type: 'POST',
        dataType: 'json',
        data: { viewID: $("#view").val() },
        success: function (data) {
            alert(data);
        },
        error: function (data) {
            debugger;
            alert("Error");
        }
    });
};

위의 코드는 MVC 메서드를 성공적으로 호출하고 다음을 반환합니다.

[{"ViewContentID":1,"Name":"TopContent","Note":"Content on the top"},
 {"ViewContentID":2,"Name":"BottomContent","Note":"Content on the bottom"}]

그러나 jquery는 "parsererror"라는 $ .ajax () 메소드에 대한 오류 이벤트를 발생시킵니다.


최근 에이 문제가 발생 하여이 질문에 걸려 들었습니다.

훨씬 쉬운 방법으로 해결했습니다.

방법 1

dataType: 'json'객체 리터럴에서 속성을 제거 할 수 있습니다 ...

방법 2

또는 데이터를로 반환하여 @Sagiv가 말한 것을 수행 할 수 있습니다 Json.


parsererror메시지가 나타나는 이유 는 단순히 문자열이나 다른 값을 반환 할 때 실제로 그렇지 않기 Json때문에 구문 분석시 구문 분석기가 실패하기 때문입니다.

따라서 dataType: json속성 을 제거하면 속성을로 구문 분석하지 않습니다 Json.

다른 방법으로 데이터를로 반환 Json하면 파서는 데이터를 올바르게 처리하는 방법을 알게됩니다.


문제를 처리하는 올바른 방법은 @ david-east 답변참조하십시오.

이 답변은 파일 : 프로토콜을 사용할 때 jQuery 1.5버그 에만 해당됩니다 .

jQuery 1.5로 업그레이드 할 때 최근에 비슷한 문제가 발생했습니다. 올바른 응답을 얻음에도 불구하고 오류 처리기가 시작되었습니다. complete이벤트 를 사용 하고 상태 값을 확인 하여 문제를 해결했습니다 . 예 :

complete: function (xhr, status) {
    if (status === 'error' || !xhr.responseText) {
        handleError();
    }
    else {
        var data = xhr.responseText;
        //...
    }
}

ajax 호출 응답 dataType 을 다음과 같이 지정 했습니다.

'json'

실제 아약스 응답이 유효한 JSON이 아니기 때문에 JSON 파서에서 오류가 발생합니다.

내가 권장하는 가장 좋은 방법은 dataType 을 다음과 같이 변경하는 것입니다.

'본문'

성공 콜백 내에서 유효한 JSON이 반환되는지 여부를 확인하고 JSON 유효성 검사에 실패하면 화면에 경고하여 실제로 ajax 호출이 어떤 목적으로 실패하는지 알 수 있습니다. 이것 좀 봐 :

$.ajax({
    url: '/Admin/Ajax/GetViewContentNames',
    type: 'POST',
    dataType: 'text',
    data: {viewID: $("#view").val()},
    success: function (data) {
        try {
            var output = JSON.parse(data);
            alert(output);
        } catch (e) {
            alert("Output is not valid JSON: " + data);
        }
    }, error: function (request, error) {
        alert("AJAX Call Error: " + error);
    }
});

문제는 컨트롤러가 구문 분석 할 수없는 문자열이나 다른 객체를 반환한다는 것입니다. ajax 호출은 Json을 반환 할 것으로 예상됩니다. 컨트롤러에서 JsonResult를 다음과 같이 반환하십시오.

 public JsonResult YourAction()
    {
        ...return Json(YourReturnObject);

    }

그것이 도움이되기를 바랍니다 :)


JSON 데이터가 잘못되었을 수 있습니다. http://jsonformatter.curiousconcept.com/ 을 확인하십시오.


제거 할 제안이 많이 있습니다

dataType: "json"

이것이 효과가 있음을 인정하지만 근본적인 문제는 무시하고 있습니다. 리턴 문자열이 실제로 JSON이라고 확신하는 경우 응답 시작시 잘못된 공백을 찾으십시오. 피들러에서 살펴보십시오. 광산은 다음과 같습니다.

Connection: Keep-Alive
Content-Type: application/json; charset=utf-8

{"type":"scan","data":{"image":".\/output\/ou...

필자의 경우 이것은 PHP가 원하지 않는 문자 (이 경우 UTF 파일 BOM)를 뿜어내는 문제입니다. 이것을 제거하면 문제를 해결하면서도 문제를 해결했습니다.

dataType: json

Make sure that you remove any debug code or anything else that might be outputting unintended information. Somewhat obvious, but easy to forgot in the moment.


I don't know if this is still actual but problem was with Encoding. Changing to ANSI resolved the problem for me.


If you get this problem using HTTP GET in IE I solved this issue by setting the cache: false. As I used the same url for both HTML and json requests it hit the cache instead of doing a json call.

$.ajax({
    url: '/Test/Something/',
    type: 'GET',
    dataType: 'json',
    cache: false,
    data: { viewID: $("#view").val() },
    success: function (data) {
        alert(data);
    },
    error: function (data) {
        debugger;
        alert("Error");
    }
});

you should remove the dataType: "json". Then see the magic... the reason of doing such thing is that you are converting json object to simple string.. so json parser is not able to parse that string due to not being a json object.

this.LoadViewContentNames = function () {
$.ajax({
    url: '/Admin/Ajax/GetViewContentNames',
    type: 'POST',
    data: { viewID: $("#view").val() },
    success: function (data) {
        alert(data);
    },
    error: function (data) {
        debugger;
        alert("Error");
    }
 });
};

incase of Get operation from web .net mvc/api, make sure you are allow get

     return Json(data,JsonRequestBehavior.AllowGet);

I was also getting "Request return with error:parsererror." in the javascript console. In my case it wasn´t a matter of Json, but I had to pass to the view text area a valid encoding.

  String encodedString = getEncodedString(text, encoding);
  view.setTextAreaContent(encodedString);

I have encountered such error but after modifying my response before sending it to the client it worked fine.

//Server side
response = JSON.stringify('{"status": {"code": 200},"result": '+ JSON.stringify(result)+'}');
res.send(response);  // Sending to client

//Client side
success: function(res, status) {
    response = JSON.parse(res); // Getting as expected
    //Do something
}

I had the same problem, turned out my web.config was not the same with my teammates. So please check your web.config.

Hope this helps someone.


The problem

window.JSON.parse raises an error in $.parseJSON function.

<pre>
$.parseJSON: function( data ) {
...
// Attempt to parse using the native JSON parser first
if ( window.JSON && window.JSON.parse ) {
return window.JSON.parse( data );
}
...
</pre>

My solution

Overloading JQuery using requirejs tool.

<pre>
define(['jquery', 'jquery.overload'], function() { 
    //Loading jquery.overload
});
</pre>

jquery.overload.js file content

<pre>
define(['jquery'],function ($) { 

    $.parseJSON: function( data ) {
        // Attempt to parse using the native JSON parser first
        /**  THIS RAISES Parsing ERROR
        if ( window.JSON && window.JSON.parse ) {
            return window.JSON.parse( data );
        }
        **/

        if ( data === null ) {
            return data;
        }

        if ( typeof data === "string" ) {

            // Make sure leading/trailing whitespace is removed (IE can't handle it)
            data = $.trim( data );

            if ( data ) {
                // Make sure the incoming data is actual JSON
                // Logic borrowed from http://json.org/json2.js
                if ( rvalidchars.test( data.replace( rvalidescape, "@" )
                    .replace( rvalidtokens, "]" )
                    .replace( rvalidbraces, "")) ) {

                    return ( new Function( "return " + data ) )();
                }
            }
        }

        $.error( "Invalid JSON: " + data );
    }

    return $;

});
</pre>

If you don't want to remove/change dataType: json, you can override jQuery's strict parsing by defining a custom converter:

$.ajax({
    // We're expecting a JSON response...
    dataType: 'json',

    // ...but we need to override jQuery's strict JSON parsing
    converters: {
        'text json': function(result) {
            try {
                // First try to use native browser parsing
                if (typeof JSON === 'object' && typeof JSON.parse === 'function') {
                    return JSON.parse(result);
                } else {
                    // Fallback to jQuery's parser
                    return $.parseJSON(result);
                }
            } catch (e) {
               // Whatever you want as your alternative behavior, goes here.
               // In this example, we send a warning to the console and return 
               // an empty JS object.
               console.log("Warning: Could not parse expected JSON response.");
               return {};
            }
        }
    },

    ...

Using this, you can customize the behavior when the response cannot be parsed as JSON (even if you get an empty response body!)

With this custom converter, .done()/success will be triggered as long as the request was otherwise successful (1xx or 2xx response code).

참고URL : https://stackoverflow.com/questions/5061310/jquery-returning-parsererror-for-ajax-request

반응형