背景:前端铁哥们要个跨域请求的东东,记得在以前的公司中做过这个,记得关键字$.getJSON做的,但是具体的代码,以前没有记录下来。晚上找了下,调了一下,发现可以用的特记录下来,方便下次忘了的话,可以快速找到。
前端 testjsonp.html 代码:
<script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.8.2/jquery.min.js"></script>
<script>
(function() {
$.getJSON('http://192.168.1.136:8010/testJsonp.php?&callback=?',function (data) {
console.log(data);
alert(data.status);
});
})();
</script>
服务器端testJsonp.php代码:
<?php
$data = array("status"=>1,"msg"=>"成功");
$callback = $_GET['callback'];
echo $callback.'('.json_encode($data).')';
exit;
最后,浏览器打开testjsonp.htm l结果如下图
备注:testJsonp.php存放的位置是局域网内的,所以ip外网不能用,也就刷掉了。
总结:
1.前台的 testjsonp.html 里发送的请求里带callback参数的时候,getJSON会自动转成jsonp方式
2.前台的 testjsonp.html 里发送的请求里将callback参数的值设为问号 "?" 时,请求提交出去的时候是会自动生成一个值的,例如截图红色框括起的区域,所以在服务器端的testJsonp.php 代码里获取callback 参数是能够得到和前端匹配的值的。
3.服务器端的testJsonp.php 输出的结果作为 jsonp的返回值时,是必须以 $callback.'('.json_encode($data).')'; 这种形式的。
补充:
铁哥们用了一个 $.getScript 的形式,能请求到一个json文件里的内容。
(function() {
$.getScript("http://192.168.1.136:8010/jquery/test/Json/data-jsonp.json?callback=?", function(data) {
console.log(data);
/* console.log(textStartus);
console.log(jqxhr); */
/* var json = $.parseJSON(data.replace(/^\(|\)$/g, ""));
console.log(json[0].name); */
});
})();
关于这种个人理解的是应该直接将文件的内容全部跨域读取出来了,换成了上面的php请求的地址的时候,报错了
Uncaught SyntaxError: Unexpected token ? 。查看发送的请求时,看到callback 参数的值也并没有自动生成,仍旧是等于问号 "?"。感觉问题应该是出在这里,目前不知道怎么解决。
由此可得到结论:第一种的方式,是可以满足跨域调用接口;第二种的方式,是可以满足跨域读取一些json格式的js配置文件内容的。