今天遇到的问题是如题,简单说就是ajax的跨域问题;首先问题是这样出现的,在容器(tomcat6)之外(桌面上)新建了个测试html--test.html,调用在容器中的项目xxx中的方法,所有流程代码都没有问题,方法中返回的是json格式字符串,返回方式也是json像这样:
站在用户的角度思考问题，与客户深入沟通，找到江门网站设计与江门网站推广的解决方案，凭借多年的经验，让设计与互联网技术结合，创造个性化、用户体验好的作品，建站类型包括：做网站、网站设计、企业官网、英文网站、手机端网站、网站推广、主机域名、网页空间、企业邮箱。业务覆盖江门地区。
json
页面代码:
$.get("http://localhost:8080/xxx/queryInfo.action?id=111",
function(data){
alert(data.name)
},"json")
使用FF的firebug调试发现test.html的请求已经通过,服务器状态200,延时40ms,但是整个请求是红色的代表错误;之后把test.html中的请求URL粘贴到地址栏,发现一切正常,之后纠结中....
使用chrome的控制台调试发现:
XMLHttpRequest cannot load http://localhost:8080/xxx/queryInfo.action?id=111 .No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
度娘之后发现是跨域的问题,
参考http://www.cnblogs.com/chopper/archive/2012/03/24/2403945.html 后将代码改为
$.get("http://localhost:8080/xxx/queryInfo.action?id=111&callback=?",
function(data){
alert(data.name)
},"jsonp")
之后调试发现报Uncaught SyntaxError: Unexpected token : 这个错误,打开错误代码发现返回的json格式错误,原因是在请求headers里加了这么2段
callback:jQuery110209291235436685383_1437019561773
_:1437019561774
然后就解析不了第二个":",所以就报错Unexpected token :
继续度娘之后发现是对于jsonp来说有特殊格式需要改,
参考http://kb.cnblogs.com/page/139725/ 后发现是需要改变返回值的封装,但是没有现成的json转jsonp的工具,技术,封装类(比如string转json之类的工具),需要手动写,果断放弃继续调试...
继续度娘无意间发现这个帖子
http://blog.csdn.net/z69183787/article/details/45896577 将struts.xml文件中返回值加一条
callback
完美解决~
至此困扰2个多小时的问题解决,特此记录
PS:jquery 中对于jsonp的封装,对get类型请求支持比较好,建议用GET方法请求,最好不要用POST
又PS:还有一种暴力跨域方法,貌似只支持chrome和安卓系统,
参考http://camnpr.com/archives/chrome-args-disable-web-security.html ,方法就是使用--disable-web-security 这个参数强行中止跨域安全检查,最后结果是一样的,但是安全性嘛,知乎用户很好的解答了这个问题http://www.zhihu.com/question/27817605