从Angular到Spring Gateway的请求失败CORS错误

Question

项目使用Spring-Security OAUTH 2。Angular应用被用作web客户端。并作为Keycloak授权服务器。Angular应用通过Spring网关向Spring应用发送请求。

当我尝试发送Get请求时，我得到一个错误

has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request.

文件Pom.xml

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.7.2</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>com.amrut.prabhu</groupId>
<artifactId>spring-cloud-gateway-keycloak-oauth2</artifactId>
<version>0.0.1-SNAPSHOT</version>
<name>Spring Cloud Gateway Oauth2 With Keycloak</name>
<description>spring cloud gateway with keycloak oauth2</description>
<properties>
<java.version>17</java.version>
<spring-cloud.version>2021.0.1</spring-cloud.version>
<lombok.version>1.18.22</lombok.version>
<logback-access-spring-boot-starter.version>3.1.2</logback-access-spring-boot-starter.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-oauth2-client</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.cloud</groupId>
<artifactId>spring-cloud-starter-gateway</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-actuator</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<version>${lombok.version}</version>
<optional>true</optional>
</dependency>
</dependencies>
<dependencyManagement>
<dependencies>
<dependency>
<groupId>org.springframework.cloud</groupId>
<artifactId>spring-cloud-dependencies</artifactId>
<version>${spring-cloud.version}</version>
<type>pom</type>
<scope>import</scope>
</dependency>
</dependencies>
</dependencyManagement>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
</project>

SecurityConfig

@Configuration
public class SecurityConfig {
@Bean
public SecurityWebFilterChain springSecurityFilterChain(ServerHttpSecurity http, ServerLogoutSuccessHandler handler) {
http
.cors()
.and()
.csrf().disable()           
.authorizeExchange()
.pathMatchers("/actuator/**", "/","/logout.html")
.permitAll()
.and()
.authorizeExchange()
.anyExchange()
.authenticated()
.and()
.oauth2Login() // to redirect to oauth2 login page.
.and()
.logout()
.logoutSuccessHandler(handler)
;
return http.build();
}
@Bean
public ServerLogoutSuccessHandler keycloakLogoutSuccessHandler(ReactiveClientRegistrationRepository repository) {
OidcClientInitiatedServerLogoutSuccessHandler oidcLogoutSuccessHandler =
new OidcClientInitiatedServerLogoutSuccessHandler(repository);
oidcLogoutSuccessHandler.setPostLogoutRedirectUri("{baseUrl}/logout.html");
return oidcLogoutSuccessHandler;
}    
}

我试图在Spring网关属性文件中注册，从这个帖子歌珥

spring:
cloud:
gateway:
default-filters:
- TokenRelay
- DedupeResponseHeader=Access-Control-Allow-Credentials Access-Control-Allow-Origin
globalcors:
corsConfigurations:
'[/**]':
allowedOrigins: "*"
allowedMethods: "*"
allowedHeaders: "*"

我还尝试确定CORS的全局配置，根据这篇文章

baeldung.com

@Configuration
@EnableWebFlux
public class CorsGlobalConfiguration implements WebFluxConfigurer {
@Override
public void addCorsMappings(CorsRegistry corsRegistry) {
corsRegistry.addMapping("/**")
.allowedOrigins("http://localhost:4200")
.allowedMethods("PUT")
.allowedMethods("GET")
.allowedHeaders("Baeldung-Allowed", "Baledung-Another-Allowed")
.exposedHeaders("Baeldung-Allowed", "Baeldung-Exposed")
.maxAge(3600);
}
}

我仍然得到一个错误我做错了什么?我添加了所有必要的标题。他还需要什么?方法上的@CrossOrigin注释以前总是有效的。

下面两个选项也没有帮助解决问题:

@Configuration   
public class CorsWebFilterConfig {
@Bean
CorsWebFilter corsWebFilter() {
CorsConfiguration corsConfig = new CorsConfiguration();
corsConfig.setAllowedOrigins(Arrays.asList("http://localhost:4200"));
corsConfig.setMaxAge(8000L);
corsConfig.addAllowedMethod("PUT");
corsConfig.addAllowedMethod("GET");
// corsConfig.addAllowedHeader("Baeldung-Allowed");
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource(new PathPatternParser());
source.registerCorsConfiguration("/**", corsConfig);
return new CorsWebFilter(source);
}    
}

或

