以下代码有什么问题？

Question

I am working on a sample Angular2 application which uses Spotify API to get data. When I run the code, I'm getting response Error in console as "Invalid Access Token". I have provided the correct access token, still the error persists, I'm not getting how to resolve it and what's wrong I'm doing.

import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class SpotifyService {
  private searchUrl: string;   

  constructor(private _http: Http) { }

  searchMusic(str: string, type = 'artist') {
    const access_token = '<My Access Token Here>';
    const headers = new Headers({ 'Authorization': 'Bearer ' + access_token });
    this.searchUrl = 'https://api.spotify.com/v1/search?query='+str+'&offset=0&limit=20&type='+type+'&market=US';

    return this._http
      .get(this.searchUrl, { headers })
      .map(res => res.json());
  }
}

Error Screenshot :

Answer 1

You can check by adding one of the content-type in headers

var headers: Headers = new Headers({'Authorization': 'Bearer ' + access_token, 'Content-Type': 'application/x-www-form-urlencoded' });

OR

var headers: Headers = new Headers({'Authorization': 'Bearer ' + access_token, 'Content-Type': 'application/json' });

Answer 2

were you able to get a valid response by giving your access token in their api console?

https://developer.spotify.com/web-api/console/get-search-item/?q=tania+bowra&type=artist