失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > ajax jsonp跨域访问 jquery ajax怎么使用jsonp跨域访问

ajax jsonp跨域访问 jquery ajax怎么使用jsonp跨域访问

时间:2023-02-09 14:28:50

相关推荐

ajax jsonp跨域访问 jquery ajax怎么使用jsonp跨域访问

在项目中使用接口的比较多,在客户端跨域访问,jquery中只能使用jquery ajax的jsonp方法。

值得注意的是,jQuery.ajax()只支持get方式的跨域,post的方式是不支持的。

//简写形式

$.getJSON("/index.php?callback=?",

function(data){

$("#show").text(data)

});

//完整形式

$.ajax({

async:false,

url:'/index.php?callback=?',//跨域URLcallback参数必填

type:'GET',

dataType:'jsonp',

jsonp:'jsoncallback',//默认callback

data:mydata,//请求数据

timeout:5000,

beforeSend:function(){//jsonp方式此方法不被触发。原因可能是dataType如果指定为jsonp的话,就已经不是ajax事件了

},

success:function(json){//客户端jquery预先定义好的callback函数,成功获取跨域服务器上的json数据后,会动态执行这个callback函数

if(json.length!=0){

alert(json.actionErrors);

}

},

error:function(xhr){

//jsonp方式此方法不被触发

//请求出错处理

alert("请求出错(请检查相关度网络状况.)");

}

});

这种方式其实是上例$.ajax({..}) 的一种高级封装。

在服务端通过获得callback参数(如:jsonpcallback)得到jQuery端随后要回调的,

然后返回类似:"jsonpcallback("+要返回的json数组+")";

jquery就会通过回调方法动态加载调用这个:jsonpcallback(json数组);

如果为jQuery默认,则为随机jsonp1356493334400之类的数据。这样就达到了跨域数据交换的目的。

JSONP是一种脚本注入(Script Injection)行为,所以也有一定的安全隐患。

注意:jquey是不支持post方式跨域的。

如果觉得《ajax jsonp跨域访问 jquery ajax怎么使用jsonp跨域访问》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。