网站地图    收藏   

主页 > php专栏 > php应用 >

PHP JSONP跨域实现程序详解 - php高级应用

来源:自学PHP网    时间:2014-11-27 22:16 作者: 阅读:

[导读] 在网站开发中跨域是一个头痛的事情,我经常要需要解决各种跨域问题,今天我来介绍在php中利用JSONP跨域实现方法,各位J友可参考参考,先看一个实例,代码如下:$( btn) click(function(k){ varj=fo...

PHP JSONP跨域实现程序详解

在网站开发中跨域是一个头痛的事情,我经常要需要解决各种跨域问题,今天我来介绍在php中利用JSONP跨域实现方法,各位J友可参考参考,先看一个实例,代码如下:

  1. $("#btn").click(function(k) {  
  2.     //...  
  3.     var j = form.serializeArray();//序列化name/value  
  4.     $.ajax({  
  5.         url: "另一个域名/test.php",  
  6.         dataType: 'jsonp',  
  7.         data: j,  
  8.         jsonp: 'jsonp_callback',  
  9.         success: function(json) { //返回的json数据  
  10.            json = json || {};  
  11.             if (json.msg=='err'){  
  12.                 alert(json.info);  
  13.             }else if (json.msg=="ok"){  
  14.                 alert('提交成功');  
  15.             }else{  
  16.                 alert('提交失败');  
  17.             }  
  18.         },  
  19.         timeout: 3000  
  20.     })  
  21.     //...  
  22. }); 

php部分代码如下:

  1. $jsonp_callback=$_GET['jsonp_callback'];  
  2. //...  
  3. //如果正确  
  4. echo $jsonp_callback,'({"msg":"ok"})';  
  5. //如果错误  
  6. echo $jsonp_callback,'({"msg":"err","info":"因人品问题,发送失败"})';  
  7. //...值得注意的是采用jsonp 方式,beforeSend / error 都不能用了,所以beforeSend里面用js实现的验证只能用ajax在服务器端test.php上面验证了。 

域名下面有这么个html文件testjsonp.html,代码如下:

  1. <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN“ “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd“> 
  2.  <html xmlns=“http://www.w3.org/1999/xhtml“ > 
  3.  <head> 
  4.      <title>Untitled Page</title> 
  5.       <script type=“text/javascript“ src=“jquery-1.7.2.min.js“></script> 
  6.       <script type=“text/javascript“> 
  7.      jQuery(document).ready(function(){  
  8.         $.ajax({ 
  9.              type: “GET“, 
  10.              async: false, 
  11.              //url: “http://test/jsonp.php“, 
  12.              url:“http://mytaobao.com/jsonp.php“, 
  13.              dataType: “jsonp“, 
  14.              jsonp: “callback“,//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback) 
  15.              jsonpCallback:“flightHandler“,//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写“?“,jQuery会自动为你处理数据 
  16.              success: function(json){ 
  17.                  alert('您查询到航班信息:票价: ' + json.price + ' 元,余票: ' + json.tickets + ' 张。回调函数名为: '+json.func); 
  18.              }, 
  19.              error: function(){ 
  20.                  alert(“fail“); 
  21.              } 
  22.          }); 
  23.      }); 
  24.      </script> 
  25.      </head> 
  26.   <body> 
  27.   </body> 
  28.  </html> 

注意,要真正运行上面的代码可能需要jquery的文件,你可以将如下代码:

<script type=“text/javascript“ src=“jquery-1.7.2.min.js“></script> 

改为你目录中jquery的文件路径,代码如下:

<script type=“text/javascript“ src=“js/jquery.js“></script>

然后,你可以再找个另外一个域名的web目录,将文件jsonp.php:如下代码:

  1. <?php 
  2. $callback = $_GET[“callback“]; 
  3. $a = array
  4.  'code'=>'CA1998'
  5.     'price'=>'6000'
  6.     'tickets'=>20, 
  7.     'func'=>$callback
  8. ); 
  9. $result = json_encode($a); 
  10. echo “flightHandler($result)“; 
  11. exit;  

放到这个目录下面去,这样就可以测试了,直接在浏览器访问testjsonp.html.就可以看到效果了.

自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习

京ICP备14009008号-1@版权所有www.zixuephp.com

网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com

添加评论