spring boot 跨域請求

場景

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

在網站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上的設置方法要進一步研究一下。

參考資料

完整的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);
    }

}

「年輕人不要怕表現,要勇於出來表現,但仍是那句話,要有正確的度,你的表現是分析問題和解決問題的能力。」vue

– 《你憑什麼作好互聯網》java

相關文章
相關標籤/搜索