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 只获得很少的索赔..

这解决了问题