Uncaught (in promise) SyntaxError: Unexpected token '&lt;', "<div id="text_translate"><p> 背景：我一直在從事一個項目（稱為音樂大師），我必須從 developer.spotify.com 訪問藝術家的詳細信息。 以下是代碼片段：</p><pre> const BASE_URL = 'https://api.spotify.com/v1/search?'; const FETCH_URL = `${BASE_URL}q=${this.state.query}&amp;type=artist&amp;limit=1`; console.log('FETCH_URL', FETCH_URL); fetch('FETCH_URL', { method:'GET', headers: { 'Accept': 'application/json', "Content-Type": "Application/json", "Authorization": "Bearer BQDyac2glKnbstiG79UKzKSReNbsWa_hEKlOWAZtXaFZpfx8ZibluRUmBHHO12CjLMJv3KBaKTZqUKJReA11_ItrYIkr3CmnUi6ykUD7J0gZk9pKzxjz02j4byQfSa6s7Y08OMNzugFffYc68tzZiGSDp9vB80eiiIod_igAH8ZxbPBUMsRH3pbiMY8tnJpeXmk" } }).then(response =&gt; response.json()).then(json =&gt; { const artist = json.artists.items[0]; console.log('artist', artist); this.setState({artist}); });</pre><p> 運行代碼時出現上述錯誤，我在互聯網上研究這個問題已經有一段時間了，發現我必須在 fetch() 中添加 header 部分，但即使在添加了 header 部分之后，我也是得到錯誤。</p><p> 即使在通過令牌后我也無法理解為什么我得到 HTML 響應而不是 JSON。</p><p> 我真的很新，這是我的第一個項目，因此我無法理解這背后的內部功能是什么。</p></div>

Question

背景：我一直在從事一個項目（稱為音樂大師），我必須從 developer.spotify.com 訪問藝術家的詳細信息。 以下是代碼片段：

const BASE_URL = 'https://api.spotify.com/v1/search?';
    const FETCH_URL = `${BASE_URL}q=${this.state.query}&type=artist&limit=1`;
    console.log('FETCH_URL', FETCH_URL);
    fetch('FETCH_URL', {
        method:'GET',
        headers: {
            'Accept': 'application/json',
            "Content-Type" : "Application/json",
            "Authorization": "Bearer BQDyac2glKnbstiG79UKzKSReNbsWa_hEKlOWAZtXaFZpfx8ZibluRUmBHHO12CjLMJv3KBaKTZqUKJReA11_ItrYIkr3CmnUi6ykUD7J0gZk9pKzxjz02j4byQfSa6s7Y08OMNzugFffYc68tzZiGSDp9vB80eiiIod_igAH8ZxbPBUMsRH3pbiMY8tnJpeXmk"              }
    })
    .then(response => response.json())
    .then(json => {
        const artist = json.artists.items[0];
        console.log('artist', artist);
        this.setState({artist});
    });

運行代碼時出現上述錯誤，我在互聯網上研究這個問題已經有一段時間了，發現我必須在 fetch() 中添加 header 部分，但即使在添加了 header 部分之后，我也是得到錯誤。

即使在通過令牌后我也無法理解為什么我得到 HTML 響應而不是 JSON。

我真的很新，這是我的第一個項目，因此我無法理解這背后的內部功能是什么。

Answer 1

來自MDN ：

fetch() promise 不會拒絕 HTTP 錯誤（404 等）。

當您通過 Accept header for json 時返回 HTML 並不理想，但錯誤通常首先並不理想。 在嘗試解析為 JSON 之前，您可能需要檢查response.status是否為 200。