jsonp简介

Posted 2020-09-19 a14907

jsonp主要是利用script的跨域。简单点说就是像img，css,js这样的文件是跨域的，这也就是为什么我们能够利用cdn进行加速的原因。而且像js这样的文件，如果里面是一个自执行的代码，比如：

(function(){
    alert(22);
})();

那么请求之后就会弹出alert对话框。

那么如果我们有个全局函数：

function showdata(data){
    console.log(data);      
}

而且返回的js里有这样的代码：

showdata({"name":"a14907"});

那么我们就可以在控制台显示数据。同理可以自定义数据的处理方式。

这就是jsonp了。

 

jquery帮我们封装了jsonp的使用方式：

 $.ajax({
             type: "get",
             async: false,
             url: "http://flightQuery.com/jsonp/flightResult.aspx?code=CA1998",
             dataType: "jsonp",
             jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(一般默认为:callback)
             jsonpCallback:"flightHandler",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也可以写"?"，jQuery会自动为你处理数据
             success: function(json){
                 console.log(json);
             },
             error: function(){
                 alert(‘fail‘);
             }
         });