Question

I’m having trouble retrieving JSONP data from one of my sites. On Site A data is being provided by the following MVC2 controller action:

public JsonResult JsonList(string key) {
    var consultants = rep.FindAll().Where(c => c.IsActive).Select(c => new ConsultantJsonItem { Firstname = c.Firstname, Surname = c.Surname });

    return Json(consultants, "application/json");
}

On Site B, I’m using jQuery to retrieve the JSON, like this:

$.ajax({
    url: 'http://www.siteA.com/controller/jsonaction/',
    dataType: 'JSONP',
    crossDomain: true,
    success: function (json) {
        alert("success"); // THIS DISPLAYS
        alert(json); // THIS IS ALWAYS EMPTY
    },
    error: function (xhr, status, error) {
        alert(status); // NOT CALLED
    }
});

I can see in the Firebug console that the response completed correctly with a 200 code, and I can see that the content length of the response is 11516 bytes, yet the response tab is completely empty and jQuery will not give me any data to work with.

Can anyone tell me why this is?

Note: This site is using jQuery 1.4.2

Answer 1

You are returning JSON which is not the same as JSONP:

return Json(consultants, "application/json");

The fact that you set dataType: 'JSONP' on the client is only half of the work that you need to do. The second half is on the server.

Checkout the following answer which illustrates how you could create a custom JsonpResult which will use the callback query string parameter to wrap the response into JSONP.

So:

public class JsonpResult : ActionResult
{
    private readonly object _obj;

    public JsonpResult(object obj)
    {
        _obj = obj;
    }

    public override void ExecuteResult(ControllerContext context)
    {
        var serializer = new JavaScriptSerializer();
        var callbackname = context.HttpContext.Request["callback"];
        var jsonp = string.Format("{0}({1})", callbackname, serializer.Serialize(_obj));
        var response = context.HttpContext.Response;
        response.ContentType = "application/json";
        response.Write(jsonp);
    }
}

and then:

public ActionResult JsonList(string key) 
{
    var consultants = rep.FindAll().Where(c => c.IsActive).Select(c => new ConsultantJsonItem { Firstname = c.Firstname, Surname = c.Surname });
    return new JsonpResult(consultants);
}

and on the client:

$.ajax({
    url: 'http://www.siteA.com/controller/jsonaction/',
    jsonp: 'callback',
    dataType: 'jsonp',
    success: function (json) {
        alert(json);
    }
});