WebMvcConfigurer的跨域配置

一、什麼是跨域？

跨域（Cross-origin）是指在瀏覽器端，一個頁面從一個域名跳轉到另一個域名的過程。在這個過程中，如果跳轉的頁面訪問了另一個域名下的資源，比如Ajax訪問API、通過iframe載入資源等，就會涉及到跨域問題。跨域問題是一個很普遍的網路安全問題，瀏覽器提供了一些機制限制頁面的跨域訪問，包括限制Cookie、dom訪問、數據讀取等。

二、為什麼需要跨域配置？

在開發中，通常會存在多個應用系統，有時候需要在這些系統之間進行數據的共享和交換，這時候就會出現跨域問題。跨域的目的是為了限制JavaScript對不同源（domain）的訪問，進而保障了網路安全。但是在某些場景下，如果跨域沒有設置，將會無法正常調用API或者無法獲取到相關資源，導致應用程序無法正常工作。

三、在Spring Boot中配置跨域

Spring Boot通過WebMvcConfigurer類提供了一個非常方便的方式來解決跨域問題。要開啟跨域支持，首先需要創建一個WebMvcConfigurer類，並實現addCorsMappings方法。該方法將會配置跨域請求處理的細節，包括允許哪些域名、方法、響應頭等。

@Configuration
public class CorsConfiguration implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("*")
                .allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")
                .maxAge(3600)
                .allowedHeaders("*")
                .allowCredentials(true);
    }
}

代碼解釋：

1. addMapping：允許跨域訪問的路徑
2. allowedOrigins：允許跨域訪問的域名，設置成「*」表示允許所有來源
3. allowedMethods：允許跨域訪問的請求方法
4. maxAge：緩存時間，在該時間內只需再次發起預檢請求
5. allowedHeaders：允許跨域訪問的請求頭
6. allowCredentials：是否允許發送Cookie，默認為false

四、Spring Boot跨域配置中的注意點

在進行跨域配置的時候，需要注意以下幾點：

1. 支持OPTIONS請求

在進行跨域請求時，會先發一個OPTIONS請求，通過該請求獲取伺服器的響應，然後才會發送真正的請求。因此必須在跨域配置中加入OPTIONS請求。

@Override
public void addCorsMappings(CorsRegistry registry) {
    registry.addMapping("/**")
            .allowedOrigins("*")
            .allowedMethods("*")
            .allowedHeaders("*")
            .allowCredentials(true)
            .maxAge(3600);
}

2. 支持帶Cookie的請求

默認情況下，跨域是不支持帶Cookie的請求的，可以通過以下配置開啟Cookie支持。

@Override
public void addCorsMappings(CorsRegistry registry) {
    registry.addMapping("/**")
            .allowedOrigins("*")
            .allowedMethods("*")
            .allowedHeaders("*")
            .allowCredentials(true)
            .maxAge(3600);
}

需要注意的是，允許帶Cookie時會增加安全風險，只應在必要時開啟。

3. 配置粒度優化

如果想對某個具體的Controller進行跨域配置，可以直接在該Controller中配置。例如下面的代碼只對UserController進行跨域配置，而不是全局配置：

@RestController
@RequestMapping("/users")
public class UserController {

    @CrossOrigin(origins = "*", maxAge = 3600)
    @GetMapping
    public List getAllUsers() {
        return userService.getAllUsers();
    }

}

需要注意的是，使用@CrossOrigin註解需要搭配配置類中的.addMapping(“/users”)或全部路徑.addMapping(“/**”)，否則@CrossOrigin註解將不會生效。

五、使用Spring Security配置跨域

在使用Spring Security時，可能會因為跨域而無法進行正常訪問，需要進行相應的配置，與跨域配置一樣，同樣需要重寫WebSecurityConfigurerAdapter中的configure方法。

@Configuration
@EnableWebSecurity
public class SecurityConfig extends WebSecurityConfigurerAdapter {

    @Autowired
    public void configureGlobal(AuthenticationManagerBuilder auth) throws Exception {
        auth.userDetailsService(customUserDetailsService).passwordEncoder(passwordEncoder());
    }

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http.csrf().disable()
            .authorizeRequests()
            .antMatchers("/api/**").permitAll()
            .anyRequest().authenticated()
            .and().cors().configurationSource(corsConfigurationSource())
    }

    @Bean
    CorsConfigurationSource corsConfigurationSource() {
        CorsConfiguration configuration = new CorsConfiguration();
        configuration.addAllowedOrigin("*");
        configuration.addAllowedHeader("*");
        configuration.addAllowedMethod("*");
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/api/**", configuration);
        return source;
    }
}

代碼解釋：

1. anyRequest().authenticated()：要求所有請求都要經過認證
2. cors()：開啟跨域
3. configurationSource()：屬性配置

六、總結

在跨域請求的過程中，可以通過配置WebMvcConfigurer或Spring Security來解決跨域問題。正確地配置跨域可以使得應用程序順暢地工作，增強了跨系統之間的數據共享與交換。