JSONP - Access-Control-Allow-Origin 和 MIME 类型错误答案

【问题标题】：JSONP - Access-Control-Allow-Origin and MIME type errorsJSONP - Access-Control-Allow-Origin 和 MIME 类型错误
【发布时间】：2011-05-12 20:28:49
【问题描述】：

我正在尝试同时创建 jsonp 请求的服务器端和客户端，但我似乎无法使其工作。我查看了许多指南、博客文章等，但几乎每个人都只展示了客户端。

这是我的客户端代码

$.ajax({
    dataType: 'application/json',
    data: params,
    jsonp: 'jsonpCallback',
    url: settings.domain + '/httpext.dll?json_cc',
    success: function (data) {
        //determine the return status
    },
    error: function (response, status, error) {
        //error handling
    }
}); //end ajax

现在，服务器正在返回一个像这样的硬编码值

jsonpCallback({"username":"meltingice","posts"1234});

我的问题是我无法让请求和响应一起工作。目前，响应正在返回 application/json，所以如果我更改我的请求 ro 期望 jsonp 它会出错

资源解释为脚本，但使用 MIME 类型 application/json 传输。未捕获的 ReferenceError：未定义 jsonpCallback

首先，如您所见，我定义了 jsonpCallback。

现在，如果我将 dataType 更改为 application/json，则会收到此错误

XMLHttpRequest cannot load http://myserver/httpext.dll?json_cc&sid=adsfhasjdkfhajksdghjk%3Basdhg&action=SALE&ccCard=&ccNum=&ccExMM=0&ccExYYYY=0&ccCVV2=&holdersName=&totalDue=0&dueDate=11%2F19%2F2010. Origin http://localhost:59905 is not allowed by Access-Control-Allow-Origin.

如您所见，它没有将callback=? 放入网址中。很郁闷。

如何设置服务器端以便可以使用 jsonp 调用它？响应类型需要什么？如何格式化返回的数据，以便我的客户端代码可以拉回数据？

【问题讨论】：

标签： jquery ajax cross-domain jsonp

【解决方案1】：

这不起作用的原因是您的服务器总是返回一个硬编码的方法名称，而您的客户端使用的是匿名的success 处理程序。这行不通。您需要将服务器配置为使用作为参数传递的方法名称，否则它将永远不会在客户端调用 success 回调。因此，一旦您将服务器配置为考虑 jsoncallback 查询参数，您就可以像这样对其进行测试：

$.getJSON(settings.domain + '/httpext.dll?json_cc&jsoncallback=?', params, function(result) {
    alert('success');
});

现在服务器将收到如下所示的请求：

http://foo.com/httpext.dll?json_cc&jsoncallback=jsonp1290183992345

它应该像这样响应：

jsonp1290183992345({"username":"meltingice","posts"1234});

与正确的 Content-Type 以及显然 (application/json)。

【讨论】：

我已更改代码以引入默认回调名称，但我仍然收到其他错误。资源被解释为脚本，但使用 MIME 类型 application/json 传输。

【解决方案2】：

我还想贡献我在 ASP.NET MVC 中使用的这个 sn-p 来处理 jsoncallback。

    private static ActionResult GetContent(object data, string callback)
    {
        if (!string.IsNullOrEmpty(callback))
        {
            ContentResult result = new ContentResult();
            result.ContentType = "application/json";

            JavaScriptSerializer serializer = new JavaScriptSerializer();
            string json = serializer.Serialize(data);
            result.Content = string.Format("{0}({1})", callback, json);
            return result;
        }
        else
        {
            JsonResult result = new JsonResult();
            result.Data = data;
            result.JsonRequestBehavior = JsonRequestBehavior.AllowGet;
            return result;
        }
    }

【讨论】：