javascript - 尝试使用jsonp 解决ajax 跨域解决-PHP中文网问答

在服务器端，有一个txt文件，里面保存的是json格式的数据，如下所示：
{
"issingle": false,
"bgpicwidth": 360,
。。。
}

使用ajax获取文件的时候，会报错。

尝试使用jsonp解决问题，做出的改动如下：
服务端的txt文件修改如下：
CallBack({
"issingle": false,
"bgpicwidth": 360,
。。。
})

js代码如下：

function CallBack(data){
    alert(data.issingle);
}

var url = 'http://api.XXX.com/603/arealist_jsonp.txt?callback=CallBack';
function area_test_jsonp(){
    $.ajax({
        url: url,
        dataType: 'jsonp',
        processData: false,
        type: 'get',
        success: function(data) {
            alert('ok');
            alert(data);
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            alert('error');
            alert(XMLHttpRequest.status);
            alert(XMLHttpRequest.readyState);
            alert(textStatus);
        }
    });
    return false;
}

结果虽然可以通过CallBack获取数据，但还是会报错，执行area_test_jsonp中error的部分，XMLHttpRequest.status为200，XMLHttpRequest.readyState为4，textStatus为parsererror。

求指教，多谢。

全部回复(2)

巴扎黑2017-04-10 13:14:58 2楼

用jquery+jsonp的话，服务端要使用动态语言（例如php）获取请求的callback参数获取回调函数的名称，然后返回结果，例如php的

$jsondata = '{
"issingle": false,
"bgpicwidth": 360,
。。。
})';
echo $_GET['callback'].'('.$jsondata.')';

也就是说让jquery完成整个解析的过程，然后你在

success: function(data) {
    // 使用你定义的回调内容
    CallBack(data);
}

这时，CallBack拿到的是js object

或者你可以用jQuery.getScript的方式调用你服务端的静态脚本内容，这时CallBack拿到的是js string，然后你自己解析

赞 +0

添加回复

伊谢尔伦2017-04-10 13:14:58 1楼

jQuery.ajax 不是这么用的吧，见文档：

"jsonp": Loads in a JSON block using JSONP. Adds an extra "?callback=?" to the end of your URL to specify the callback. Disables caching by appending a query string parameter, "_=[TIMESTAMP]", to the URL unless the cache option is set to true.