跨域解决 & ajax post 请求springmvc ctr 问题-优快云博客

1何为跨域

简单的说即为浏览器限制访问A站点下的js代码对B站点下的url进行ajax请求。假如当前域名是www.abc.com，那么在当前环境中运行的js代码，出于安全考虑，正常情况下不能访问www.zzz.com域名下的资源。

例如：以下代码再本域名下可以通过js代码正常调用接口

(function() {
    var url = "http://localhost:8080/api/Home/update.json";

    var data = {
        "userId": 123,
        "userName": "wangdachui"
    };
    $.ajax({
        url: url,
        type: 'POST',
        dataType: 'json',
        data: $.toJSON(data),
        contentType: 'application/json'
    }).done(function(result) {
        console.log("success");
        console.log(result);
    }).fail(function() {
        console.log("error");
    })
})()

输出为:

Object {userId: 123, userName: "adminUpdate-wangdachui"}

但是在其他域名下访问则出错:

OPTIONS http://localhost:8080/api/Home/update.json
XMLHttpRequest cannot load http://localhost:8080/api/Home/update.json. Response to preflight request

2跨域处理流程（原理）看下图

如果你可以翻墙可以访问这篇外文（https://en.wikipedia.org/wiki/Cross-origin_resource_sharing）说的非常清楚

3解决跨域方案

（1）jsonp

使用jsonp来进行跨域是一种比较常见的方式，但是在接口已经写好的情况下，无论是服务端还是调用端都需要进行改造且要兼容原来的接口，工作量偏大，于是我们考虑其他方法。如果想了解请在网上找有很多详细解释不再此处详细解说。

（2）CORS 协议

cors 基本流程：首先发出预检验（Preflight）请求，它先向资源服务器发出一个OPTIONS方法、包含“Origin”头的请求。该回复可以控制COR请求的方法，HTTP头以及验证等信息。只有该请求获得允许以后，才会发起真实的外域请求。

最明白了结的可根据跨域流程图来看当浏览器预检测外域访问时会有一个预检（PreFlight）过程只有当资源服务器返回相应的协议才可以允许访问主要解决方案就是资源服务器设置过滤：

public class CORSFilter implements Filter {
    public void destroy() {
    }

    public void doFilter(ServletRequest req, ServletResponse resp, FilterChain chain) throws ServletException, IOException {

        HttpServletResponse response = (HttpServletResponse) resp;
        response.setHeader("Access-Control-Allow-Origin","*");
        response.setHeader("Access-Control-Allow-Methods","POST,GET,OPTIONS,DELETE");
        response.setHeader("Access-Control-Max-Age","3600");
        response.setHeader("Access-Control-Allow-Headers","Origin, X-Requested-With, Content-Type, Accept");
        response.setHeader("","");response.setHeader("","");
        chain.doFilter(req, resp);
    }

    public void init(FilterConfig config) throws ServletException {

    }

}

头注释：

Access-Control-Allow-Origin: http://foo.org

Access-Control-Max-Age: 3628800

Access-Control-Allow-Methods: GET，PUT, DELETE

Access-Control-Allow-Headers: content-type

"Access-Control-Allow-Origin"表明它允许"http://foo.org"发起跨域请求

"Access-Control-Max-Age"表明在3628800秒内，不需要再发送预检验请求，可以缓存该结果

"Access-Control-Allow-Methods"表明它允许GET、PUT、DELETE的外域请求

"Access-Control-Allow-Headers"表明它允许跨域请求包含content-type头

到此你已经完全解决了跨域问题但是我想在你做js 请求spring mvc 的ctr 比如jquery、angularjs、等等封装的ajax post 请求是总是会有一些问题，这个我据我所知是你没有把那个json字符串和json对象分清楚,或则你就是完全没有用json格式发完了就出现了415 错误。关于这个有时间再分享。

其实这些也是我在一些外文网站看了才豁然开朗的现把地址奉上，如果你可以翻墙望看原文=====》

https://en.wikipedia.org/wiki/File:Flowchart_showing_Simple_and_Preflight_XHR.svg

http://pingguohe.net/2016/03/21/ajax-solution-spring.html