VUE+SpringCloud+SpringSecurity+Gateway解决跨域问题-CFANZ编程社区

问题描述

这个标题呢我也不知道怎么写！反正看的懂的自然懂了，这个问题的症状如下图

VUE+SpringCloud+SpringSecurity+Gateway解决跨域问题_spring

Access to XMLHttpRequest at 'http://192.168.0.99:3331/authentication/form?username=TAO&password=123456' from origin 'http://192.168.0.99:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

这个问题很明显就是跨域了跨域详细文章，跨域有好几种解决方案，可以在前端解决，当然也可以在后端解决，同时也可以采用其他第三方技术手段，如设置Nginx代理，那么此篇文章就采用后端决绝，因为这里是涉及到SpringSecurity的登录授权问题！那么这里的话就后端解决吧！

解决方案

后端的请求处理逻辑是请求先经过Gateway然后在分发到指定的其他业务服务器处理，那么这里的话跨域就可以统一在Gateway上解决

1.添加xxxCorsConfiguration配置类
注意包别瞎导

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.reactive.CorsWebFilter;
import org.springframework.web.cors.reactive.UrlBasedCorsConfigurationSource;


@Configuration
public class GulimallCorsConfiguration {

    @Bean
    public CorsWebFilter corsWebFilter(){
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();

        CorsConfiguration corsConfiguration = new CorsConfiguration();

        //1、配置跨域
        corsConfiguration.addAllowedHeader("*");//  支持哪些请求头跨域
        corsConfiguration.addAllowedMethod("*");//  支持哪些方法跨域
        corsConfiguration.addAllowedOrigin("*");//  支持哪些来源跨域，需要跨域的地址  注意这里的 127.0.0.1 != localhost
        corsConfiguration.setAllowCredentials(true);//跨域请求默认不包含cookie，设置true时可包含cookie

        //Aecess-Control-Allow-Origin       支持哪些来源跨域，需要跨域的地址  注意这里的 127.0.0.1 != localhost
        //Access-Control-Allow-Methods      支持哪些方法跨域
        //Access-Control-Allow-Credentials  跨域请求默认不包含cookie，设置true时可包含cookie
        //Access-Control-Expose-Headers     支持哪些请求头跨域
        //Access-control-max-age            表明该响应时间为多少秒，在有效时间内，
        //浏览器无需为同一请求在次发起预检请求，请注意，浏览器自己维护了最大有效时间，
        // 如果该字段的值超过了最大有效时间，将不会生效
        /**corsConfiguration.exposedHeaders（"access-control-max-age"）
         * CORS请求时，XMLHttpRequest对象的getResponseHeader()方法只能拿到6个基本字段
         * Cache-Control、Content-Language、Content-Type、Expires、Last-Modified、Pragma。
         * 如果先得到其他字段必须在Access-Control-Expose-Headers中指定
         */


        //注册跨域配置，/**代表任意路径
        source.registerCorsConfiguration("/**",corsConfiguration);
        return new CorsWebFilter(source);
    }
}