好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

Spring Cloud项目前后端分离跨域的操作

跨域问题,其实百度上面有一堆的解决方案

针对普通的情况其实百度上面的方案都是可行的。

我这里主要介绍2种情况。

当然我这里的配置都是基于网关的,而不是基于服务的。

1、没有增加权限验证。

2、增加了spring security的权限验证(我这里是基于keyCloak),增加了Authorization

首先我们介绍第一种情况的解决方法,这个很简单,只需要在启动类里面配置过滤器就可以解决。

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

@Bean

     public CorsFilter corsFilter() {

         //1.添加CORS配置信息

         CorsConfiguration config = new CorsConfiguration();

           //放行哪些原始域

           config.addAllowedOrigin( "*" );

           //是否发送Cookie信息

           config.setAllowCredentials( true );

           //放行哪些原始域(请求方式)

           config.addAllowedMethod( "*" );

           //放行哪些原始域(头部信息)

           config.addAllowedHeader( "*" );

           //暴露哪些头部信息(因为跨域访问默认不能获取全部头部信息)

           config.addExposedHeader( "*" );

 

         //2.添加映射路径

         UrlBasedCorsConfigurationSource configSource = new UrlBasedCorsConfigurationSource();

         configSource.registerCorsConfiguration( "/**" , config);

 

         //3.返回新的CorsFilter.

         return new CorsFilter(configSource);

     }

我遇到情况就是第二种了,这种情况上面的方式基本没有作用,我这里使用的是keyCloak做的权限验证。

首先增加过滤器配置:

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

@Component

public class CorsControllerFilter implements Filter{

     @Override

     public void destroy() {

         // TODO Auto-generated method stub

        

     }

 

     @Override

     public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain)

             throws IOException, ServletException {

         // TODO Auto-generated method stub

         HttpServletResponse res = (HttpServletResponse) response;

         res.setContentType( "text/html;charset=UTF-8" );

         res.setHeader( "Access-Control-Allow-Origin" , "*" );

         res.setHeader( "Access-Control-Allow-Methods" , "POST, GET, OPTIONS, DELETE ,PUT" );

         res.setHeader( "Access-Control-Max-Age" , "3600" );

         res.setHeader( "Access-Control-Allow-Headers" , "*" );

         res.setHeader( "Access-Control-Allow-Credentials" , "true" );

         res.setHeader( "XDomainRequestAllowed" , "1" );

         chain.doFilter(request, response);

     }

 

     @Override

     public void init(FilterConfig arg0) throws ServletException {

         // TODO Auto-generated method stub 

     }

}

在启动类中增加配置

?

1

2

3

4

5

6

7

    @Bean

public FilterRegistrationBean filterRegistrationBean() {

     FilterRegistrationBean registrationBean = new FilterRegistrationBean();

     CorsControllerFilter corsControllerFilter = new CorsControllerFilter();

     registrationBean.setFilter(corsControllerFilter);

     return registrationBean;

}

但是针对某些请求,他会先请求OPTIONS请求,造成权限验证失败。所以增加拦截器配置,对所有的OPTIONS的请求直接放行,返回200的状态。

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

public class OptionsInterceptor implements HandlerInterceptor {

 

     @Override

     public void afterCompletion(HttpServletRequest arg0, HttpServletResponse arg1, Object arg2, Exception arg3)

             throws Exception {

         // TODO Auto-generated method stub

     }

 

     @Override

     public void postHandle(HttpServletRequest arg0, HttpServletResponse arg1, Object arg2, ModelAndView arg3)

             throws Exception {

         // TODO Auto-generated method stub

     }

 

     @Override

     public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {

         // TODO Auto-generated method stub

         if (request.getMethod().equals( "OPTIONS" )){

             response.setStatus(HttpServletResponse.SC_OK);

             return false ;

         }

         return true ;

     }

}

配置web配置文件,加载拦截器。

?

1

2

3

4

5

6

7

@Configuration

public class WebMvcConfiguration extends WebMvcConfigurationSupport{

  @Override

     public void addInterceptors(InterceptorRegistry registry) {

         registry.addInterceptor( new OptionsInterceptor()).addPathPatterns( "/**" );

  }

}

本来以为这样配置了应该是可以了,但是在请求的时候OPTIONS的请求居然还是报跨域的问题,增加拦截器允许跨域配置

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

public class CrossInterceptor implements HandlerInterceptor{

  @Override

  public void afterCompletion(HttpServletRequest arg0, HttpServletResponse arg1, Object arg2, Exception arg3)

    throws Exception {

   // TODO Auto-generated method stub

  }

 

  @Override

  public void postHandle(HttpServletRequest arg0, HttpServletResponse arg1, Object arg2, ModelAndView arg3)

    throws Exception {

   // TODO Auto-generated method stub

  }

 

  @Override

  public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {

   // TODO Auto-generated method stub

         response.setHeader( "Access-Control-Allow-Origin" , "*" );

         response.setHeader( "Access-Control-Allow-Credentials" , "true" );

         response.setHeader( "Access-Control-Allow-Methods" , "POST, GET, OPTIONS, DELETE, PUT, HEAD" );

         response.setHeader( "Access-Control-Allow-Headers" , "*" );

         response.setHeader( "Access-Control-Max-Age" , "3600" );

         return true ;

  }

}

在WebMvcConfiguration里面增加配置,注意要写在OptionsInterceptor的前面

?

1

registry.addInterceptor( new CrossInterceptor()).addPathPatterns( "/**" );

继续测试,跨域问题解决。对于原理其实我也不太清楚,欢迎各位沟通交流。

以上为个人经验,希望能给大家一个参考,也希望大家多多支持。

原文链接:https://blog.csdn.net/zhuwei_clark/article/details/83413763

查看更多关于Spring Cloud项目前后端分离跨域的操作的详细内容...

  阅读:13次