Spring boot、JWT 和 Angular 不起作用：方法 put 的 HTTP 状态代码 403 错误答案

【问题标题】：Spring boot, JWT and angular not working : HTTP status code 403 error for method putSpring boot、JWT 和 Angular 不起作用：方法 put 的 HTTP 状态代码 403 错误
【发布时间】：2020-10-08 22:34:04
【问题描述】：

我是角度和弹簧安全的新手。我在从 Angular 更新数据时遇到问题，但我可以在测试我的 api 时使用失眠更新它（我在标头中传递令牌）。

我将令牌传递给 put 方法，但我得到拒绝访问 403

这是我在角度服务中的功能

  private headers = new HttpHeaders({
    'Content-Type': 'application/json',
    'Authorization':  this.authService.jwt
    });
updateUserById(id: String): Observable<any> {
    console.log(this.headers);

    return this.http.put(this.host_3 + '/' + id, {headers: this.headers});
  }

这是我在组件控制器中的功能

onSubmit(){
   this.updateCustomer();
  }
  updateCustomer(){
    console.log("inside update"+this.userr);
    this.coordservice.updateUserById(this.userr).
    subscribe(data => console.log("data"+data), error => console.log(error));
  }

这是我在 spring 控制器中的后端功能

 @PutMapping(value = "/customersList/updateCustomer/{idCustomer}")
    public ResponseEntity<Customer> update(@PathVariable(name = "idCustomer") String idCustomer, @RequestBody Customer customer){
        this.customerService.updateCustomer(idCustomer,customer);
        return new ResponseEntity<Customer>(customer, HttpStatus.NO_CONTENT);
    }

安全配置

rotected void doFilterInternal(HttpServletRequest request,HttpServletResponse response, FilterChain filterChain) throws ServletException, IOException {


        response.addHeader("Access-Control-Allow-Origin", "*");
        response.addHeader("Access-Control-Allow-Headers", "Origin, Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers, authorization");
        response.addHeader("Access-Control-Expose-Headers", "Access-Control-Allow-Origin, Access-Control-Allow-Credentials, authorization");
        response.addHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, PATCH");

注意：我可以使用 http.get() 获取数据，但对于 put 方法，我会拒绝访问

【问题讨论】：

可能由于CORS preflight而被阻止，您可以尝试先在Access-Control-Allow-Methods中添加OPTIONS：response.addHeader("Access-Control-Allow-Methods", "GET, POST , 放置, 删除, 补丁, 选项"); - 如果您使用响应标题编辑问题会很有用
看起来像是 Spring 安全性的 XSRF 保护。

标签： angular spring-boot rest http spring-security

【解决方案1】：

您可能还需要添加 OPTIONS 方法作为允许的方法，如下所示

response.addHeader("Access-Control-Allow-Methods", "OPTIONS, GET, POST, PUT, DELETE, PATCH");

对于 CORS，浏览器将发送 OPTIONS 请求以验证它是否正在发出更正服务器的请求（称为预检请求），如果它会成功响应，则实际请求已启动。

CSRF 令牌在安全方面也起着重要作用。您可能需要根据自己的要求进行配置

要禁用你可以使用.csrf().disable()如下

@Override
    public void configure(HttpSecurity http) throws Exception {
        http
            .csrf().disable()
            .authorizeRequests()
            .antMatchers("/public-api-such-as-login").permitAll() 
            .anyRequest().authenticated();
    }

如果你想包含 CSRF，你可以使用CookieCsrfTokenRepository，如下所示。您可能还想探索how it works

http
            .csrf()
            .ignoringAntMatchers("endpoint-to-be-ignored-for-csrf")
            .csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse())
            .and()
            .authorizeRequests()
            .antMatchers("/public-api-such-as-login").permitAll() 
            .anyRequest().authenticated();

【讨论】：