使用getJSON解决jquery跨域问题
发布时间:2020-12-16 19:59:38 所属栏目:百科 来源:网络整理
导读:Ajax的应用中,由于安全的问题,浏览器默认是不支持跨域调用的。传统解决的方法,包括:(参考http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/) Local proxy:Needs infrastructure (can't run a serverless client) and you getdouble-ta
Ajax的应用中,由于安全的问题,浏览器默认是不支持跨域调用的。传统解决的方法,包括:(参考http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/) Local proxy: Needs infrastructure (can't run a serverless client) and you getdouble-taxed on bandwidth and latency (remote - proxy - client). Flash: Remote host needs to deploy a crossdomain.xml file,Flash isrelatively proprietary and opaque to use,requires learning a one-offmoving target programming langage. Script tag: Difficult to know when the content is available,no standard methodology,can be considered a "security risk". 以上方法都各有缺陷,都不是很好多解决方案。后来出现了一种叫JSON with Padding的技术,简称 JSONP.(原理参考 http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/),应用JSONP可以实现JSON数据的跨域调用。非常的幸运,JQuery1.2以后支持JSONP的应用。下面侧重说明在JQuery中,Json的跨域调用。 应用JSONP实现Json数据跨域调用,需要服务器端与客户端的合作完成。引用Jquery官方的例子,客户端掉用如下: $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?",function(data) { $.each(data.items,function(i,item) { $("<img/>").attr("src",item.media.m).appendTo("#images"); if (i == 3) return false; }); }); 注意这里调用的地址中jsoncallback=?是关键的所在!其中,符号会被Query自动替换成其他的回调方法的名称,具体过程和原理我们这里不理会。我们关心的是jsoncallback=?起什么作用了?原来jsoncallback=?被替换后,会把方法名称传给服务器。我们在服务器端要做什么工作呢?服务器要接受参数jsoncallback,然后把jsoncallback的值作为JSON数据方法名称返回,比如服务器是JSP,我们会这样做: ... String jsoncallback=request.getParameter("jsoncallback"); ... out.print(jsoncallback+"({"account":"XX","passed":"true","error":"null"})"); Jquery取得的数据可能如下: JQUET0988788({"account":"XX","passed":"true","error":"null"}) 总结,用JSONP要做两件事: 1. 请求地址加参数:jsoncallback=? 2. 服务器段把jsoncallback的值作为方法名传回来,如JQUET098788(...) 博文来源:http://www.javaeye.com/topic/260647 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |