jsonp实现跨域调用

jsonp服务端需要返回的格式: callback([{"id":448,"name":"ddd_xx"}]) 其实就是加个数据的方法调用封装。 注意,对于jsonp在return对象需要为null,否则返回的数据后面会多个{....},需要返回的数据可以直接PrintWrite输出。 服务端代码示例: @SuppressWarnings("unchecked") @JSON(serialize=false) publicStringalbumList()throwsIOException,JSONException{ HttpServletRequestrequest=this.getRequest(); StringuserId=request.getParameter("userId"); Stringcallback=request.getParameter("callback"); if(callback==null)callback="callback"; if(userId==null||"".equals(userId)){ returnnull; } try{ HashMap<String,Object>param=newHashMap<String,Object>(); param.put("flag",KernelConstants.STATUS_norMAL); param.put("createId",userId); param.put("orderByFlag","0"); Responseresponse=videoAlbumService.list(param); Listlist,result=null; VideoAlbumvideoAlbum=null; Mapmap=null; if(response.getReturnObject()!=null){ list=(List<VideoAlbum>)response.getReturnObject(); result=newArrayList(); for(inti=0;i<list.size();i++){ videoAlbum=(VideoAlbum)list.get(i); map=newHashMap(); map.put("name",videoAlbum.getName()); map.put("id",videoAlbum.getId()); result.add(map); } JSONArrayjsonObj=JSONArray.fromObject(result); callback=callback+"("+jsonObj+")"; super.renderText(callback); } }catch(Exceptione){ e.printstacktrace(); } returnnull; } 接下来就是客户端调用,有两种方法: <scripttype="text/javascript"src="js/jquery/jquery.js"></script> <script> //一种是ajax $.ajax({ url:category,type:'GET',dataType:'jsonp',success:function(data){ varxmlDom=newActiveXObject("Microsoft.XMLDOM") xmlDom.loadXML(data); varitem_xml=xmlDom.getElementsByTagName("item"); for(vari=0;i<item_xml.length;i++){ jsAddItemToSelect(document.getElementById("sort"),item_xml .firstChild.data,item_xml .getAttribute("Id")); } } }); //一种是简单的封装getJSON $.getJSON(url,"callback=?",function(data){ varresult=data; for(vari=0;i<result.length;i++){ jsAddItemToSelect(document.getElementById("issue"),result .name,result .id); } }); </script> 这样就实现了跨域调用 这个其实就是在服务端做了一个代理,对于我们没有权限修改的域调用数据,也可以参考此方法,把数据读回来,再传给客户端。 这种方法常用在分布式、异构环境中交换数据使用。但对于不可控制的域调用,需要注意风险,毕竟是脚本注入

相关文章

AJAX是一种基于JavaScript和XML的技术,能够使网页实现异步交...
在网页开发中,我们常常需要通过Ajax从后端获取数据并在页面...
在前端开发中,经常需要循环JSON对象数组进行数据操作。使用...
AJAX(Asynchronous JavaScript and XML)是一种用于创建 We...
AJAX技术被广泛应用于现代Web开发,它可以在无需重新加载页面...
Ajax是一种通过JavaScript和HTTP请求交互的技术,可以实现无...