@Configuration
public class CorsWebFilterConfig implements WebFilter {

@Override
public Mono<Void> filter(ServerWebExchange serverWebExchange,
WebFilterChain webFilterChain) {

ServerHttpRequest request = serverWebExchange.getRequest();
ServerHttpResponse response = serverWebExchange.getResponse();
HttpHeaders headers = response.getHeaders();
headers.add(HttpHeaders.ACCESS_CONTROL_ALLOW_ORIGIN, "http://localhost:4200");
headers.add(HttpHeaders.ACCESS_CONTROL_ALLOW_METHODS, "POST, GET, PUT, OPTIONS, DELETE, PATCH");
headers.add(HttpHeaders.ACCESS_CONTROL_ALLOW_CREDENTIALS, "true");
headers.add(HttpHeaders.ACCESS_CONTROL_ALLOW_HEADERS, "*");
headers.add(HttpHeaders.ACCESS_CONTROL_EXPOSE_HEADERS, "*");
headers.add(HttpHeaders.ACCESS_CONTROL_MAX_AGE, "18000L");
if (request.getMethod() == HttpMethod.OPTIONS) {
response.setStatusCode(HttpStatus.OK);
return Mono.empty();//HERE
}
return webFilterChain.filter(serverWebExchange);
}    
}

方法上的注释也不起作用

@CrossOrigin(origins = "http://localhost:4200")

这里是网络选项卡的内容，第一个请求是OPTIONS，第二个请求是GET

Request URL: http://10.151.68.8:8484/auth/realms/demo/protocol/openid-connect/auth?response_type=code&client_id=spring-gateway-client&scope=message.write&state=dnAY-OwNUBGKuvZE5-3AH3L6v9W8OA5V67bD-U2YgiA%3D&redirect_uri=http://localhost:9090/login/oauth2/code/keycloak
Request Method: OPTIONS
Status Code: 200 OK
Remote Address: 10.151.68.8:8484
Referrer Policy: no-referrer
Response
Connection: keep-alive
Content-Length: 25
Content-Type: application/json
Date: Wed, 16 Nov 2022 07:34:59 GMT
Referrer-Policy: no-referrer
Strict-Transport-Security: max-age=31536000; includeSubDomains
X-Content-Type-Options: nosniff
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1; mode=block
Request
Accept: */*
Accept-Encoding: gzip, deflate
Accept-Language: ru-RU,ru;q=0.9,en-US;q=0.8,en;q=0.7
Access-Control-Request-Headers: authorization
Access-Control-Request-Method: GET
Connection: keep-alive
Host: 10.151.68.8:8484
Origin: null
Sec-Fetch-Mode: cors
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36

由于某些原因，请求中的Origin = null字段也许这就是原因吧?结果是Gateway向Origin = null的授权服务器发送验证请求，并收到一个cors错误。

Answer 1

我的提示是:

• 检查浏览器中请求/响应的报头是什么
• 网关配置也可以包含这些:

cors()
.configurationSource(corsConfigurationSource()).and()...
@Bean
CorsConfigurationSource corsConfigurationSource() {
CorsConfiguration configuration = new CorsConfiguration();
// other settings of configuration
configuration.applyPermitDefaultValues();
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", configuration);
return source;
}

也许你检查了下面的链接，但如果没有，那么值得一试，以防上面的代码没有帮助:https://reflectoring.io/spring-cors/

Answer 2

问题原来是由于请求的双重转发，origin字段变为空。当Keycloak收到这样的请求时，它抛出了一个错误。我找到了这个问题的临时解决方案(感谢用户@ch4mp):在网关

上禁用oauth2

<!-- <dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-oauth2-client</artifactId>
</dependency>        -->

在属性文件中我写

spring:
cloud:
gateway:
globalcors:
add-to-simple-url-handler-mapping: true
cors-configurations:
'[/**]':
allowed-origins: "*"
allowed-methods: "*"
allowed-headers: "*"
exposed-headers: "*"

和我加两个豆子

@Bean
public RouteLocator myRoutes(RouteLocatorBuilder builder, Function<GatewayFilterSpec, UriSpec> brutalCorsFilters) {
return builder
.routes()
.route(p -> p.path("/users/**").filters(brutalCorsFilters).uri("https://localhost:9443"))
.route(p -> p.path("/greet/**").filters(brutalCorsFilters).uri("https://localhost:9445"))
.build();
}
@Bean
Function<GatewayFilterSpec, UriSpec> brutalCorsFilters() {
return f -> f
.setResponseHeader("Access-Control-Allow-Origin", "*")
.setResponseHeader("Access-Control-Allow-Methods", "*")
.setResponseHeader("Access-Control-Expose-Headers", "*");
}

解决方案是暂时的，但我还没有找到另一个。而提供baeldung.com的是什么，它不起作用。