How do I handle jQuery $.getJSON error responses when using JSONP?

Question

I have a RESTful app that returns HTTP 400 with an JSON-encoded reponse body when it encounters application errors:

Request URL:    http://.../middleware.php/entity/23.json?padding=jQuery20305847647329799524_1380182255277&_=1380182255278
Request Method: GET
Status Code:    HTTP/1.1 400 Bad Request

Server: Apache/2.2.14 (Ubuntu)
Date:   Thu, 26 Sep 2013 07:57:36 GMT
Content-Type:   application/json
Content-Length: 133

Response body is valid JSONP according to FF:

jQuery20305847647329799524_1380182255277({"version":"0.2","exception":{"message":"Invalid UUID: '23'","type":"Exception","code":0}});

I'm trying to handle the failure:

$.getJSON("http://demo.volkszaehler.org/middleware.php/entity/23.json?padding=?").fail(
    function(jqXHR, textStatus, errorThrown) { 
        console.error(JSON.stringify(jqXHR));
        console.error(jqXHR.responseText);
    }
);

Unfortunately, the jqXHR has only the following properties, both on FF25 and Chrome:

{"readyState":4,"status":404,"statusText":"error"}

The responseText itself shows as "" and I'm unable to decode the action JSON response body.

How can the actual JSON response body be parsed in the fail() method?

Note: I've seen How do I catch jQuery $.getJSON (or $.ajax with datatype set to 'jsonp') error when using JSONP? but it seems to relate to catching the error at all, not about handling the error responses content.

I also find it consusing that jqXHR's status is 404 instead of 400... — andig
– andig, Commented Sep 26, 2013 at 8:10
JSONP is nothing else than dynamically including a <script> element. I assume if you set a response code other than 200, the script won't be executed by the browser. I don't think there is a solution other than changing the response code, at least for JSONP requests. — Felix Kling
– Felix Kling, Commented Sep 26, 2013 at 8:14
Well- worst case I could always "eval" the script myself, but I don't even get the responseBody which should contain the script?! — andig
– andig, Commented Sep 26, 2013 at 8:37
As I said, JSONP is not a normal Ajax request. It works by simply adding a <script> element to the document and the browser downloads and executes the script. You don't have access to the actual request object. jQuery just provides a simplified version of the request object for consistency. — Felix Kling
– Felix Kling, Commented Sep 26, 2013 at 9:01
In any case jQuery gets 'data' back from the server. Where is that data? Why isn't even responseText returned, if not parsed as JSON? — andig
– andig, Commented Sep 26, 2013 at 9:03

andig · Accepted Answer · 2013-09-28 09:55:51Z

3

Answer (with help of @Felix Kling):

JSONP responses cannot bet received if JSONP server returns HTTP 400 status.

Explanation:

JSONP works by making the client include a remote (server-side) Javascript that produces the desired JSON response when being executed on the client side. In case of HTTP 400 the script never gets executed on client side.

Workarounds:

Always return JSONP error messages/ exceptions with HTTP 200 OK, or
Use Cross-Origin Resource Sharing (CORS). When using jQuery on the client, the simplest way to enable CORS is to set an additional Access-Control-Allow-Origin: * header on the server.

For further reading on CORS see http://docs.kendoui.com/howto/use-cors-with-all-modern-browsers and http://www.html5rocks.com/en/tutorials/cors/?redirect_from_locale=de#toc-cors-from-jquery

answered Sep 28, 2013 at 9:55

andig

14k16 gold badges70 silver badges116 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How do I handle jQuery $.getJSON error responses when using JSONP?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related