JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象。但在安全限制的同时也给注入iframe或是ajax应用上带来了不少麻烦。这里把涉及到跨域的一些问题简单地整理一下:
首先什么是跨域,简单地理解就是因为JavaScript同源策略的限制,a.com 域名下的js无法操作b.com或是c.a.com域名下的对象。更详细的说明可以看下表:
特别注意两点:
第一,如果是协议和端口造成的跨域问题“前台”是无能为力的,
第二:在跨域问题上,域仅仅是通过“URL的首部”来识别而不会去尝试判断相同的ip地址对应着两个域或两个域是否在同一个ip上。
“URL的首部”指window.location.protocol +window.location.host,也可以理解为“Domains, protocols and ports must match”。
接下来简单地总结一下在“前台”一般处理跨域的办法,后台proxy这种方案牵涉到后台配置,这里就不阐述了,有兴趣的可以看看yahoo的这篇文章:《JavaScript: Use a Web Proxy for Cross-Domain XMLHttpRequest Calls》
以下截图为js调用接口出现跨域问题:
加window.name参数 + 配置Allow-Origin头 可处理:
接口做这两个处理的部分代码如下:
JSONObject json = new JSONObject(); //跨域参数 String origin = request.getHeader("Origin") == null? "www.baidu.com.cn" : request.getHeader("Origin"); response.setHeader("Access-Control-Allow-Credentials", "true"); response.setHeader("Access-Control-Allow-Origin", origin); String windowName = env.param("windowName", null); //window.name if("POST".equals(method)){ //判断方法是否post .... }else{ json.put("uri", uri); json.put("result", "0"); json.put("msg", "请求方法不是POST,操作失败"); } if (!T.isBlank(windowName) && "1".equals(windowName)) { request.setAttribute("json", "<script>window.name='" + json.toJSONString() + "';</script>"); } else { request.setAttribute("json", json.toJSONString()); }
接口做了以上两个处理,能解决跨域问题,能成功post数据到接口了。
备注:上图代码中origin跨域代码中,更优写法如下:
//跨域参数 String origin = request.getHeader("Origin"); if (!T.isBlank(origin)) { response.setHeader("Access-Control-Allow-Credentials", "true"); response.setHeader("Access-Control-Allow-Origin", origin); }
http://www.cnblogs.com/rainman/archive/2011/02/20/1959325.html