Spotify APIによるアーティストトラックデータの返送エラーが不正

Question

現在、現在のトラックを取得するためにKD Rushaを取得しようとしています。彼のウェブサイトに表示し、誰かが歌のイメージの上にマウスを乗せて再生すると再生ボタンを表示します。私はここで間違って何をしていますか？

マイステップ：

1. Spotifyは上のKD Rushaトップアルバムのために取得したいです。
2. 9トラックに制限します。

3. 各トラックの上部に再生ボタンを追加して30秒間再生します。

   アーティストID https://api.spotify.com/v1/artists/{id}これは完全に間違っているかもしれませんが、あなたのコードのおかげで誰もまだあなたに答えていないと私は非常によく似た問題の解決策を見つけたので、私に401 (Unauthorized)

   import React from 'react'; 
   require('dotenv').config(); 
   
   export default class SpotifyComponent extends React.Component { 
   
   constructor(props){ 
       super(props); 
       this.state = { 
        artist: null, 
       }; 
   } 
   
   componentWillMount() { 
       var request = new Request('https://api.spotify.com/v1/artists/5JLWikpo5DFPqvIRi43v5y', { 
        method: 'GET', 
        headers: new Headers({ 
        'Accept': 'application/json', 
        'Content-Type': 'text/plain', 
   
        'Authorization': 'Bearer <big blob of token here>' 
        }) 
   }); 
   
       fetch(request)// fetch the Spotify date from KD Rusha Account 
       .then((response) => { 
        var result = response.json() 
        this.setState({// State artist albums 
         albums: result, 
         selectedTrack: [0] 
        }); 
          console.log(response.json()); 
       if (response.status >= 400) { 
        throw new Error("Bad response from server"); 
       } 
       return response.json(); 
       }); 
   } 
   
       render(){ 
       return(
        <section className="spotify-cantainer"> 
          <img src="{albums}" alt="kdrusha" /> 
        </section> 
       ); 
       } 
   
   } 
   

Answer 1

を与えます私は助けようとします。ここに私のコードは、私のSpotifyはログインを使用して、アーティストを検索します入力にフック関数は次のとおりです。

search() { 
const BASE_URL = 'https://api.spotify.com/v1/search?'; 
const FETCH_URL = `${BASE_URL}q=${this.state.query}&type=artist&limit=1`; 

fetch(FETCH_URL, { 
    method: 'GET', 
    headers: new Headers({ 
    Accept: "application/json", 
    Authorization: "Bearer <long token here>" 
    }) 
}) 
.then(response => response.json()) 
.then(json => console.log('json', json)); 
} 

1つの違いは、私のヘッダの辞書のキーは、引用符ではないということです。この関数は{this.state.quesry}からアーティストに関するすべての情報を含むjsonオブジェクトを返します。

最高の運と私はこれが助けて欲しい！