码迷,mamicode.com
首页 > Web开发 > 详细

jquery下jsonp跨域请求

时间:2014-11-11 15:49:53      阅读:186      评论:0      收藏:0      [点我收藏+]

标签:style   blog   io   color   ar   java   sp   strong   数据   

客户端js代码:

     $(function(){  
       $.ajax(  
                    {  
                        type:‘GET‘,  
                        url : "../php/getGIS.php?id=[50010000001200000001,50010000001200000003]",  
                        dataType : ‘jsonp‘,  
                        jsonp:"jsoncallback",  
                        success  : function(data) {  
                            alert( data );  
                        },  
                        error : function() {  
                            alert(‘fail‘);  
                        }  
                    }  
                );  
    })  

服务器端php代码:

<?php
    header(‘Content-Type:text/html;Charset=utf-8‘);  
    $json="[
             {‘Device_ID‘:‘50010000001200000001‘,‘Device_Name‘:车载1‘,‘Time‘:‘2014-11-10 11:06:00‘,‘Longitude‘:116.262‘,‘Latitude‘:40.101‘},
             {‘Device_ID‘:‘50010000001200000003‘,‘Device_Name‘:车载3‘,‘Time‘:‘2014-11-11 11:26:23‘,‘Longitude‘:116.262‘,‘Latitude‘:40.1008‘}
           ]";
    $json=json_encode($json);
    echo $_GET[‘jsoncallback‘] . "(".$json.")"; 
?>

客户端返回结果:

[
             {‘Device_ID‘:‘50010000001200000001‘,‘Device_Name‘:车载1‘,‘Time‘:‘2014-11-10 11:06:00‘,‘Longitude‘:116.262‘,‘Latitude‘:40.101‘},
             {‘Device_ID‘:‘50010000001200000003‘,‘Device_Name‘:车载3‘,‘Time‘:‘2014-11-11 11:26:23‘,‘Longitude‘:116.262‘,‘Latitude‘:40.1008‘}
]

 

Jsonp原理: 
首先在客户端注册一个callback, 然后把callback的名字传给服务器。

此时,服务器先生成 json 数据。
然后以 javascript 语法的方式,生成一个function , function 名字就是传递上来的参数 jsonp.

最后将 json 数据直接以入参的方式,放置到 function 中,这样就生成了一段 js 语法的文档,返回给客户端。

客户端浏览器,解析script标签,并执行返回的 javascript 文档,此时数据作为参数,传入到了客户端预先定义好的 callback 函数里.(动态执行回调函数)

jquery下jsonp跨域请求

标签:style   blog   io   color   ar   java   sp   strong   数据   

原文地址:http://www.cnblogs.com/jly553/p/4089546.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!