spring boot 跨域請求

場景

網站localhost:56338要訪問網站localhost:3001的服務

在網站localhost:3001中增加CORS相關Java Config

@Configuration
@Order(Ordered.HIGHEST_PRECEDENCE)
public class CORSConfiguration {
    @Bean
    public WebMvcConfigurer corsConfigurer() {
        return new WebMvcConfigurerAdapter() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/**")
                        .allowedHeaders("*")
                        .allowedMethods("*")
                        .allowedOrigins("*")
                        .allowCredentials(true)
                        .maxAge(3600);
            }
        };
    }
}

在網站localhost:56338中測試

@section Scripts{ 
    <script>
        $.ajax({
            method: "GET",
            url: "http://localhost:3001/api/project/getProjectInfo/50",
            headers: {
                'x-auth-token':'5136E8DD7D4AFCA77FDA3A4B4541A7FB88609FCFF1C0E9C2BC0060A3DBBB14E08F9B107336A218A62C247618BBF759312653BD70E4CEDAE86D285C8D459490728B008383929E8262CB40C9B0E8C841F3531E61F01FE71A937820176D45D348CE7C375D7020B8191A0190C46A318859C6'
            },
            xhrFields: {
                withCredentials: true
            }
        }).done(function (resp) {
            console.log(resp);
        }).fail(function () {

        }).always(function () {

        });
    </script>
}

備注

1. 在使用過程中發現，有時可能不能正常實現跨域，原因是spring bean注冊順序的問題，所以一定要在配置上增加 @Order(Ordered.HIGHEST_PRECEDENCE), 保證它優先注冊。
2. 如果客戶端需要帶上cookie,需要增加withCredentials, vuejs, angularjs,ractjs上的設置方法要進一步研究一下。

參考資料

• 重拾后端之Spring Boot（五） -- 跨域、自定義查詢及分頁
• HTTP訪問控制（CORS）
• 解決angular+spring boot的跨域問題
• Spring Boot設置跨域訪問
• rest-service-cors
• CORS not working?
• localstorage的跨域存儲方案
• Spring Boot HTTP over JSON 的錯誤碼異常處理

完整的WebConfig代碼

@Configuration
@Order(Ordered.HIGHEST_PRECEDENCE)
public class WebConfig extends WebMvcConfigurerAdapter {

    @Autowired
    private AuthorizationInterceptor authorizationInterceptor;

    @Override
    public void addInterceptors(InterceptorRegistry registry) {
        registry.addInterceptor(authorizationInterceptor);
    }

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/static/**")
                .addResourceLocations("classpath:/static/");
    }

//    @Bean
//    public FilterRegistrationBean corsFilter() {
//        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
//        CorsConfiguration config = new CorsConfiguration();
//        config.setAllowCredentials(true);
//        config.addAllowedOrigin("*");
//        config.addAllowedHeader("*");
//        config.addAllowedMethod("*");
//        config.setMaxAge(3600L);
//        source.registerCorsConfiguration("/api/**", config);
//        FilterRegistrationBean bean = new FilterRegistrationBean(new CorsFilter(source));
//        // 這個順序很重要哦，為避免麻煩請設置在最前
//        bean.setOrder(0);
//        return bean;
//    }

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

}

“年輕人不要怕表現，要敢於出來表現，但還是那句話，要有正確的度，你的表現是分析問題和解決問題的能力。”

– 《你憑什么做好互聯網》