jsonp原理和jquey jsonp原理实践

 

$.ajax({
    type: "get",
    async: false,
    url: "ajax.htm",
    dataType: "jsonp",
    jsonp: "callback",
    //传到服务器端参数名，需要协商一致
    jsonpCallback: "callbackFunction",
    //传到服务器端参数值，需要协商一致
    success: function(jsonData) {
        alert(jsonData);
        alert(jsonData[0].name);
    }
});

 

总结：

1、最终组装出来：<script>http://ajax.htm?callback=callbackFunction</script>
2、callback和callbackFunction两名字定义要跟服务器或跨域端协商好。callback=callbackFunction传给服务器，服务器接收后将数据提供给callbackFunction(data:服务器提供的数据)，

最后以js的形式返回给客户端，客户端接收后也有这个callbackFunction的函数就立即执行。这样服务器给的数据就得到利用，最后得到想要的效果。这就是JSONP的原理所在。
3、callbackFunction函数要再本地定义好。服务器或跨域端负责调用这函数同时向这函数传数据callbackFunction({name:'lisi',age:'20'})。
4、callbackFunction方法调用success(data),对数据进行处理。
5、本地方法：
function callbackFunction(data){
success(data);
}