欢迎各位兄弟 发布技术文章

这里的技术是共享的

You are here

跨域CORS原理及调用具体示例

shiping1 的头像

一个跨域的介绍
http://enable-cors.org/
http://www.html5rocks.com/en/tutorials/cors/


跨域CORS原理及调用具体示例

分类: 【Java Web】 351人阅读 评论(4) 收藏 举报
  上篇博客介绍了JSONP原理,其不足,就是只能使用GET提交,若传输的数据量大,这个JSONP方式就歇菜了。那这篇博客就来介绍另一种跨域介绍方案—CORS。
  相对JSONP,CORS支持POST提交,并且实施起来灰常简单,CORS原理只需要向响应头header中注入Access-Control-Allow-Origin,这样浏览器检测到header中的Access-Control-Allow-Origin,则就可以跨域操作了。
  
  具体实现如下:
  前台使用普通的Ajax提交方式,跟普通访问一样,无需更改。
  
  1. $.ajax({  
  2.  url:"http://localhost:8080/crcp/rcp/t99eidt/testcors.do",  
  3.  async :false,  
  4.  type:"POST",  
  5.  success:function(data){  
  6.  var a=JSON.parse(data);  
  7.  var html=JSON.stringify(a.RESULTSET);  
  8.  $("#testcors").html(html);  
  9.  },  
  10.  error:function(){  
  11.  alert("error");  
  12.  }  
  13.  });  
   服务器Action方法如下:
  1.    public void testCors() throws Exception{  
  2. JSONObject jsonObject=new JSONObject();  
  3. List list=new ArrayList();  
  4. for(int i=0;i<4;i++){  
  5. Map paramMap=new HashMap();  
  6. paramMap.put("bank_no", 100+i);  
  7. paramMap.put("money_type", i);  
  8. paramMap.put("bank_name", "测试代码"+i);  
  9. paramMap.put("bank_type", i);  
  10. paramMap.put("bank_status", 0);  
  11. paramMap.put("en_sign_ways", 1);  
  12. list.add(paramMap);  
  13. }  
  14. JSONArray rows=JSONArray.fromObject(list);  
  15. jsonObject.put("RESULTSET", rows);  
  16. HttpServletRequest request=ServletActionContext.getRequest();  
  17. HttpServletResponse response=ServletActionContext.getResponse();  
  18. response.setHeader("Access-Control-Allow-Origin", "*");  
  19. response.setCharacterEncoding("UTF-8");  
  20. Writer out = response.getWriter();  
  21.         System.out.println(jsonObject.toString());  
  22. out.write(jsonObject.toString());  
  23. }  
   response.setHeader("Access-Control-Allow-Origin", "*");这句代码中*代码,服务器允许任何人访问。当然可以设置规定访问的域名。比如只允许http://localhost:8080/crcp这个域下的访问。则把*代替成这个域名即可。
 
   响应图如下:
 CORS实现起来比较简单,但是缺点是支持浏览器有限。目前支持的浏览器版本如下【摘自其他博客】

来自 http://blog.csdn.net/yuebinghaoyuan/article/details/32723753
普通分类: