<![CDATA[向东博客 专注WEB应用 构架之美 --- 构架之美，在于尽态极妍 | 应用之美，在于药到病除]]> http://jackxiang.com/index.php zh-cn http://jackxiang.com/post// <![CDATA[[实践Ok]jQuery JSONP跨域实践，getJSON跨域实践。]]> jack <xdy108@126.com> Wed, 14 Apr 2010 06:55:15 +0000 http://jackxiang.com/post// 后台服务器响应的内容有区别的

用 json 的时候
response.write("{\"p1\":\"v1\"}")
用 jsonp 的时候
response.write(request["callback"] + "({\"p1\":\"v1\"})")
——————————————————————————————————————————
直接返回：callBackFromPcClient({'title':'this from server site','status':'success'})
在里面写个callBackFromPcClient是不标准的，呵呵。
PHP:

JS Jquery jsonP调用:

调用后返回：


如不这样，会进入Error里的。Add Time：2014-03-13
———————————————————————————————————————————————————————————————————————
一直对jQuery 的jsonp 调用比较疑惑，今天研究了一下jsonp 做了一个简单的调用例子,我用asp做服务端s

客户端(url:http://192.168.1.2:81/jsonp_test.asp)

客户端页面首先在body 中放置一个div: <div id="res"></div> 将远程调用的数据写入该div中
Code

<script type="text/javascript" src="/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $.ajax({
             url:'http://192.168.9.5/jsonp_proc.asp',
             dataType:"jsonp",
             jsonp:"jsonpcallback",
             success:function(data){
                 var $ul = $("<ul></ul>");
                 $.each(data,function(i,v){
                     $("<li/>").text(v["id"] + " " + v["name"]).appendTo($ul)
                 });
                 $("#res").append($ul);
             }
        });
    });
</script>




服务端（url:http://192.168.1.5/jsonp_proc.asp）
代码很简单，就是输出一个字符串
比如正常输出json应该是：[{"id":"1","name":"测试1"},{"id":"2","name":"测试2"}]
jsonp 则输出: jsonpcallback([{"id":"1","name":"测试1"},{"id":"2","name":"测试2"}]) 其中“jsonpcallback”是客户端传过来的

Code

<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<%
　　jsonp = request("jsonpcallback")
　　str = "[{""id"":""1"",""name"":""测试1""},{""id"":""2"",""name"":""测试2""}]"
　　str = jsonp &amp; "(" &amp; str&amp;")"
　　response.Write(str)
%>


由于 jquery 在ajax 处理中使用的是utf-8编码传递参数的，所以jsonp处理端用utf-8的编码最好，这样省得编码转换了

最终效果截图：

点击在新窗口中浏览此图片

跨域可能想flash来做其实jsonp这样去请求计数一下还是可以的：



    start:function(){
      
       $.ajax({
             url:'http://c.l.**.com/adsclick?seq=20100414000034***&loc=hdjc**',
             dataType:"jsonp",
             jsonp:"jsonpcallback",
             success:function(data){
             }
        });
      


服务端必须要有一个回调函数的json串输出，否则，jquery的jsonp尽管调用，但是没有到success里面去。
为此，我们应该这样才能取得回调的json返回值：

PHP跨域Url代码：
http://localhost/jsonp.php
<?php
$array_Json = array("id"=>"10020155545","name"=>"jackxiang");
$aaa_arr = json_encode($array_Json);
$str =$_GET['jsonpcallback']."(".$aaa_arr.")";
echo $str;
?>

jsonp url发送get方式抓包：

http://localhost/jsonp.php?jsonpcallback=jsonp1299201040354&_=1299201040373
jsonp1299201040354({"id":"10020155545","name":"jackxiang"})


jquery的jsonp调用如下：

jsonp.html
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>安踏CBA全明星赛活动 - 排行榜</title>
<script type='text/javascript' src="./jquery.js"></script>


<script type="text/javascript">
    $(document).ready(function(){
        $.ajax({
             url:'http://localhost/jsonp.php',
             dataType:"jsonp",
             jsonp:"jsonpcallback",
             success:function(data){
         alert("jack");
//         alert(data);

             }
        });
    });
</script>


来源：http://www.cnblogs.com/cfanseal/archive/2009/05/19/1460382.html
http://www.impng.com/front-end/ajax-crossdomain-by-jsonp.html







最近遇到不少需要跨越操作的问题，一直没有解决，今天具体总结下Jquery下怎样实现跨域操作的。
一般情况下，XMLHttpRequest对象本身是不能支持跨域通信的，因此使用简单的AJAX技术是无法完成跨域请求与响应的任务的。为了实现跨域通信，实现跨域操作有三种方法：
                      本地代理，flash，Script。
                   1.Script实现跨域操作（通过getScript()函数）
                            getScript("网址")；
                   2.Jsonp方式实现跨域操作（使用jQuery的JSONP就可以实现跨域操作）
                           getJSON("网址?type=json（类型）&callback=?（返回）"）；
还有一些网址提供的API也可以实现跨域

jQuery的getJSON方法怎么使用?

$.getJSON('你请求的页面URL, {参数} , 回调函数);
a.php
$name = {name:"aaa"};
echo $name; //响应回去,如果换成其他语言用一个输出就行。
//模板
$.getJSON('a.php' , '{}' , function(data){
    alert(data.name); //弹出aaa
})

Demo：
一定要有一个callback=?的回调参数，没有请求是失败的，不可能成功的：


程序端：
需要返回数据结构如下：
$ret = "{\"code\":\"-1\"}";
echo $_GET['callback']."(".$ret.")";
根据情况于是得构造出：
Url：./Info.php?callback=jsonp1342075892609&id=566&rand=0.1722637134335827
jsonp1342075892609({type:"pm"})
于是：
$ret = '{type:"pm"}';
echo $_GET['callback']."(".$ret.")"; ]]> http://jackxiang.com/post//#blogcomment <![CDATA[[评论] [实践Ok]jQuery JSONP跨域实践，getJSON跨域实践。]]> <user@domain.com> Thu, 01 Jan 1970 00:00:00 +0000 http://jackxiang.com/post//#blogcomment