SpringCloud微服務中跨域配置的方法詳解

更新時間：2023年02月03日 08:30:58 作者：ldcaws

在使用SpringCloud實現(xiàn)微服務時，經(jīng)常會碰到前端頁面訪問多個二級域名的情況，跨域是首先要解決的問題。解決這個問題，可以從兩方面入手，一種方案是在微服務各自的業(yè)務模塊中實現(xiàn)，即在SpringBoot層實現(xiàn)，另外一種方案就是在Gateway層實現(xiàn)

跨域，指的是瀏覽器不能執(zhí)行其他網(wǎng)站的腳本。它是由瀏覽器的同源策略造成的，是瀏覽器對 javascript 施加的安全限制。

同源策略，指的是協(xié)議，域名，端口都要相同，其中有一個不同都會產(chǎn)生跨域。

跨域相關含義：

Access-Control-Allow-Origin：服務器允許請求的源；
Access-Control-Allow-Headers: 服務器允許使用的頭；
Access-Control-Allow-Methods: 真實請求允許的方法；
Access-Control-Allow-Credentials: 是否允許用戶發(fā)送、處理 cookie；
Access-Control-Max-Age: 預檢請求的有效期，單位為秒。有效期內(nèi)，不會重復發(fā)送預檢請求；

Java微服務中解決跨域問題主要分為如下情況：

情況1：針對單個服務的跨域問題，增加允許跨域配置類即可。

如，前端vue+業(yè)務微服務

情況2：有網(wǎng)關時，網(wǎng)關配置允許跨域，微服務不配置。微服務項目網(wǎng)關服務為Spring Cloud Gateway，則要求所有請求統(tǒng)一走網(wǎng)關，無需給每個微服務都配置跨域，只需要給網(wǎng)關微服務gateway配置跨域即可。

如，前端vue+網(wǎng)關服務gateway+業(yè)務微服務

情況3：有網(wǎng)關時，網(wǎng)關配置允許跨域，微服務配置允許跨域。需要在網(wǎng)關的配置里加上重復請求頭。配置DedupeResponseHeader=Vary Access-Control-Allow-Origin Access-Control-Allow-Credentials, RETAIN_UNIQUE。此時走不走網(wǎng)關，都沒有跨域問題。

如，前端vue+網(wǎng)關服務gateway+業(yè)務微服務/認證授權微服務

情況4：網(wǎng)關不配置，微服務配置允許跨域。請求如果走網(wǎng)關，則會存在跨域問題。不走網(wǎng)關，直接訪問微服務，沒有跨域問題。

情況5：網(wǎng)關不配置，微服務不配置。走不走網(wǎng)關都會存在跨域問題。

情況1

單個springboot微服務的跨域配置如下

若springboot版本為2.4.0以前，則設置請求源為

corsConfiguration.addAllowedOrigin(“*”);

若springboot版本為2.4.0以后，則設置請求源為

corsConfiguration.setAllowedOriginPatterns(Collections.singletonList(“*”));

@Configuration
public class CorsConfig {
    @Bean
    public CorsFilter corsFilter() {
        // 跨域配置源
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        //設置跨域的配置信息
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        //1,允許任何來源
        corsConfiguration.setAllowedOriginPatterns(Collections.singletonList("*"));
        //2,允許任何請求頭
        corsConfiguration.addAllowedHeader(CorsConfiguration.ALL);
        //3,允許任何方法
        corsConfiguration.addAllowedMethod(CorsConfiguration.ALL);
        //4,允許憑證
        corsConfiguration.setAllowCredentials(true);
        source.registerCorsConfiguration("/**", corsConfiguration);
        return new CorsFilter(source);
    }
}

其中，若在springboot2.3.10版本中使用corsConfiguration.addAllowedOrigin(“*”);是可以解決跨域問題的，若在springboot2.7.0版本中使用，會發(fā)現(xiàn)報跨域問題，查看后臺日志提示如下異常：

When allowCredentials is true, allowedOrigins cannot contain the special value "*"since that cannot be set on the “Access-Control-Allow-Origin” response header. To allow credentials to a set of origins, list them explicitly or consider using “allowedOriginPatterns” instead.

可見，不能在 corsConfiguration.setAllowCredentials(true)的時候對addAllowedOrigin設置為"*"，而要使用 allowedOriginPatterns這個字段來設置origin。

其實，也可以采用重寫WebMvcConfigurer的方式或使用注解@CrossOrigin的方式。

情況2

gateway網(wǎng)關服務中跨域配置類如下

若springboot版本為2.4.0以前，則設置請求源為

corsConfiguration.addAllowedOrigin(“*”);

若springboot版本為2.4.0以后，則設置請求源為

corsConfiguration.setAllowedOriginPatterns(Collections.singletonList(“*”));

