Question

我有一个angular 4应用程序，可以显示用户的信息资料。该应用程序位于https://www.myapp.com中，但用户的个人资料图片位于https://s3-sa-east-1.amazonaws.com/xxxx.png中。 Angular应用程序向我的Spring Boot Backend发出了“获取请求”以获取用户配置文件信息，但未加载配置文件映像，浏览器向我显示了以下错误：

跨源读取阻止（CORB）阻止了跨源响应 https://s3-sa-east-1.amazonaws.com/xxxx.png MIME类型为application / xml。看到 https://www.chromestatus.com/feature/5629709824032768了解更多详细信息。

我的问题是如何配置我的Spring Boot应用程序，以防止跨域读取阻止（CORB）？

接下来，我显示我的spring应用程序的安全设置：

@Configuration
@EnableWebSecurity
public class WebSecurity extends WebSecurityConfigurerAdapter {


    private UserDetailsService userDetailsService;

    private BCryptPasswordEncoder bCryptPasswordEncoder;

    public WebSecurity(UserDetailsService userDetailsService, BCryptPasswordEncoder bCryptPasswordEncoder) {
        this.userDetailsService = userDetailsService;
        this.bCryptPasswordEncoder = bCryptPasswordEncoder;
    }

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http.cors().and().csrf().disable()
        .authorizeRequests().antMatchers(HttpMethod.POST, USER_REGISTRATION_URL).permitAll()
        .antMatchers(HttpMethod.POST, RETURN_DATA).permitAll()
        .anyRequest().authenticated()
        .and().addFilter(new JWTAuthenticationFilter(authenticationManager(), getApplicationContext()))
        .addFilter(new JWTAuthorizationFilter(authenticationManager(), getApplicationContext()))
        .sessionManagement().sessionCreationPolicy(SessionCreationPolicy.STATELESS);
    }


    @Bean
    CorsConfigurationSource corsConfigurationSource() {
        CorsConfiguration configuration = new CorsConfiguration();
        configuration.addAllowedOrigin("*");
        configuration.addAllowedHeader("*");
        configuration.setAllowedMethods(Arrays.asList("GET","POST","PUT","PATCH","DELETE","OPTIONS"));
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", configuration);
        return source;
    }


}

我想了解为什么尽管显示了配置，还是会发生这种情况。

非常感谢！

Answer 1

该问题与为您的API提供服务的Spring Boot应用无关。

问题是，当您的Angular应用程序从Spring Boot应用程序接收到配置文件信息后，它将尝试从S3存储桶中加载图像，并且未为CORS配置S3存储桶。因此，浏览器从S3请求图像，并且该请求被阻止。

要解决此问题，必须为SORS存储桶配置CORS支持。有关如何执行此操作的最新信息，请参见https://docs.aws.amazon.com/AmazonS3/latest/dev/cors.html

的Amazon文档。

Spring Security跨域读取阻止（CORB）-Angular App

1 个答案: