SpringBoot跨域 Jsonp和Cors

有一次个人项目中采用了先后端分离的模式，引发了跨域问题，本文将介绍我所采用的跨域解决方法。

首先要了解产生跨域的本质，也就是同源策略的限制，源是指域名、端口号、协议，有一者不相同将被浏览器拒绝接受响应信息，（请求能够发送出去，可是浏览器不接受响应）。

解决方法：

1. jsonp

jsonp的原理的 src="" 属性不受同源策略的限制，动态建立一个callback回调函数，服务器调用回调函数把数据放进去，具体的细节打算之后作一个专门讲解。

这里给一个模版:

$.ajax({
         type: "get",               //jsonp只能使用get
         async: false,
         url: ""
         dataType: "jsonp",
         jsonp: "callback",        
         jsonpCallback:"message",       //注意这里给回调函数起的名字
             success: function(json){
             
            }
        })
复制代码

若是这里你的回调函数起名为message，那么你在后端返回json的时候，也要注意在最外面包一层message{}。

这里jsonp的肯定也能够明显的看出，只支持get请求，缘由就是由于经过src=“”发送请求，因此能够知道是url传参。

那么jsonp的好处是什么呢，兼容性，几乎全部浏览器都支持（包括一些版本比较老的），不须要XMLHttpRequest或ActiveX的支持。

2. cors

又称跨域访问，浏览器将cors请求分为简单请求和非简单请求，由于本文主要讲解具体的方法，因此关于细节部分有兴趣能够去看其余博客或者我之后再作一篇具体的讲解（和jsonp一块儿）。在springboot中，官方已经提供了支持。直接贴代码：

方式一：全局定义

@Configuration
public class CorsConfig implements WebMvcConfigurer {
    private CorsConfiguration buildConfig() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        List<String> list = new ArrayList<>();
        list.add("*");
        corsConfiguration.setAllowedOrigins(list);
        /*
        // 请求经常使用的三种配置，*表明容许全部，当时你也能够自定义属性
        （好比header只能带什么，只能是post方式等等）
        */
        corsConfiguration.addAllowedOrigin("*");    //支持的源
        corsConfiguration.addAllowedHeader("*");    //header限制
        corsConfiguration.addAllowedMethod("*");    //支持方法
        return corsConfiguration;
    }
    @Bean
    public CorsFilter corsFilter() {
        UrlBasedCorsConfigurationSource source
            = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", buildConfig());
        return new CorsFilter(source);
    }
}
复制代码

方式二：局部定义

@CrossOrigin(origins = "*",allowCredentials="true",allowedHeaders = "",methods = {})
复制代码

直接在须要跨域的方法上添加注解，不过我没试过，有兴趣或者有这种方式需求的朋友能够尝试一下。

总结：

我的推荐使用cors，若是由于兼容性问题不得不使用jsonp那也没办法。而后若是是先后端分离的模式下，对于用户权限验证这一块也是一个须要注意点，若是使用cookie-session，跨域会致使后台获取不到session，咱们能够利用token的方法来解决这个问题，我打算之后介绍一下jwt（Json web Token）来实现用户认证。

若是文中有错误，但愿你们能够热情指出。