javascript - 在 Spring Boot 和 Angular 之间处理 CORS 和 CSRF

Question

我有一个在端口 8888 上运行的 Spring Boot 后端应用程序和一个在 4200 端口上运行的 Angular 前端应用程序。

在我的 Spring Boot 应用程序中，我定义了以下 bean 来处理 CORS:

@Bean
public WebMvcConfigurer webMvcConfigurer() {
    return new WebMvcConfigurer() {
        @Override
        public void addCorsMappings(CorsRegistry registry) {
            registry.addMapping("/**");
        }
    };
}

我的 HttpSecurity 配置如下所示:

@Override
protected void configure(HttpSecurity http) throws Exception {
    http
        .cors()
        .and()
        .csrf().disable()
        // ... the rest of the config
}

使用此配置一切正常，我可以从 Angular 应用程序成功调用我的 API。

但我想启用 CSRF，所以我将安全配置更改为以下内容:

@Override
protected void configure(HttpSecurity http) throws Exception {
    http
        .cors()
        .and()
        .csrf().csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse())
        // ... the rest of the config
}

我已将以下 HttpInterceptor 添加到我的 Angular 应用程序中:

constructor(private tokenExtractor: HttpXsrfTokenExtractor) { }

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const token = this.tokenExtractor.getToken();
    if (token) {
        req = req.clone({ setHeaders: { 'X-XSRF-TOKEN': token } });
    }
    return next.handle(req);
}

问题是 tokenExtractor.getToken() 总是返回 null。

相应的请求和响应 header 如下所示:

存在 XSRF-TOKEN 响应 cookie。

我不知道是什么问题。

我已经尝试在我的 Angular 应用中导入 HttpClientXsrfModule，但没有任何区别。

如果有任何建议，我将不胜感激。

Answer 1

不需要。您可以使用 chrome nosecurity 或安装 Allow-Control-Allow-Origin 插件来解决问题。