jquery跨域请求解决方案（都是从网上找的，本人未加验证）

最新推荐文章于 2021-10-09 09:00:24 发布

清月晨光

最新推荐文章于 2021-10-09 09:00:24 发布

阅读量2.4k

点赞数

分类专栏： JavaWeb 文章标签： jquery ajax

本文链接：https://blog.csdn.net/ztt_1119/article/details/41962087

版权

JavaWeb 专栏收录该内容

15 篇文章 1 订阅

订阅专栏

http://www.3lian.com/edu/2014/02-10/127921.html

本篇文章只要是对jquery ajax跨域解决方法(json方式)进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助
最近公司开发的项目中很多地方需要跨域ajax请求，比如几个子域名下 
http://a.****.com/index123.aspx, 
http://b.****.com/index2.aspx 
 
都要请求用户json信息，然后再对数据进行处理，起初我和同事们试了很多种方法，使用$.ajax() 无论是get或post方法都会引起uri deny的错误。一番GG之后发现了解决方法，也了解其中的原因。
 
jquery从1.2开始，.getJSON就支持跨域操作了。使用jquery.getJSON()方法可以解决跨域问题。实例如下
 
前台
<script type="text/javascript" src="/script/jquery.js"></script>
 
HTML中JS代码
function gettst2() {
    $.getJSON("http://ucenter.xxxx.com.cn/ajax/test.aspx?callback=?", { id: "123456", site: "01" },
function(data) {
    alert(data.htmls);
     document.getElementById("shows").innerHTML = data.htmls;
});
}
gettst2();
 
ASPX.cs文件中处理为 
string jsoncall = Request.QueryString("callback"); 
Response.Write(jsoncall + "({htmls:测试001})");
 
如果加html代码的话，千万别加/n 符号，不然会出现乱码，js 错误。

资料二：

今天在项目中需要做远程数据加载并渲染页面，直到开发阶段才意识到ajax跨域请求的问题，隐约记得Jquery有提过一个ajax跨域请求的解决方式，于是即刻翻出Jquery的API出来研究，发现JQuery对于Ajax的跨域请求有两类解决方案，不过都是只支持get方式。分别是JQuery的 jquery.ajax jsonp格式和jquery.getScript方式。

什么是jsonp格式呢？API原文：如果获取的数据文件存放在远程服务器上（域名不同，也就是跨域获取数据），则需要使用jsonp类型。使用这种类型的话，会创建一个查询字符串参数 callback=? ，这个参数会加在请求的URL后面。服务器端应当在JSON数据前加上回调函数名，以便完成一个有效的JSONP请求。意思就是远程服务端需要对返回的数据做下处理，根据客户端提交的callback的参数，返回一个callback(json)的数据，而客户端将会用script的方式处理返回数据，来对json数据做处理。JQuery.getJSON也同样支持jsonp的数据方式调用。

客户端JQuery.ajax的调用代码示例：

 
         $.ajax({ 
        
         type :  
         "get" 
         , 
        
         async: 
         false 
         , 
        
         url :  
         "http://www.xxx.com/ajax.do" 
         , 
        
         dataType :  
         "jsonp" 
         , 
        
         jsonp:  
         "callbackparam" 
         , 
         //服务端用于接收callback调用的function名的参数 
        
         jsonpCallback: 
         "success_jsonpCallback" 
         , 
         //callback的function名称 
        
         success :  
         function 
         (json){ 
        
         alert(json); 
        
         alert(json[0].name); 
        
         }, 
        
         error: 
         function 
         (){ 
        
         alert( 
         'fail' 
         ); 
        
         } 
        
         });

服务端返回数据的示例代码：

1

2

3

4

5

 
         public void ProcessRequest (HttpContext context) { 
        
         context.Response.ContentType =  
         "text/plain" 
         ; 
        
         String callbackFunName = context.Request[ 
         "callbackparam" 
         ]; 
        
         context.Response.Write(callbackFunName +  
         "([ { name:\"John\"}])" 
         ); 
        
         }

