处理Spring靴和角形靴之间的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
}

我在Angular应用程序中添加了以下HttpInterceptor：

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);
}

问题是令牌提取器。getToken（）始终返回null。

相应的请求和响应头如下所示：

存在XSRF-TOKEN响应cookie。

我不明白问题出在哪里。

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

我真的很感激你的建议。

Answer 1

正如文档中所说，[…您可以在单个控制器或全球范围内启用跨源资源共享（CORS）…]

• 控制器方法CORS配置：可以使用@CrossOrigin注释启用
• 全局CORS配置：

@Configuration
public class CorsConfiguration {

    @Bean
    public WebMvcConfigurer corsConfigurer(){
        return new WebMvcConfigurer(){
            @Override
            public void addCorsMappings(CorsRegistry registry){

                registry.addMapping("/**")
                        .allowedOrigins("*")
                        .allowedMethods("*")
                        .allowedHeaders("*").maxAge(3600);

            }
        };
    }
}

Answer 2

我在我的Spring Boot应用程序中使用了这段代码，它对Angular应用程序非常有效

@组件公共类SimpleCORSFilter实现过滤器{

@Override
public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {

    HttpServletRequest request = (HttpServletRequest) req;
    HttpServletResponse response = (HttpServletResponse) res;

    response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
    response.setHeader("Access-Control-Allow-Credentials", "true");
    response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
    response.setHeader("Access-Control-Max-Age", "3600");
    response.setHeader("Access-Control-Allow-Headers", "Content-Type, Accept, X-Requested-With, remember-me");

    chain.doFilter(req, res);
}

@Override
public void init(FilterConfig filterConfig) {
}

@Override
public void destroy() {
}

希望有帮助：）

Answer 3

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