51工具盒子

依楼听风雨
笑看云卷云舒,淡观潮起潮落

两种方式实现js,ajax的跨域

我们知道,用服务端脚本做js来用可以实现通信,但是,他功能太简单,不够灵活,还是需要像ajax这样的通信来的方便。今天公司在使用phonegap时遇到了ajax跨域问题,我偷听了一下,总结了一下ajax两种跨域问题。嘿嘿。
当然这样应用场景是有前提的,一般情况下,我们都是在同个域名下,但是做客户端软件或手机应用,没有域,所以要解决跨域通信。
第一种方式就是jsonp
这个大家可以查一下,这里直接贴实例
html代码

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
 </head>
 <body>
 <script src="jquery-1.8.3.min.js"></script>
   <script type="text/javascript">  
     jQuery(document).ready(function(){   
        $.ajax({  
             type: "GET",  
             async: false,  
             //url: "http://test/jsonp.php",  
             url:"http://local.ok.com/1.php",  
             dataType: "jsonp",  
             jsonp: "callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)  
             jsonpCallback:"bbb",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据  
             success: function(json){  
                 alert('您查询到航班信息:票价: ' + json.price + ' 元,余票: ' + json.tickets + ' 张。回调函数名为: '+json.func);  
             },  
             error: function(){  
                 alert("fail");  
             }  
         });  
     });  
     </script>  
 
 </body>
</html>

local.ok.com/1.php代码

<?php
$callback = isset($_GET["callback"]) ? $_GET["callback"] : 'flightHandler';  
$a = array(    
    'code'=>'CA1998',    
    'price'=>'6000',    
    'tickets'=>20,    
    'func'=>$callback,    
);    
$result = json_encode($a);    
echo "{$callback}($result)";    
exit;  
?>

这样你直接双击运行html或在其他域名主机下运行可以实现通信
第二种方式,就是php等的服务端脚本,头信息加入

header('Access-Control-Allow-Origin: *');

这样,其脚本的返回值就可以在任何域下使用了,ajax保持原来的用法即可。 标签: 客户端软件,手机应用,服务端,ajax,通信

赞(1)
未经允许不得转载:工具盒子 » 两种方式实现js,ajax的跨域