angular: не найден метод в заголовке CORS 'Access-Control-Allow-Methods

Question

я использую пружинную загрузку на моем заднем конце с angular на моем внешнем интерфейсе .. и я пытаюсь удалить элемент, но я не работаю .. когда я пытаюсь get работает, но с Delete не работает ..

• служба ts

import { Injectable } from '@angular/core';
import { HttpClient,HttpHeaders } from '@angular/common/http';
import { AuthService } from 'app/services/auth.service';


@Injectable({
  providedIn: 'root'
})
export class CollaboratorsService {
url="http://localhost:8080/"

jwt=this.auth.getjwt();

constructor(private http:HttpClient,private auth:AuthService) {  }


  public getCollaborators(name){
    let link="collaboratorses?search="+name;
    return this.auth.getRessource(link);

  }

  public deleteCollaborator(id){
    let fullUrl=this.url+"entreprise/collaborator/"+id;
    console.log("full "+fullUrl);
    let headers = new HttpHeaders({
    'Authorization': this.jwt,
    "Access-Control-Allow-Methods":"GET, POST, DELETE, PUT",
    'Content-Type': 'application/json',
    'Access-Control-Allow-Origin': '*'
     }); 
    return this.http.delete(fullUrl,{headers:headers});
  }
}

• компонент ts

onDeleteColl(id){
    let c=confirm("are You Sure you want Delete This Collaborator!");
    if(!c){
        return;
    }else{
        this.collService.deleteCollaborator(id).subscribe(res =>{
      console.log(res);
    },err =>{
        console.log(err);
    });
        this.onGetcoll();
    }
}

все работает нормально, когда я пытаюсь опубликовать, получить или удалить, когда я использую RESTCLIENT расширение на firefox, но когда я пытаюсь Удалите с angular У меня возникла эта проблема

PS: я уже добавил в бэкэнд, чтобы разрешить кросс, поэтому я думаю, что проблема только с angular

protected 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-Methods, 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, Options");

Answer 1

Удалите эти заголовки из angular, так как они являются заголовками на стороне сервера

"Access-Control-Allow-Methods":"GET, POST, DELETE, PUT",
'Access-Control-Allow-Origin': '*'

Вы также можете удалить заголовок Content-Type, так как он устанавливается автоматически angular

И на стороне сервера, попробуйте установить разрешенный метод со значениями в верхнем регистре

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