如何读取从JSNOP jQuery.ajax返回的数据

Question

我设置了非常简单的php页面，返回从mysql中提取的行。在localhost上，我的jquery页面是

 $.ajax({
        url: "http://abcd.com/cccbsapp/test.php",

        // Tell jQuery we're expecting JSONP
        dataType: "jsonp",

        complete:function(data){
            console.log(data)
        }           
    })

但是console.log显示

我无法获取我的php页面返回的实际JSON数组。但控制台/网络选项卡显示返回的数据。

所以我知道数据是从远程服务器返回的，但我怎样才能在$ .ajax中获取它。

当我使用dataType：＆＃34; JSON＆＃34;时，它会给出CORS错误，所以我使用的是JSNOP。我对此并不十分熟悉。

Answer 1

这里的问题是，为了使用JSONP，服务器需要以特殊方式回复，而不仅仅是以JSON格式打印数据。

使用jsonp时，jQuery会向URL中的callback=someFunctionName发送请求。在这种情况下，服务器响应应为

someFunctionName(HERE THE DATA)

此外，complete回调作为第一个参数始终是jqXHR对象，而不是返回的数据，因为jQuery在请求成功和错误方案中都调用了complete。最好使用success回调来获取数据，并使用error来处理错误，甚至使用Promise接口（.done()和.fail()方法）。

$.ajax({
    url: "http://abcd.com/cccbsapp/test.php",
    // Tell jQuery we're expecting JSONP
    dataType: "jsonp"           
}).done(function (data) {
    console.log(data);
}).fail(function () {
    console.log("An error occured");
});

作为使用JSONP的替代方法，您可以坚持正常的JSON请求。要使Cross-Origin请求有效，服务器需要在响应中包含Access-Control-Allow-Origin标头，例如

header('Access-Control-Allow-Origin: *');

（而不是*您可以列出允许查询此API的域名）