CORS

CORS是一个 W3C 标准,全称是”跨域资源共享”(Cross-origin resource sharing)。 它允许浏览器向跨源服务器,发出 XMLHttpRequest 请求,从而克服了 AJAX 只能同源使用的限制。

这个技术产生的背景是由于安全的考虑,浏览器会禁止读取跨域名的资源,比如你在 taobao.com 域名下请求 baidu.com 域名的服务,就被禁止啦。

我们在前端调用 Ajax 就会经常遇到这样的错误

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at $somesite

当我们在控制台里看到这样的错误信息,那就说明请求跨域啦

跨域这个在前后端调用比较频繁,不同的域名访问就会发生跨域

CORS 技术就是相当于开个信任的通道,让服务器信任调用方解决跨域的问题

关于它的内部机制,查看阮一峰的文章介绍的比较详细 跨域资源共享 CORS 详解 

我们这里主要来看 SpringBoot 如何支持 CORS 请求,实际上非常简单,我们推荐使用 Filter 方式来解决


package com.youkeda.comment;

import org.springframework.boot.web.servlet.FilterRegistrationBean;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;

import java.time.Duration;

@Configuration
public class CorsConfig {

    @Bean
    public FilterRegistrationBean corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        CorsConfiguration config = new CorsConfiguration();
        config.setAllowCredentials(true);
        // 设置你要允许的网站域名,如果全允许则设为 *
        config.addAllowedOrigin("*");
        // 如果要限制 HEADER 或 METHOD 请自行更改
        config.addAllowedHeader("*");
        config.addAllowedMethod("*");
        config.setMaxAge(Duration.ofDays(5));
        source.registerCorsConfiguration("/**", config);
        FilterRegistrationBean bean = new FilterRegistrationBean(new CorsFilter(source));
        // 这个顺序很重要哦,为避免麻烦请设置在最前
        bean.setOrder(0);
        return bean;
    }
}

如上,只要在工程里创建 CorsConfig 这个类就可以了,代码如上主要是自定义了一个 Filter 拦截所有的请求从而完成 Cors 的配置。由于这个配置是一次性的,所以工程如果没有这个配置,或者看到错误,就要添加一下

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at $somesite