Spring Boot跨域详解

Spring Boot跨域

什么是跨域

跨域（Cross-Origin Resource Sharing, CORS）是一种机制，用于允许或限制在一个源（origin）上运行的web应用访问另一个源的资源。

“源”是由协议、域名（或IP地址）和端口号组成的组合。例如，考虑两个源：
http://example.com和http://api.example.com，尽管这两个URL共享相同的顶级域名example.com，但由于它们具有不同的子域，因此它们被视为不同的源。

URL由 协议、域名、端口和路径组成，如果两个URL的协议、域名和端口全部相同，则表示他们同源。否则，只要协议、域名、端口有任何一个不同，就是跨域。
下面举几个例子说明：

请求发起源	请求目标URL	跨域情况	原因
http://example.com	http://example.com/about	不跨域	同源
http://example.com	https://example.com/about	跨域	协议不同
http://example.com	http://example.com:8080/about	跨域	端口不同
http://example.com	http://www.example.com/about	跨域	子域名不同
https://api.example.com	https://example.com/user	跨域	子域名不同
http://example.com:8080	http://example.com:8081/about	跨域	端口不同
http://example.com	http://example.com/about?param=1	不跨域	同源，参数不影响同源策略
https://example.com	http://api.example.com/data	跨域	协议不同和子域名不同

非同源限制

同源策略主要限制了以下几种跨源的web页面活动：

• DOM访问：不允许跨源的脚本访问或修改另一个源的文档内容。
• Web数据请求：如AJAX请求不能直接访问或交互与发起请求不同源的数据或服务。
• Cookie、LocalStorage和IndexedDB：Web存储API也受到同源策略的限制，脚本只能访问设置它们的同源数据。

Cross-origin resource sharing

Cross-Origin Resource Sharing (CORS) 是一个W3C标准，允许服务器放宽同源策略的限制。默认情况下，出于安全考虑，web浏览器禁止网页发起与其所在域不同的服务器进行交互。CORS为web应用定义了一种在必要时允许跨域访问资源的方式。

工作原理

它允许浏览器向跨源(协议 + 域名 + 端口)服务器，发出XMLHttpRequest请求，从而克服了AJAX只能同源使用的限制。CORS需要浏览器和服务器同时支持。它的通信过程，都是浏览器自动完成，不需要用户参与。

当一个请求需要进行CORS检查时，浏览器自动在这个请求的HTTP头信息中加入一些额外的信息，其中包括：

1. Origin: 发起请求的页面的源信息。
2. Access-Control-Request-Method: 应用请求访问资源时所使用的方法。
3. Access-Control-Request-Headers (如果请求中包含自定义头信息): 请求希望携带的头信息。
   服务器根据这些信息决定是否允许跨域请求。如果服务器允许请求，它会在响应中包含相应的Access-Control-Allow-*头信息。

重要的CORS响应头

• Access-Control-Allow-Origin: 指定了允许访问该资源的外部域。
• Access-Control-Allow-Methods: 指定了允许的HTTP请求方法。
• Access-Control-Allow-Headers: 在实际请求中允许携带的头信息字段。
• Access-Control-Allow-Credentials: 表示是否允许发送Cookie。
• Access-Control-Max-Age: 指定了预检请求的结果能够被缓存多长时间。

简单请求 vs 预检请求

CORS请求可以分为两类：简单请求和预检请求。

满足以下条件之一的请求被视为简单请求：使用GET, POST或HEAD方法之一。
HTTP头信息不超出以下几种字段：Accept, Accept-Language, Content-Language, Content-Type (但仅限于application/x-www-form-urlencoded, multipart/form-data, 或text/plain)。

预检请求（Preflight Request）：是对于那些可能对服务器数据有副作用的HTTP请求（如HTTP PUT, DELETE, CONNECT, OPTIONS, TRACE, 或PATCH），浏览器首先使用HTTP OPTIONS方法发送一个预检请求到服务器，以验证实际请求是否安全。

Spring Boot解决跨域

全局跨域和跨域

全局跨域：

定义：全局跨域是指在整个应用范围内设置CORS策略，使得所有的请求都遵循相同的跨域规则。
适用场景：适用于整个应用的跨域请求都具有相同的限制和要求的情况。例如，如果整个应用的前端和后端都托管在相同的域名下，但需要与其他域名的API进行交互，则可以通过全局跨域配置来设置这些API的访问权限。

局部跨域：

定义：局部跨域是指在特定的控制器或处理器方法中设置CORS策略，使得只有特定的请求路径遵循跨域规则。
适用场景：适用于应用中只有部分请求需要进行跨域设置的情况。例如，只有某些API需要与其他域名的前端应用进行交互，而其他API则只允许同源访问。在这种情况下，可以通过局部跨域配置来灵活地控制跨域请求的行为。

对于 CORS的跨域请求，主要有以下6种方式可供选择：

1. 使用注解 @CrossOrigin
2. 返回新的CorsFilter
3. 重写 WebMvcConfigurer
4. 重写 WebMvcConfigurationSupport
5. 手动设置响应头 (HttpServletResponse)
6. 自定 web filter 实现跨域

注意:

• CorFilter / WebMvConfigurer / @CrossOrigin 需要 SpringMVC 4.2以上版本才支持，对应springBoot 1.3版本以上
• 上面前两种方式属于全局 CORS 配置，后两种属于局部 CORS配置。如果使用了局部跨域是会覆盖全局跨域的规则，所以可以通过 @CrossOrigin 注解来进行细粒度更高的跨域资源控制。
• 其实无论哪种方案，最终目的都是修改响应头，向响应头中添加浏览器所要求的数据，进而实现跨域

