您的位置:首页 > Web前端 > JQuery

jQuery Ajax 跨域调用

2011-08-04 00:00 1926 查看

最近一直在做电子商务方面的项目,包括买家和卖家后台 分别在linuxidc.com 和linuxidc.net 还有前台www.6688.cc
其中有一个查看商品二级分类的下拉框 需要查询 当时没有考虑到这三个项目都会用到 就放到了前台的代码中,后台需求的变化,卖家和买家后台也要用到这个接口。

由于初始化前台页面的时候是用ajax的方式初始化这个下拉框的,所以其他的平台的调用也想到了这个问题,紧接着就遇到ajax跨域的问题 ,下面来提供解决的方法。

下面是action的代码 由三个系统共同调用

  1. public class HeadAction extends BaseAction{  
  2.   
  3.     private HttpServletRequest request;  
  4.     private HttpServletResponse response;  
  5.     public void findSecondCat(){  
  6.         ActionContext ctx = ActionContext.getContext();  
  7.         request = (HttpServletRequest) ctx.get(ServletActionContext.HTTP_REQUEST);  
  8.         response = (HttpServletResponse)ctx.get(ServletActionContext.HTTP_RESPONSE);   
  9.         //response.setHeader("Cache-Control", "no-cache");   
  10.         response.setContentType("text/json;charset=utf-8");  
  11.         String catType = request.getParameter("catType");  
  12.         List<CategoryNode> node = CategoryCache.getAllCategoryNodes(1, Integer.parseInt(catType));//调用缓存查询分类   
  13.         try {  
  14.             PrintWriter  out = response.getWriter();  
  15.             JSONArray ja = new JSONArray();  
  16.             for(CategoryNode c: node){//返回json格式   
  17.                 JSONObject j = new JSONObject();  
  18.                 j.put("id", c.ID);  
  19.                 j.put("name", c.Name);  
  20.                 ja.add(j);  
  21.             }  
  22.               
  23.               String cb = request.getParameter("callback");//若果是ajax请求会带这个参数 你可以firfox的firbug跟踪一下就看到了     
  24.               if(cb != null){//如果是跨域   
  25.                   StringBuffer sb = new StringBuffer(cb);  
  26.                   sb.append("(");  
  27.                   sb.append(ja.toString());  
  28.                   sb.append(")");  
  29.                   out.write(sb.toString());  
  30.                     out.close();  
  31.               }else{//不跨域的情况   
  32.                   out.write(ja.toString());  
  33.                     out.close();  
  34.               }  
  35.         } catch (IOException e) {  
  36.             e.printStackTrace();  
  37.         }  
  38.           
  39.     }  
  40. }  
下面是js代码
  1. $.ajax( {  
  2.                 type : 'get',  
  3.                 url : '<%=com.utils.PubConstant.wwwDomain %>/index/findSecondCat.action',  
  4.                 data : {  
  5.                     catType : 1  
  6.                 },  
  7.                 dataType : 'jsonp',//跨域必须用jsonp   
  8.                 error : function() {  
  9.                 },  
  10.                 success : function(data) {  
  11.                             innerOption = "<option value=''>全部分类</option>";  
  12.                             for(var i=0;i<data.length;i++){  
  13.                                  innerOption += '<option value="'+data[i].id+'">'+data[i].name+'</option>';  
  14.                              };  
  15.                             $('#secondCatIdId').html(innerOption);  
  16.                             $("#lang, #secondCatIdId").jListbox();  
  17.                 }  
  18.             });  
这样就可以跨域进行ajax请求了。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jQuery