解决 Spring Cloud Zuul 前端跨域请求问题

正在做的一个微服务架构的项目中,不出意料的在前端请求时遇到了跨域的问题 stats code: 401。以下就是我们采取的解决方案。

在zuul的入口类,即注解为@EnableZuulProxy的类中,增加以下代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
@Bean
public CorsFilter corsFilter() {
final UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
final CorsConfiguration config = new CorsConfiguration();
//允许跨域
config.setAllowCredentials(true);
//允许向该服务器提交请求的URI,*表示全部
config.addAllowedOrigin("*");
//允许访问的头信息,*表示全部
config.addAllowedHeader("*");
//允许的method
config.addAllowedMethod("OPTIONS");
config.addAllowedMethod("HEAD");
config.addAllowedMethod("GET");
config.addAllowedMethod("PUT");
config.addAllowedMethod("POST");
config.addAllowedMethod("DELETE");
config.addAllowedMethod("PATCH");
//免检时间,单位是秒
//config.setMaxAge(3600)
//Enabling CORS for the whole application
source.registerCorsConfiguration("/**", config);
return new CorsFilter(source);
}

另外还有一个解决的方式是使用@CrossOrigin注解,这个注解既可以用在RestController类上,也可以用在RestContronller的方法上。等同于上面逻辑的一个注解代码是:

1
2
3
@CrossOrigin(allowCredentials="true", allowedHeaders="*", methods={RequestMethod.GET,
RequestMethod.POST, RequestMethod.DELETE, RequestMethod.OPTIONS,
RequestMethod.HEAD, RequestMethod.PUT, RequestMethod.PATCH}, origins="*")

缺点是需要在每一个RestController上去做这个事情,过于重复。

以上内容参阅了以下文档: