采用前后端分离式开发项目过程中往往会遇到跨域问题。导致前端界面用ajax访问我电脑上的后台服务接口时,http请求会返回500的错误。这个问题是由“跨域请求”所引起的。

什么是跨域请求?

跨域请求,就是说浏览器在执行脚本文件的ajax请求时,脚本文件所在的服务地址和请求的服务地址不一样。说白了就是ip、网络协议、端口都一样的时候,就是同一个域,否则就是跨域。这是由于Netscape提出一个著名的安全策略——同源策略造成的,这是浏览器对JavaScript施加的安全限制。是防止外网的脚本恶意攻击服务器的一种措施。

SpringBoot工程如何解决跨域问题?

那么如何在SpringBoot中处理跨域问题呢?方法有很多,这里着重讲一种——利用@Configuration配置跨域。 

@Configuration
public class WebConfig implements WebMvcConfigurer {

    //解决跨域
    @Bean
    public CorsFilter corsFilter() {
        CorsConfiguration conf = new CorsConfiguration();
        conf.addAllowedHeader("*");
        conf.addAllowedMethod("*");
        conf.addAllowedOrigin("*");
        conf.setAllowCredentials(true);
        conf.setMaxAge(3600L);
        conf.addExposedHeader("set-cookie");
        conf.addExposedHeader("access-control-allow-headers");
        conf.addExposedHeader("access-control-allow-methods");
        conf.addExposedHeader("access-control-allow-origin");
        conf.addExposedHeader("access-control-max-age");
        conf.addExposedHeader("X-Frame-Options");
        conf.addExposedHeader("Content-Disposition");//文件名存放在head中
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", conf); // 4 对接口配置跨域设置
        return new CorsFilter(source);
    }


}

“*”代表全部。”**”代表适配所有接口。 
其中addAllowedOrigin(String origin)方法是追加访问源地址。如果不使用”*”(即允许全部访问源),则可以配置多条访问源来做控制。 
例如:

corsConfiguration.addAllowedOrigin("http://www.aimaonline.cn/"); 
corsConfiguration.addAllowedOrigin("http://test.aimaonline.cn/");

查看CorsConfiguration类的官方文档(http://docs.spring.io/spring/docs/4.2.x/javadoc-api/org/springframework/web/cors/CorsConfiguration.html#addAllowedOrigin-java.lang.String-) 
我们可以找到官方对setAllowedOrigins(List allowedOrigins)和addAllowedOrigin(String origin)方法的介绍。

addAllowedOrigin是追加访问源地址,而setAllowedOrigins是可以直接设置多条访问源。 
但是有一点请注意,我查看setAllowedOrigins方法源码时发现,源码如下
 

public void setAllowedOrigins(List<String> allowedOrigins) {
        this.allowedOrigins = allowedOrigins != null?new ArrayList(allowedOrigins):null;
}

根据源码可以得知,setAllowedOrigins会覆盖this.allowedOrigins。所以在配置访问源地址时, 
addAllowedOrigin方法要写在setAllowedOrigins后面,当然了,一般情况下这两个方法也不会混着用。

配置Cros的其他几种方式

当然。除了用这种初始化配置的方法设置跨域问题,在官方的文档中也介绍了其他实现跨域请求的方法