先後端分離項目，引入Spring Cloud Gateway遇到的一個問題！

SpringBoot實戰電商項目mall（25k+star）地址：github.com/macrozheng/…

摘要

隨着項目架構的愈來愈複雜，引入了新的技術，新的問題也在產生，本文將講述一個因爲網關引發的前端調用問題。

問題產生

個人mall項目升級到微服務架構之後，加入了基於Spring Cloud Gateway的網關係統，前端調用相關服務時應該統一從網關進行調用，本覺得前端直接調用網關沒啥問題，後來發現會產生沒法調用的狀況，下面咱們來記錄下這個問題以及解決思路。

問題重現與解決

這裏咱們以mall-swarm中的代碼爲例來演示下該問題的產生與解決。

• 首先咱們先把mall-registry、mall-config、mall-gateway、mall-admin這些服務依次啓動起來；

• 再啓動前端項目mall-admin-web；

• 訪問登陸頁面進行登陸操做，發現沒法登陸，OPTIONS請求返回狀態碼403，到此咱們還看不來是啥問題；

• 咱們點開Console來看看到底報了啥錯，發現了CORS這個關鍵信息，能夠肯定是產生了跨域問題，網關沒有支持跨域；

• 接下來只要讓網關支持跨域就能夠了，在mall-gateway中添加全局跨域配置便可：

/** * 全局跨域配置 * 注意：前端從網關進行調用時須要配置 * Created by macro on 2019/7/27. */
@Configuration
public class GlobalCorsConfig {

    @Bean
    public CorsWebFilter corsFilter() {
        CorsConfiguration config = new CorsConfiguration();
        config.addAllowedMethod("*");
        config.addAllowedOrigin("*");
        config.addAllowedHeader("*");

        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource(new PathPatternParser());
        source.registerCorsConfiguration("/**", config);

        return new CorsWebFilter(source);
    }

}
複製代碼

• 重啓mall-gateway服務，再次進行登陸操做，發現OPTIONS請求雖然經過了，可是POST請求在Console中卻報錯了：

• 分析下該問題，應該是mall-admin服務中重複設置了容許跨域的過濾器的問題，只要去除mall-admin的全局跨域配置便可；

/** * 全局跨域配置 * 注意：前端從網關進行調用時不須要配置 * Created by macro on 2019/7/27. */
//@Configuration
public class GlobalCorsConfig {

    /** * 容許跨域調用的過濾器 */
    @Bean
    public CorsFilter corsFilter() {
        CorsConfiguration config = new CorsConfiguration();
        //容許全部域名進行跨域調用
        config.addAllowedOrigin("*");
        //容許跨愈加送cookie
        config.setAllowCredentials(true);
        //放行所有原始頭信息
        config.addAllowedHeader("*");
        //容許全部請求方法跨域調用
        config.addAllowedMethod("*");
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", config);
        return new CorsFilter(source);
    }
}
複製代碼

• 從新啓動mall-admin服務後，發現已經能夠正常登陸了。

總結

當前端應用經過網關調用服務時會產生跨域問題，解決方法是在網關服務中進行全局跨域配置，同時相關服務中若是有跨域配置應該去除。

項目地址

github.com/macrozheng/…

公衆號

mall項目全套學習教程連載中，關注公衆號第一時間獲取。