chenjc_it 发表于 2013-1-23 01:17:48

Ajax跨域问题解决方案

Ajax跨域问题有三种解决方案:
 
1.通过中间过渡层解决跨域问题
 
(1)通过Web代理服务器将不同域的应用统一通过代理服务器进行隔离,所有的应用都在一个域名下面了。(比如apache,nginx等)
 
 
(2)跨域的安全限制都是指浏览器端来说的.服务器端是不存在跨域安全限制的,所以通过本机服务器端通过类似httpclient方式完成“跨域访问”的工作。
 
 
2.通过<script>标签解决跨域问题
注意:凡是拥有"src"这个属性的标签都拥有跨域的能力,比如<script>、<img>、<iframe>
示例:
前台脚本:
 
<script type="text/javascript">    var flightHandler = function(data){      alert('你查询的航班结果是:票价 ' + data.price + ' 元,' + '余票 ' + data.tickets + ' 张。');    };      var url = "http://abc.com:8080/AjaxCrossDomain/data/data.jsp?code=CA1998&callback=flightHandler";       var script = document.createElement('script');    script.setAttribute('src', url);      document.getElementsByTagName('head').appendChild(script);</script> 
后台data.jsp内容:
 
<%@ page language="java" pageEncoding="UTF-8"%><%String callback = request.getParameter("callback");StringBuilder builder = new StringBuilder();builder.append(callback).append("({").append("\"code\": \"CA1998\",").append("\"price\": 1780,").append("\"tickets\": 5").append("});");    out.println(builder.toString());%> 
 
使用jquery的jsonp来实现跨域访问,例子如下:
<script type="text/javascript">   $(function(){      $.ajax({             type: "get",             async: false,             url: "http://abc.com:8080/AjaxCrossDomain/jsonp/data.jsp",             dataType: "jsonp",             jsonp: "callback",             jsonpCallback:"flightHandler",             success: function(json){               alert('您查询到航班信息:票价: ' + json.price + ' 元,余票: ' + json.tickets + ' 张。');             },             error: function(){               alert('fail');             }         });   });          </script>  
 
 
 
 
 
页: [1]
查看完整版本: Ajax跨域问题解决方案