'http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass

I have a problem that I can't seem to figure out. I want to send a http params request from my Angular client to server using below code but I am getting exception:

http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass

I want clarity about it, did I make any mistakes in Angular or is this a server side problem?

Auth:

login(username: string, password: string) {
    let params = new HttpParams();
    params = params.append('email', username);
    params = params.append('password', password);
    return this.http.post<any>('URL',{params:params})
      .pipe(map(user => {
        if (user && user.token) {
        }
      }),
        catchError(this.handleError)
      );
  }

angular angular-httpclient

Solution 1:^[1]

Yes, This is server-side problem not client side.

You need to enable CORS for your localhost from server side in order to consume API's from your Angular code.

PS: For a quick fix you can install chrome plugin to enable CORS but this is not recommended approach ever.

Solution 2:^[2]

Modify your server to add the header Access-Control-Allow-Origin: * to enable cross-origin requests from any domains.

Solution 3:^[3]

Add configuration in VSCode before run your application(F5)

"runtimeArgs": ["--disable-web-security"]

in launch.json file

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Pardeep Jain
Solution 2	Farhad Lavaei
Solution 3	Dane Brouwer

'http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass

Auth:

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]

Solution 3:^[3]