/*
* @CORS跨源资源共享 ==> 使用自定义的HTTP头部让浏览器与服务器进行沟通
* @Origin头部 ==> 包含请求页面的源信息(协议, 域名和端口)
* @如: Origin: http://www.nczonline.net
* @如果服务器认为这个请求是可以接受的就在Access-Control-Allow-Origin头部返回相同的源信息
*/
/*
* @JSONP(JOSN with padding) ==> 填充式JSON或参数式JSON, 是应用JSON的一种新方法
* @JSONP ==> 由两部分组成, 回调函数和数据
* @1.回调函数 ==> 是响应到来时应该在页面中调用的函数, 回调函数的名字一般的请求中指定
* @2.数据 ==> 是传入回调函数中的JSON数据
* @3.JOSNP是通过动态<script>元素来使用, 这样就不受跨域影响
*/
// 前端使用jq
$.ajax({ type: "GET", async: false, url:"http://taoalan.com/json/alan.php", dataType: "jsonp", jsonp: "callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback) jsonpCallback:"flightHandler",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据 success: function(json){ alert('您查询到航班信息:票价: ' + json.price + ' 元,余票: ' + json.tickets + ' 张。回调函数名为: '+json.func); }, error: function(){ alert("fail"); } });
// 后台http://taoalan.com/json/alan.php文件中
<?php $callback = $_GET["callback"]; $a = array( 'code'=>'CA1998', 'price'=>'6000', 'tickets'=>20, 'func'=>$callback, ); $result = json_encode($a); echo "flightHandler($result)"; exit; ?>
// 原生js使用script动态添加
function loadhandleResponse(){ var script = document.createElement("script"); script.src = "http://taoalan.com/json/alan.php?callback=flightHandler"; document.body.insertBefore(script, document.body.firstChild); }