资料三：

from : http://www.myquickphp.com/archives/147

(请求的跨域服务器不支持常规”?”查询请求时的解决方案)

昨天第一次做VIP需求时，发现一个超奇怪的问题，我有以下URL地址:

http://dynamic.vip.xxxxxx.com/active/<controllers>/<active>/<id>

放在浏览器地址栏中访问可以得到正确的输出,但我一放到 AJAX 中去异步请求后用 FireBug 调试时确怎么都不出结果，和水龙兄一起调试了很久都没有发现是什么问题，由于这个URL对方的程序是用XX框架写的，我是第一次使用这个XX框架进行开发，对它不是很熟(有时间要研究一下它的内核源码)，总以为是它什么地方有设置影响了的；就在我快要吐血时，乐锋(对这块比较了解的哥们)终于上线了，我把问题向他说下后,他第一反应就是:”你是不是跨域访问了。。”

OH FUCK

，我和水龙一直研究程序逻辑，竟然忽视了自己的当前域名,因为我当前执行请求的域名是:

http://vip.xxxxxx.com/active1/index.html

问了一下乐锋,现系统中已提供的几个方案(函数)都不太令人满意或太烦琐了，和乐锋讨论了几种方案后，一时没有找到最好解决方案，一看时间,22:00了，天色已晚，不打扰他晚上陪老婆了！回到家里本想通过利用 iframe 来加载跨域的 url 来得到 dom 数据，研究后发现的想法太天真了，JS的安全策略跟本不允许我这样做；想通过 proxy 代理的方案，但想了一下，那比现在系统中所使用的方案更麻烦，详细研究了一下jQuery最新版关于跨域的解决方案后，终于让我研究出了一种非常方便的解决方案:

如下是代码示例:

—————— http://a.com/index.html ——————-


 <script type="text/javascript" src="jquery-1.4.2.js"></script>
 <script type="text/javascript">
 /*
 AJAX跨域问题完美解决方案
 研究:袁维
 启示:乐锋
 */
 function jsonCallBack(url,callback)
 {
 $.getScript(url,function(){
 callback(json);
 });
 }
 function fun1()
 {
 jsonCallBack('http://b.com/b.php',function(json){
 alert(json.message);
 })
 }
 </ script>
 <button type="button" onclick="fun1()">跨域访问</button>

—————— http://b.com/b.php ——————-


 <?php
 $ary = array('result'=>0,'message'=>'跨域成功');
 $json = json_encode($ary);
 //一定要这样定义输出最后的JSON数据,这是利用JS的闭包特性
 echo "var json=$json;";
 ?>

该方案注意事项:

1:jQuery的版本必需大于 1.2版，否则不支持跨域处理

2:只支持 GET 方式的请求

2:请求的 URL 必需按如下例子中那样返回数据.

该方案注意利弊:

优点:

1:比用 iframe 加输出 parent.XXX() 的方案简单高效明了，前端处理更方便

2:相当 proxy 方式在编程上也简单多了

缺点：

1:必需使用jQuery，

2:返回的数据格式必需按示例样，当然不限于JSON，但它是处理最方便的.

(跨域服务器支持常规”?”查询请求的解决方案，利用JQuery的 JSONP )

——————— http://b.com/index ———————-


 <script src="jquery-1.4.2.js" type="text/javascript"></script>
 <script type="text/javascript">
 function fun1()
 {
 $.getJSON("http://a.com/c.php?no=10&msg=ok&format=json&jsoncallback=?",
 function(data){
 alert(data.msg);
 });
 }
 </script>
 <button type="button" onclick="fun1()">跨域处理</button>

——————– http://a.com/c.php ———————-


 <?php
 $no = $_GET['no'];
 $msg = $_GET['msg'];
 $json = json_encode(array('no'=>$no,'msg'=>$msg));
 //必需以下这样输出
 echo $_GET['jsoncallback'].'('.$json.')';