Search code examples
jsonjquerycross-domainjsonpparse-error

Ajax call throws parse error


I am getting a parse error when trying to perform the following call:

       $.ajax({
        cache: true,
        url: "http://localhost:3000/app/test/result1",
        data: "{}",
        type: "GET",
        jsonpCallback: "testCall",
        contentType: "application/jsonp; charset=utf-8",
        dataType: "jsonp",
        error: function (xhr, status, error) {
            alert(error);
        },
        success: function (result) {
            alert(result);
        },
        complete: function (request, textStatus) {
            alert(request.responseText);
            alert(textStatus);
        }
    });               

If I paste the request url in the browser address bar directly, the result returned is seems to be valid JSON:

    {
      "name": "The Name",
      "description": "The Description"
    }

I am using IISnode, NodeJs & Express JS. I have tested both scenarios:

    // NODE JS CODE

    var app = express(); 

    app.get('/app/test/result1', function (req, res) {
    res.send({ name: "The Name", description: "The Description" });
    });

    app.get('/app/test/result2', function (req, res) {
    res.send(JSON.stringify({ name: "The Name", description: "the Description" }));
    });

Any advice is appreciated, thanks in advance.


Solution

  • Your dataType is listed as jsonp. However, your response from node.js is not a properly formatted JSON-P response. JSON-P responses need to be wrapped in a callback, like so:

    testCall({ name: "The Name", description: "The Description" });
    

    The node.js code would look something like this:

    res.send(
        'testCall(' + 
        JSON.stringify({ name: "The Name", description: "the Description" }) +
        ');'
    );
    

    (Also note that you don't need the data: "{}" line since the request is a GET request and doesn't include any data. It shouldn't hurt anything, but might be nice to remove to avoid confusion).