API 通过 Javascript (React.js) 使用用户令牌调用（获取）

Question

你们最近还好吗？？

我正在尝试从网站 X（已启用 cors）获取数据（在 React with JS 中），但首先需要从网站 Y 获取用户令牌，但我不知道如何弄清楚。 不知何故，我认为我必须从 Y 获取用户令牌，将其保存在变量中并将其添加为 header 在另一个调用中，但我有点迷失了 GET/POST 方法。

到目前为止，我所拥有的是这个但不知何故不起作用，我认为我没有正确发送头部或正确地进行实际调用：

getToken(){
  const url = 'websiteOfTheToken';
  const response = await fetch(url);
  const data = await response.json();
  this.setState({
    userToken: data.image
  });
}

和：

getData(){
 const response = await fetch('websiteOfTheData', {
    method: 'POST', 
    mode: 'no-cors', 
    cache: 'no-cache', 
    credentials: 'same-origin',
    headers: {
      'accept': 'application/json',
      'Content-Type': 'application/json'
    },
    redirect: 'follow', 
    referrerPolicy: 'no-referrer',
    body: JSON.stringify({
      title: '' // I don't know what is this doing
    }) 
    }).catch( error => {
    console.log('Error fetching and parsing data ', error)
    });

  this.setState({
    data: response.json()
  });
}

先感谢您！！

Answer 1

我想说/问的几件事：

1. 通常，您在成功登录后获得令牌，因此对令牌的标准请求将是带有用户数据的发布请求。
2. javascript 中的await仅适用于async函数，请阅读相关内容。
3. 处理 api 响应（承诺）的最常见做法是使用then-catch块，阅读它。
4. 您需要附加到请求的典型 JWT header 如下所示： "Authorization": "Bearer theactualtoken1234" 。
5. fetch post 请求的body是您发送到服务器的实际数据。 所以它的内容是完全任意的——我也不知道这个"title": ""在做什么......