1、ajax和jsonp这两种技术在调用方式上“看起来”很像,目的也一样,都是请求一个url,然后把服务器返回的数据进行处理,因此jquery和ext等框架都把jsonp作为ajax的一种形式进行了封装;
2、但ajax和jsonp其实本质上是不同的东西。ajax的核心是通过XmlHttpRequest获取非本页内容,而jsonp的核心则是动态添加标签来调用服务器提供的js脚本。
3、所以说,其实ajax与jsonp的区别不在于是否跨域,ajax通过服务端代理一样可以实现跨域,jsonp本身也不排斥同域的数据的获取。
4、还有就是,jsonp是一种方式或者说非强制性协议,如同ajax一样,它也不一定非要用json格式来传递数据,如果你愿意,字符串都行,只不过这样不利于用jsonp提供公开服务。
总而言之,jsonp不是ajax的一个特例,哪怕jquery等巨头把jsonp封装进了ajax,也不能改变着一点!
———————————————————————————————————————————
看了很多网上的资料,拿出通俗易懂的话讲解跨域问题,以及ajax,jsonp,json的区别。
【1】ajax和jsonp本质上是不同的东西。Ajax是异步的js他的核心是通过XmlHttpRequest获取非本页内容,而jsonp的核心则是动态添加标签来调用服务器提供的js脚本。
【2】ajax和jsonp这两种技术很像,目的也一样,都是请求一个url,然后把服务器返回的数据进行处理,因此jquery类库把jsonp作为ajax的一种形式进行了封装(其实并不是一种东西)怪jq唠?用着爽就好;
【3】出于安全考虑,脚本(AJAX)不能访问非本域的内容。但是,静态资源是不受域策略限制的,可以加载任意域的脚本、样式、图片等静态资源,JSOP就是利用这种原理来实现跨域获取数据的。
先介绍jsonp的使用方法:
好人做到底源码给你唠
$(function(){
$.ajax({
type: "get",
url: "http://apis.juhe.cn/cook/query.php?menu=鱼香肉丝&key=dfed9d599318b17aa073a9337d057e5f",
dataType: "jsonp"
}).done(function (data) {
console.log(data)
})
});
服务器运行的结果完美跨域获取到数据
再介绍PHP配合ajax跨域:
先建立叫search.php的文件!
内容为:
$data =$_POST['data'];
//服务器来接收客户端发送的数据
//服务器允许 该请求头进行跨域
header("Access-Control-Allow-Origin:http://apis.juhe.cn/cook/query.php?".$data."&key=dfed9d599318b17aa073a9337d057e5f");
// 服务器获取数据的方式
header('Access-Control-Allow-Methods:GET');
// 动态获取数据地址
$ulr ="http://apis.juhe.cn/cook/query.php?".$data."&key=dfed9d599318b17aa073a9337d057e5f";
// 服务器讲获取的数据转换成JSON格式 返回给客户端
$html=file_get_contents($ulr);
// 返回客户端 echo 返回一个字符串
echo $html;//服务器来返回一个 string的 数据
?>
Index.html的内容为:
运行结果:
最后再说一下json和jsonp的区别json是一种数据格式而jsonp是一种跨域的方式根本不是一回事只是名字差不多!