jsonp跨域
js跨域
利用了script src没有同源限制,进行跨域请求。
例如,www.a.com 想请求 www.b.com 的内容
//a网站的请求页: function jsonp(json){ //对返回的json数据的处理}//b网站的jsonp.js 响应页jsonp({'name':'amy',age:22})
要点
a网站定义jsonp的回调处理。
a网站jsonp跨域请求
b网站使用a网站的同名函数处理跨域请求
补充说明
以上便是js的jsonp实现跨域,其实它和ajax的XHR对象并没有任何关系,由于jquery 把jsonp的实现封装在了ajax中,所以jsonp和ajax经常同时被提起.
jquery 跨域
不使用jsonp的ajax请求
$.ajax({ type: "GET", url: "http://www.b.com/jsonp.js" dataType: "json", success: function(data) { //对data的处理 }, error: function(jqXHR){ alert("发生错误:" + jqXHR.status); }, });
如果不使用jsonp会有跨域报错。
使用了jsonp 的请求:
$.ajax({ type: "GET", url: "http://www.b.com/jsonp.js" dataType: "jsonp", jsonp:"callback",//“callback”:任意名字都可以 success: function(data) { //对data的处理 }, error: function(jqXHR){ alert("发生错误:" + jqXHR.status); }, });
服务端的修改
- 加上获取请求的处理:
$jsonp = $_GET["callback"];//callback名字和请求的名字相同
2.返回参数之前加上$jsonp, 并用()将参数括住,以php后端为例:
//原来:$result ='{"success":true,"msg":"找到员工:员工编号:' . $value["number"] .'"}';//改为:$result =$jsonp . '({"success":true,"msg":"找到员工:员工编号:' . $value["number"] .'"})';
ajax的处理把在get请求后追加了callback参数,并给她赋予了参数值,响应值追加了callback的参数值。
局限
jsonp仅支持get请求
另辟蹊径
XHR2(XMLHttpRequest Level 2)
只需在服务器端设置两个参数即可:
header('Access-Control-Allow-Origin:*');//允许跨域请求的域名,允许全部设为*header('Access-Control-Allow-Methods:POST,GET');
关键字:jsonp
版权声明
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符,请点击 举报 进行投诉反馈!