× Unhandled Rejection (SyntaxError)：JSON 输入意外结束答案

【问题标题】：× Unhandled Rejection (SyntaxError): Unexpected end of JSON input× Unhandled Rejection (SyntaxError)：JSON 输入意外结束
【发布时间】：2020-09-08 19:11:28
【问题描述】：

我有一个 if 语句检查是否定义了访问令牌，如果是，它运行这 2 个获取请求。我有第一个获取请求返回我想要的信息。我只是想记录一个单独的提取请求的输出，该请求从一个单独的端点获取信息...... 我的本地服务器不断返回上面提到的错误，我不明白为什么

这是我要运行的代码。

 componentDidMount() {
    let accessToken = queryString.parse(window.location.search).access_token;
    
    if (accessToken != undefined) {
      //working fetch request..
      fetch('https://api.spotify.com/v1/me', {
        headers: {'Authorization': 'Bearer ' + accessToken}
      }).then((response) => response.json())
      .then((data) => {
        this.setState({
          serverData: {
            user: {
              name: data.display_name,
              profileLink: data.external_urls.spotify,
              images: data.images
            }
          }
        });
        console.log(data);
        console.log(this.state.serverData);
      })

      // breaks on this line
      fetch('https://api.spotify.com/v1/me/player/currently-playing', {
        headers: {'Authorization': 'Bearer ' + accessToken}
      }).then((response) => response.json())
      // here i am simply trying to log the returned data
      .then((data) => console.log(data))
    }
  }

现在我确实相信这可能是一个小的语法错误，但我似乎无法解决它，非常感谢任何煽动这个错误的人，谢谢！

【问题讨论】：

还要注意这是一个非常棘手的请求，因为它正在使用 spotify API 并且需要 O-Auth 才能允许访问，因此您需要自己进行测试，我很遗憾忘记提及这一点。除非你有自己的 spotify O-Auth 后端工作（不知何故哈哈），否则我不会费心尝试从 IDE 运行原始获取请求
您是否已验证响应包含有效的 JSON 负载？当在具有空负载的响应对象上调用 response.json() 时，该错误消息可能很常见。
在控制台中进一步分析响应后，看起来负载确实是问题所在，为该提示欢呼。我必须进一步调查！

标签： javascript reactjs fetch spotify

【解决方案1】：

在 .then() 块之后添加 .catch(error => console.log(error)) 块，以在控制台中查看错误并让我知道错误是什么。你会得到更多这样的信息。

【讨论】：