ajax的跨域访问

前端之家收集整理的这篇文章主要介绍了ajax的跨域访问前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

没想到写篇博客都这么难,已经拖了两天了,不能再拖了,今天绝对把你给写完。

最近手头上没啥事,准备看一下ajax的知识点的,在网上一搜发现有关ajax跨域访问的问题,虽然我没有遇到过,但对这有点兴趣,也就找了一些资料看了看,由于本人技术有点水,看了很多都看不懂,但也有几篇写的不错的,在这里将那些写的不错的总结一下。

由于同源策略,浏览器阻止一个域通过ajax请求向另一个域发送请求。只要协议、域名、端口有任何一个不同,都被当作是不同的域。为了解决这一问题,有很多方法,大家首先想到的就是用jsonp这确实是一个很不错的方法

一.通过jsonp来解决跨域问题

首先来看看在页面中如何使用jQuery的ajax解决跨域问题的简单版:

@H_502_34@$(document).ready(function(){ var url='http://localhost:8080/WorkGroupManagment/open/getGroupById" +"?id=1&callback=?'; $.ajax({ url:url,dataType:'jsonp',processData: false,type:'get',success:function(data){ alert(data.name); },error:function(XMLHttpRequest,textStatus,errorThrown) { alert(XMLHttpRequest.status); alert(XMLHttpRequest.readyState); alert(textStatus); }}); });

这样写是完全没有问题的,起先error的处理函数中仅仅是alert(“error”),为了进一步弄清楚是什么原因造成了错误,故将处理函数变为上面的实现方式。最后一行alert使用为;parsererror。百思不得其解,继续google,最终还是在万能的stackoverflow找到了答案,链接这里。原因是jsonp的格式与json格式有着细微的差别,所以在server端的代码上稍稍有所不同。

比较一下json与jsonp格式的区别:

json格式:
@H_502_34@{ "message":"获取成功","state":"1","result":{"name":"工作组1","id":1,"description":"11"} }
jsonp格式:
@H_502_34@callback({ "message":"获取成功","description":"11"} })

看出来区别了吧,在url中callback传到后台的参数是神马callback就是神马,jsonp比json外面有多了一层,callback()。这样就知道怎么处理它了。于是修改后台代码

后台java代码最终如下:

@H_502_34@@RequestMapping(value = "/getGroupById") public String getGroupById(@RequestParam("id") Long id,HttpServletRequest request,HttpServletResponse response) throws IOException { String callback = request.getParameter("callback"); ReturnObject result = null; Group group = null; try { group = groupService.getGroupById(id); result = new ReturnObject(group,"获取成功",Constants.RESULT_SUCCESS); } catch (BusinessException e) { e.printStackTrace(); result = new ReturnObject(group,"获取失败",Constants.RESULT_Failed); } String json = JsonConverter.bean2Json(result); response.setContentType("text/html"); response.setCharacterEncoding("utf-8"); PrintWriter out = response.getWriter(); out.print(callback + "(" + json + ")"); return null; } 虽然这样解决了跨域问题,还是回顾下造成parsererror的原因。原因在于盲目的把json格式的数据当做jsonp格式的数据让ajax处理,造成了这个错误

这里还有其他的几种方法,我将连接放在下面
重点看第一个
http://kb.cnblogs.com/page/139725/
http://blog.snsgou.com/post-875.html
http://www.jb51.net/article/42629.htm

哎,头疼,今天起早了
原文链接:https://www.f2er.com/ajax/163360.html

猜你在找的Ajax相关文章