@Configuration
public class CorsConfig {
    @Bean
    public CorsWebFilter corsFilter() {
        // 跨域配置源
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        //設置跨域的配置信息
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        // 允許所有請求來源進行跨域
        //corsConfiguration.addAllowedOrigin("*");
        // spring boot2.4以后的配置
        corsConfiguration.setAllowedOriginPatterns(Collections.singletonList("*"));
        // 允許所有頭進行跨域
        corsConfiguration.addAllowedHeader("*");
        // 允許所有請求方式進行跨域
        corsConfiguration.addAllowedMethod("*");
        // 允許攜帶cookie進行跨域
        corsConfiguration.setAllowCredentials(true);
        //任意路徑都需要跨域配置
        source.registerCorsConfiguration("/**", corsConfiguration);
        return new CorsWebFilter(source);
    }
}

注：需要去掉業(yè)務微服務的跨域配置，防止多次跨域配置。

其實，也可以采用在gateway網(wǎng)關服務的application.yml文件中配置的方式，如：

spring:
cloud:
gateway:
# 全局的跨域配置
globalcors:
# 解決options請求被攔截問題
add-to-simple-url-handler-mapping: true
cors-configurations:
# 攔截的請求
'[/**]':
# 允許跨域的請求
#allowedOrigins: "*" # spring boot2.4以前的配置
allowedOriginPatterns: "*" # spring boot2.4以后的配置
# 允許請求中攜帶的頭信息
allowedHeaders: "*"
# 運行跨域的請求方式
allowedMethods: "*"
# 是否允許攜帶cookie
alloweCredentials: true
# 跨域檢測的有效期,單位s
maxAge: 36000

不要出現(xiàn)重復解決跨域問題，若之前用過注解@CrossOrigin，然后又添加了過濾器，就會導致重復，僅用過濾器就OK了。

情況3

當gateway網(wǎng)關服務設置了跨域，業(yè)務微服務也設置了跨域，則需要在網(wǎng)關的配置里加上重復請求頭，如

pring:
cloud:
gateway:
globalcors:
default-filters:
- DedupeResponseHeader=Vary Access-Control-Allow-Origin Access-Control-Allow-Headers Access-Control-Allow-Credentials,RETAIN_UNIQUE

當業(yè)務微服務集成了security+oauth2，會出現(xiàn)跨域失效的情況，需要在WebSecurityConfig配置類和ResourceServerConfig配置類中開啟CORS，如下

	@Override
    protected void configure(HttpSecurity http) throws Exception {
        http
                .cors()
                .and()
                .csrf().disable();
    }

	@Override
    public void configure(HttpSecurity http) throws Exception {
        http
                .cors()
                .and()
                .csrf().disable();
     }

當gateway網(wǎng)關微服務集成了security+oauth2，又會出現(xiàn)跨域問題，則需要在ResourceServerConfig配置類中加入跨域過濾器，如下

	@Bean
    public SecurityWebFilterChain springSecurityFilterChain(ServerHttpSecurity http) throws NoSuchAlgorithmException, IOException, InvalidKeySpecException {
        http.cors().and().csrf().disable();
		http.addFilterBefore(corsWebFiler, SecurityWebFiltersOrder.CORS);
	}

跨域問題：The ‘Access-Control-Allow-Origin’ header contains multiple values “*, *”, but only one is allowed.

分析：通?？缬騿栴}可以在三個地方解決：

在微服務的代碼中通過跨域配置類解決；
在網(wǎng)關中解決，可以通過配置類，也可以通過yml配置；
在nginx或vue中解決；

以上3種方式，若使用了2種，則會出現(xiàn)雙重跨域的問題。那么若是知道那里用了2次跨域配置，選擇去掉一個即可；若是2個地方都不想去掉，還可以在網(wǎng)關中通過yml配置來忽略掉雙重跨域的問題。

spring:
main:
allow-bean-definition-overriding: true
gateway:
discovery: 默認為false，設為true便開啟通過服務中心的自動根據(jù) serviceId 創(chuàng)建路由的功能。
locator:
enabled: true
lowerCaseServiceId: true
#解決跨域問題
globalcors:
corsConfigurations:
'[/**]':
# 允許攜帶認證信息
allow-credentials: true
# 允許跨域的源(網(wǎng)站域名/ip)，設置*為全部
allowedOrigins: "*"
# 允許跨域的method，默認為GET和OPTIONS，設置*為全部
allowedMethods: "*"
# 允許跨域請求里的head字段，設置*為全部
allowedHeaders: "*"
#解決雙重跨域 RETAIN_FIRST RETAIN_LAST RETAIN_UNIQUE
default-filters:
- DedupeResponseHeader=Access-Control-Allow-Origin Access-Control-Allow-Credentials Vary, RETAIN_UNIQUE