var url="http://localhost:8080/WorkGroupManagment/open/getGroupById" +"?id=1&callback=?"; $.jsonp({ "url": url, "success": function(data) { $("#current-group").text("当前工作组:"+data.result.name); }, "error": function(d,msg) { alert("Could not find user "+msg); } });
至此两种解决跨域问题的方式就全部介绍完毕。
补充: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')[0].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>
您可能感兴趣的文章: