优雅的解决跨域问题

0、浏览器跨域问题

看到浏览器报 Access-Control-Allow-Origin 毫无疑问了，看来是跨域问题

CORS 是一种访问机制，英文全称是 Cross-Origin Resource Sharing，即我们常说的跨域资源共享，通过在服务器端设置响应头，把发起跨域的原始域名添加到 Access-Control-Allow-Origin 即可

浏览器端：发送 AJAX 请求前需设置通信对象 XHR 的 withCredentials 属性为 true。

服务器端：设置 Access-Control-Allow-Credentials 为 true。

两个条件缺一不可，否则即使服务器同意发送 Cookie！

Access-Control-Allow-Methods 表示允许哪些跨域请求的提交方式。（例如 GET/POST）

Access-Control-Allow-Headers 表示跨域请求的头部的允许范围。

Access-Control-Expose-Headers 表示允许暴露哪些头部信息给客户端。

Access-Control-Max-Age 表示预检请求的最大缓存时间。

1、返回新的 CorsFilter

这是一种全局跨域的方式

在任意配置类，返回一个新的 CorsFilter Bean，并添加映射路径和具体的 CORS 配置信息。

package edu.xpu.cors.config;

@Configuration
public class GlobalCorsConfig {
    @Bean
    public CorsFilter corsFilter() {
        //1.添加CORS配置信息
        CorsConfiguration config = new CorsConfiguration();
          //放行哪些原始域
          config.addAllowedOrigin("*");
          //是否发送Cookie信息
          config.setAllowCredentials(true);
          //放行哪些原始域(请求方式)
          config.addAllowedMethod("*");
          //放行哪些原始域(头部信息)
          config.addAllowedHeader("*");
          //暴露哪些头部信息（因为跨域访问默认不能获取全部头部信息）
          config.addExposedHeader("*");

        //2.添加映射路径
        UrlBasedCorsConfigurationSource configSource = new UrlBasedCorsConfigurationSource();
        configSource.registerCorsConfiguration("/**", config);

        //3.返回新的CorsFilter.
        return new CorsFilter(configSource);
    }
}
​

2、重写 WebMvcConfigurer

在任意配置类，返回一个新的 WebMvcConfigurer Bean，并重写其提供的跨域请求处理的接口，目的是添加映射路径和具体的 CORS 配置信息。

package edu.xpu.cors.config;

@Configuration
public class GlobalCorsConfig {
    @Bean
    public WebMvcConfigurer corsConfigurer() {
        return new WebMvcConfigurer() {
            @Override
            //重写父类提供的跨域请求处理的接口
            public void addCorsMappings(CorsRegistry registry) {
                //添加映射路径
                registry.addMapping("/**")
                        //放行哪些原始域
                        .allowedOrigins("*")
                        //是否发送Cookie信息
                        .allowCredentials(true)
                        //放行哪些原始域(请求方式)
                        .allowedMethods("GET","POST", "PUT", "DELETE")
                        //放行哪些原始域(头部信息)
                        .allowedHeaders("*")
                        //暴露哪些头部信息（因为跨域访问默认不能获取全部头部信息）
                        .exposedHeaders("Header1", "Header2");
            }
        };
    }
}
​