jsonp
之前清蒸了几只ajax螃蟹,味道不错,不过呢?螃蟹虽好,肉却太少哦!
ajax出现,解决了页面不刷新的情况下与后台进行通讯与数据交换,但是有一个致命的缺陷,他是不能跨域的。
跨域： <==慨念问题点左边
总之端口号那个冒号前面的任何一个地方不一样都是跨域请求。
我们知道 img标签的src script标签的src 是可以进行跨域请求数据的,于是不知是哪位大神,异想天开曲线救国,使用script标签进行后台的数据获取,
当然这个script标签是我们用js脚本动态生成的,举个栗子
首先我准备一个写好的脚本
1.js
funDemo({"result":"远程数据"});
再写一个html文件
1.html
<!DOCTYPE html >
<head>
<title>1</title>
<script type="text/javascript">
var funDemo= function(data){
alert( data.result);
};
</script>
<script type="text/javascript" src="http://aaa.com/1.js"></script>
</head>
<body>
</body>
</html>
function funDemo(data){alert(data.result);} 函数这么声明也是一样的!!!
其实就是在html文件上声明一个名字叫,funDemo的函数,里面有一个参数
然后,执行了一个远程的(跨域的)js代码,调用了这个函数,远程的js提供数据,作为参数
funDemo({"result":"远程数据"});
那么新问题来了,虽然能这样获取到远程的数据,但是这个函数名必须与后台的函数名保持一致,解决方案是在src的后面提供一个函数名的参数,
后台的程序根据函数名动态的生成这个js文件
1.html 修改
<script type="text/javascript" src="http://aaa.com/1.php?&callback=funDemo"></script>
后台的话可以考虑用字符串拼接的方式来返回这个js
1.php
<?php
header(‘Content-Type:application/x-javascript‘);
$callback=$_REQUEST[‘callback‘];
echo "function $callback(data){alert(data.result);}"
>
我稀烂的PHP也不知道有没有写对=.=
这样就大功告成了。
jQuery里面的jsonp是放在ajax里面的，但是真心半毛钱关系木有呀！！
螃蟹可以吃，虾也可以吃，都是清蒸，一样的做法。但是他们真心不是一种东西！！！！
附赠ajax中使用jsonp
$.ajax({
type : "get",
url : "1.php",
dataType : "jsonp",
jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)
jsonpCallback:"success_jsonpCallback",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名
success : function(json){
//do something
},
error:function(){
//do something
}
});
时间： 2024-08-08 05:37:31