使用注解 @CrossOrigin

Spring提供的@CrossOrigin注解可以用于控制器（Controller）类或其处理器方法上。这是实现CORS的最简单方法，适用于简单的跨域请求场景。

• 在方法上使用：

@CrossOrigin(origins = "http://example.com")
@GetMapping("/greeting")
public String greeting() {
    return "Hello, World";
}

• 在类上使用：

@CrossOrigin(origins = "http://example.com")
@RestController
public class MyController {
    // 控制器方法
}

返回新的CorsFilter(全局跨域)

定义一个配置类，然后在该类中添加一个方法，该方法生成并返回一个CorsFilter类型的Bean。

@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 corsConfigurationSource = new UrlBasedCorsConfigurationSource();
        corsConfigurationSource.registerCorsConfiguration("/**",config);
        //3. 返回新的CorsFilter
        return new CorsFilter(corsConfigurationSource);
    }
}

重写 WebMvcConfigurer

通过实现WebMvcConfigurer接口并重写addCorsMappings方法，可以全局配置CORS，适用于需要统一管理跨域配置的场景。

还可以通过继承WebMvcConfigurerAdapter类来实现，但是在Spring 5版本中已经被弃用。
如果项目使用的是Spring 5及以上版本，建议遵循新的标准，直接实现WebMvcConfigurer接口

@Configuration
public class WebConfig implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("http://example.com")
                .allowedMethods("GET", "POST", "PUT", "DELETE")
                .allowCredentials(true)
                .allowedHeaders("*");
    }
}

官方推荐直接实现WebMvcConfigurer

重写WebMvcConfigurationSupport

WebMvcConfigurationSupport是webmvc的配置类，如果在springboot项目中，有配置类继承了WebMvcConfigurationSupport，那么webmvc的自动配置类WebMvcAutoConfiguration就会失效。
缺点：配置量较大，实现比较复杂，因此在日常开发中使用WebMvcConfigurationSupport并不常见。

例子：

@Configuration
public class WebMvcConfig extends WebMvcConfigurationSupport {
    @Override
    protected void addResourceHandlers(ResourceHandlerRegistry registry) {

        log.info("开始进行静态资源映射...");
        //静态资源映射
        //配置配置addResourceHandler和addResourceLocations，可以使得可以从磁盘中读取图片、视频、音频等
        //注意：addResourceLocations后面的路径要以 / 结尾，不然会拼接到文件名的前面
        registry.addResourceHandler("/backend/**").addResourceLocations("classpath:/backend/");
        registry.addResourceHandler("/front/**").addResourceLocations("classpath:/front/");
        registry.addResourceHandler("doc.html").addResourceLocations("classpath:/META-INF/resources/");
        registry.addResourceHandler("/webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/");

    }


    /**
     * 扩展mvc框架的消息转换器
     * @param converters
     */
    @Override
    protected void extendMessageConverters(List<HttpMessageConverter<?>> converters) {
        log.info("扩展消息转换器...");
        //创建消息转换器对象
        MappingJackson2HttpMessageConverter messageConverter = new MappingJackson2HttpMessageConverter();
        //设置对象转换器，底层使用Jackson将Java对象转为json
        messageConverter.setObjectMapper(new JacksonObjectMapper());
        //将上面的消息转换器对象追加到mvc框架的转换器集合中
        converters.add(0,messageConverter);
    }
    }

手动设置响应头(局部跨域)

使用 HttpServletResponse 对象添加响应头(Access-Control-Allow-Origin)来授权原始域，这里 Origin的值也可以设置为 “*”,表示全部放行。

@GetMapping("/custom-cors")
    public String customCorsMethod(HttpServletResponse response) {
        // 设置允许哪个域名请求
        response.setHeader("Access-Control-Allow-Origin", "*");
        // 设置允许的请求方式
        response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
        // 设置允许的header类型
        response.setHeader("Access-Control-Allow-Headers", "Content-Type");
        // 预检请求的结果缓存时间,单位是秒
        response.setHeader("Access-Control-Max-Age", "3600");
        // 是否支持cookie跨域
        response.setHeader("Access-Control-Allow-Credentials", "true");

        // 处理实际的业务逻辑
        return "Custom CORS Configured Response";
    }

虽然这种方式灵活性很高，但它也要求对CORS规范有较深的了解，并且需要更多的手动代码编写和维护。

使用自定义filter实现跨域

public class CorsFilter implements Filter {

  public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
      HttpServletResponse response = (HttpServletResponse) res;
      HttpServletRequest request = (HttpServletRequest) req;

      response.setHeader("Access-Control-Allow-Origin", "http://example.com");
      response.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
      response.setHeader("Access-Control-Allow-Headers", "Authorization, Content-Type");
      response.setHeader("Access-Control-Allow-Credentials", "true");

      if ("OPTIONS".equalsIgnoreCase(request.getMethod())) {
          response.setStatus(HttpServletResponse.SC_OK);
      } else {
          chain.doFilter(req, res);
      }
  }

  public void init(FilterConfig filterConfig) {}
  public void destroy() {}
}

优点：提供了对CORS响应最细致的控制。
缺点：实现复杂，对CORS机制理解要求高。