js跨域问题,jsonp
最近需要掉一个接口,我的项目,通过js获取同事项目接口的数据;
请看大屏幕,问题出现了,js跨域会被同源策略给弄掉,何为跨域,就是我是一个服务器,别人是一个服务器,这时到网上找到一个解决方案jsonp;
就是带src标签的都可以跨域取东西,如img可以取到其他网页其他图像,还有link,还有script,所以就这样了:
我使用的是jquery,代码贴出,天王盖地虎有图有真相:
remoteurl:地址;
obj.param:为参数,你需要传的参;
obj.func:为函数,自己随便定义的;
'json':为json格式;
?cdncallback=?:注意需要在地址结尾加上这句;
这才是真正需要做的,cdncallback可以随便取名,=?中的?代表funciton,这里是obj.func;
由于有的服务器不支持jsonp,所以最好需要去提供接口那儿,让接口开发者加上下面这句:
总结下:这是正常的json调用,不支持跨域:
客户端:
服务器:
echo json;
修改后,支持跨域:
接下来解释下原因:浏览器中js的函数会被解析成对应规则的命名方式如:
function test(){};解析成:jquery246541313245;
所以利用jsonp传送函数的参数过去cdncallback=jquery246541313245;
接口返回结果为jquery246541313245(data);
你的浏览器在解析回来就是test(data);
然后你就可以用data了;
鉴定完毕~~,亲给好评哦~~
请看大屏幕,问题出现了,js跨域会被同源策略给弄掉,何为跨域,就是我是一个服务器,别人是一个服务器,这时到网上找到一个解决方案jsonp;
就是带src标签的都可以跨域取东西,如img可以取到其他网页其他图像,还有link,还有script,所以就这样了:
我使用的是jquery,代码贴出,天王盖地虎有图有真相:
var remoteurl = 'http://www.url.com/index.php/data/get?cdncallback=?';
$.get(remoteurl,obj.param,obj.func,'json');
remoteurl:地址;
obj.param:为参数,你需要传的参;
obj.func:为函数,自己随便定义的;
'json':为json格式;
?cdncallback=?:注意需要在地址结尾加上这句;
这才是真正需要做的,cdncallback可以随便取名,=?中的?代表funciton,这里是obj.func;
由于有的服务器不支持jsonp,所以最好需要去提供接口那儿,让接口开发者加上下面这句:
echo $_GET['cdncallback'].'('.json.')';
总结下:这是正常的json调用,不支持跨域:
客户端:
var remoteurl = 'http://www.url.com/index.php/data/get';
$.get(remoteurl,obj.param,obj.func,'json');
服务器:
echo json;
修改后,支持跨域:
客户端:
var remoteurl = 'http://www.url.com/index.php/data/get?cdncallback=?';
$.get(remoteurl,obj.param,obj.func,'json');
服务器:
echo $_GET['cdncallback'].'('.json.')';
接下来解释下原因:浏览器中js的函数会被解析成对应规则的命名方式如:
function test(){};解析成:jquery246541313245;
所以利用jsonp传送函数的参数过去cdncallback=jquery246541313245;
接口返回结果为jquery246541313245(data);
你的浏览器在解析回来就是test(data);
然后你就可以用data了;
鉴定完毕~~,亲给好评哦~~