Chrome 少数用户的 CORS 块及其对少数用户的正常工作:Spring boot + Angular App
Chrome CORS block for few users and its working fine for few users : Spring boot + Angular App
我有一个用 Angular 写的 single-page-app 与 back-end API 写在 Spring boot.
我在 spring 启动应用程序中使用以下配置
@Configuration
public class CorsFilterConfiguration {
@Bean
public FilterRegistrationBean corsFilterRegistrationBean() {
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
CorsConfiguration config = new CorsConfiguration();
config.applyPermitDefaultValues();
config.setAllowCredentials(true);
config.setAllowedOrigins(Arrays.asList("*"));
config.setAllowedHeaders(Arrays.asList("*"));
config.setAllowedMethods(Arrays.asList("*"));
config.setExposedHeaders(Arrays.asList("content-length"));
config.setMaxAge(3600L);
source.registerCorsConfiguration("/**", config);
FilterRegistrationBean bean = new FilterRegistrationBean(new CorsFilter(source));
bean.setOrder(Ordered.HIGHEST_PRECEDENCE);
return bean;
}
}
网络安全配置
@EnableWebSecurity
@Configuration
public class WebSecurityConfiguration {
@Configuration
@EnableGlobalMethodSecurity(prePostEnabled = true)
public static class OAuth2SecurityConfiguration extends WebSecurityConfigurerAdapter {
@Autowired
JwtDecoder jwtDecoder;
@Value("${audience-id}")
String audience;
@Override
public void configure(HttpSecurity http) throws Exception {
JwtDecoder jwtDecoderWrapper = wrapJwtDecoderWithAudienceCheck(this.jwtDecoder, audience);
http
.csrf()
.disable()
.authorizeRequests()
.antMatchers("/swagger-ui.html", "/error", "/swagger-resources/**", "/webjars/**", "/v2/api-docs", "/test/**", "/api/v1/office/**", "/health").permitAll()
.anyRequest().authenticated()
.and()
.sessionManagement()
.sessionCreationPolicy(SessionCreationPolicy.STATELESS)
.and()
.oauth2ResourceServer()
.jwt()
.decoder(jwtDecoderWrapper);
}
static JwtDecoder wrapJwtDecoderWithAudienceCheck(JwtDecoder jwtDecoder, String audience) {
return (token) -> {
Jwt jwt = jwtDecoder.decode(token);
if (jwt.containsClaim(AUD) && !jwt.getClaimAsStringList(AUD).contains(audience)) {
throw new JwtValidationException("Audience field does not match: " + audience, Arrays.asList(new OAuth2Error("invalid_aud")));
}
return jwt;
};
}
}
}
它对我和我的团队成员来说工作得很好。我们没有遇到 CORS 问题。但是我们的用户中很少有人面临 CORS 问题
我通过 CURL 命令发出了几个预检请求
curl -i -H "access-control-request-headers: authorization,content-type" -H "access-control-request-method: GET" -H "origin: https://ui.app.com" -X OPTIONS https://api.app.com/api/v1/contacts
它工作得很好,我正在正确地获得 header
HTTP/1.1 200 OK
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: authorization, content-type
Access-Control-Allow-Methods: GET
Access-Control-Allow-Origin: https://ui.app.com
Access-Control-Expose-Headers: content-length
Access-Control-Max-Age: 3600
Content-Length: 0
Date: Fri, 11 Sep 2020 23:23:44 GMT
Vary: Origin
Vary: Access-Control-Request-Method
Vary: Access-Control-Request-Headers
X-Vcap-Request-Id: 3023da74-f39e-4269-4f0d-abdba6e6cb88
但仍然不确定为什么只有少数用户遇到此问题。有人可以帮忙吗?
我解决了这个问题。只有少数用户,浏览器被 CORS 问题阻止,经过调查,我们发现这些用户的 access-token
(被 CORS 阻止)相当大(其中有很多声明)。所以我们更改了令牌声明在我们的 Auth-server 中计划并使 access-token 只获得很少的索赔..
这解决了问题
我有一个用 Angular 写的 single-page-app 与 back-end API 写在 Spring boot.
我在 spring 启动应用程序中使用以下配置
@Configuration
public class CorsFilterConfiguration {
@Bean
public FilterRegistrationBean corsFilterRegistrationBean() {
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
CorsConfiguration config = new CorsConfiguration();
config.applyPermitDefaultValues();
config.setAllowCredentials(true);
config.setAllowedOrigins(Arrays.asList("*"));
config.setAllowedHeaders(Arrays.asList("*"));
config.setAllowedMethods(Arrays.asList("*"));
config.setExposedHeaders(Arrays.asList("content-length"));
config.setMaxAge(3600L);
source.registerCorsConfiguration("/**", config);
FilterRegistrationBean bean = new FilterRegistrationBean(new CorsFilter(source));
bean.setOrder(Ordered.HIGHEST_PRECEDENCE);
return bean;
}
}
网络安全配置
@EnableWebSecurity
@Configuration
public class WebSecurityConfiguration {
@Configuration
@EnableGlobalMethodSecurity(prePostEnabled = true)
public static class OAuth2SecurityConfiguration extends WebSecurityConfigurerAdapter {
@Autowired
JwtDecoder jwtDecoder;
@Value("${audience-id}")
String audience;
@Override
public void configure(HttpSecurity http) throws Exception {
JwtDecoder jwtDecoderWrapper = wrapJwtDecoderWithAudienceCheck(this.jwtDecoder, audience);
http
.csrf()
.disable()
.authorizeRequests()
.antMatchers("/swagger-ui.html", "/error", "/swagger-resources/**", "/webjars/**", "/v2/api-docs", "/test/**", "/api/v1/office/**", "/health").permitAll()
.anyRequest().authenticated()
.and()
.sessionManagement()
.sessionCreationPolicy(SessionCreationPolicy.STATELESS)
.and()
.oauth2ResourceServer()
.jwt()
.decoder(jwtDecoderWrapper);
}
static JwtDecoder wrapJwtDecoderWithAudienceCheck(JwtDecoder jwtDecoder, String audience) {
return (token) -> {
Jwt jwt = jwtDecoder.decode(token);
if (jwt.containsClaim(AUD) && !jwt.getClaimAsStringList(AUD).contains(audience)) {
throw new JwtValidationException("Audience field does not match: " + audience, Arrays.asList(new OAuth2Error("invalid_aud")));
}
return jwt;
};
}
}
}
它对我和我的团队成员来说工作得很好。我们没有遇到 CORS 问题。但是我们的用户中很少有人面临 CORS 问题
我通过 CURL 命令发出了几个预检请求
curl -i -H "access-control-request-headers: authorization,content-type" -H "access-control-request-method: GET" -H "origin: https://ui.app.com" -X OPTIONS https://api.app.com/api/v1/contacts
它工作得很好,我正在正确地获得 header
HTTP/1.1 200 OK
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: authorization, content-type
Access-Control-Allow-Methods: GET
Access-Control-Allow-Origin: https://ui.app.com
Access-Control-Expose-Headers: content-length
Access-Control-Max-Age: 3600
Content-Length: 0
Date: Fri, 11 Sep 2020 23:23:44 GMT
Vary: Origin
Vary: Access-Control-Request-Method
Vary: Access-Control-Request-Headers
X-Vcap-Request-Id: 3023da74-f39e-4269-4f0d-abdba6e6cb88
但仍然不确定为什么只有少数用户遇到此问题。有人可以帮忙吗?
我解决了这个问题。只有少数用户,浏览器被 CORS 问题阻止,经过调查,我们发现这些用户的 access-token
(被 CORS 阻止)相当大(其中有很多声明)。所以我们更改了令牌声明在我们的 Auth-server 中计划并使 access-token 只获得很少的索赔..
这解决了问题