JSONP
Jsonp(JSON with Padding) 是 json 的一种"使用模式"，可以让网页从别的域名（网站）那获取资料，即跨域读取数据。
为什么我们从不同的域（网站）访问数据需要一个特殊的技术(JSONP )呢？这是因为同源策略。
同源策略，它是由Netscape提出的一个著名的安全策略，现在所有支持JavaScript 的浏览器都会使用这个策略。
- 利用 html 的 <script> 元素的这个开放策略，网页可以得到从其他来源动态产生的 JSON 资料，而这种使用模式就是所谓的 JSONP。
1. 服务端JSONP格式数据
如客户想访问 : /try/ajax/jsonp.php?jsonp=callbackFunction。
假设客户期望返回JSON数据：["customername1","customername2"]。
真正返回到客户端的数据显示为:callbackFunction(["customername1","customername2"])。
服务端文件jsonp.php代码为：
$callbackname = $_GET['jsoncallbackname']; //获取回调函数名 callbackname =
$arr = array( // json数据 $arr =
'name' => "srark",
"age" => 18,
"msg" => "现在我们学习jsonp原理"
);
echo $callbackname."(".json_encode($arr).")" //输出jsonp格式的数据 echo $callbackname."(".json_encode($arr). ")";
客户端页面代码
jsonp("api/jsonpcallback.php?jsoncallback=info",'info',function(data){ //调用封装函数
console.log(data.name +'----'+data.age);
})
function jsonp(url,callbackname,callback){ //封装函数
var tagScript = document.createElement("script"); // 创建了一个script 标签
tagScript.src = url; // 给这个标签的src赋一个值
document.body.appendChild(tagScript); // 把这个标签追加到body里面
window[callbackname] = callback; // 给window赋一个全局的函数
document.body.removeChild(tagScript); // 用完就删除这个script src标签
}
2 jquery中的ajax方法怎样通过JSONP进行远程调用
- type：请求方式 GET/POST
- url:请求地址
- async:布尔类型，默认为true 表示请求是否为异步，如果为false表示为同步。
- dataType：返回的数据类型
- jsonp：传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(一般默认为:callback)
- jsonpCallback：自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也可以写"?"，jQuery会自动为你处理数据
- success：调用成功执行的函数
- error：异常处理函数
