No token provided angular spotify api

[HollyW00d2424]

**Code is in Angular typescript

I got an access token using:

    getToken() {
        const headers = new HttpHeaders({
            'Content-Type': 'application/x-www-form-urlencoded'
          });
          return this.http.post('https://accounts.spotify.com/api/token', 'grant_type=client_credentials&client_id=c9477994743c439ba8cbe8591b96275b&client_secret=d118aa20a1904049ac3cc905077944ff', { headers: headers });
    }

I then tried to call an endpoint using:

    getArtist() {
        const headers = new HttpHeaders({
            'Authorization': 'BQA1O6zV2ZmW0RVIEZFFtQPgGL5uLV_iji0nZkSwwwmmdAmKyRKjKNuQn_UjIgx7gUBzhcB30VhuZZ5XE29PwEKNjnHLcJj-chSk6BA7u-faFsnKH7c'
          });
        return this.http.post('https://api.spotify.com/v1/artists/4Z8W4fKeB5YxbusRsdQVPb', { headers: headers });
    }

However, it keeps giving me the 401 error that I did not provide a token. I feel like my code is correct?

[Ximzend]

As you can see here, you'll need to add the word Bearer in front of the access token.

[HollyW00d2424]

Unfortunately, I tried that and still got the same error. What I posted was my last attempt before moving on. 

[Ximzend]

I see you get your access token in a very different way as shown at this page. Maybe there's the problem.

[navenduraisamy]

I think you are missing the body while sending post request. Hope the Below code helps.
Also, you are missing to add Bearer in the Authorization header.

getToken(code: string, codeVerifier: string) {
    let httpHeaders: HttpHeaders = new HttpHeaders();
    httpHeaders = httpHeaders.set('Content-Type', 'application/x-www-form-urlencoded');

    let body = new URLSearchParams({
      grant_type: 'authorization_code',
      code: code,
      redirect_uri: this.REDIRECT_URL,
      client_id: this.CLIENT_ID,
      code_verifier: codeVerifier
    });

    this.http
      .post("https://accounts.spotify.com/api/token", body, { headers: httpHeaders })
      .pipe(
        catchError((error: HttpErrorResponse) => {
          console.error("Error fetching token", error);
          return of(null);
        })
      )
      .subscribe((response: any) => {
        if (response !== null) {
          this.tokenService.setAccessToken(response.access_token);
          this.tokenService.setRefreshToken(response.setRefreshToken);
          this.router.navigate(['sp-phile']);
        }
      });
  }