Question

这是一个两部分问题，第一个是针对我个人情况的，第二个是对事物运作方式的整体理解。

我正在为我的应用程序执行密码重置。电子邮件将与附加到网址的jwt一起发送。用户点击该网址后，系统会将其转到重置密码页面，该页面会触发jwt到componentWillMount功能的操作。然后，此操作将触发fetch：

static verifyResetPasswordToken(token) {
  const obj = JSON.stringify(token);
  return fetch('/api/auth/verifyResetPasswordToken', {
    method: 'POST',
    headers: {
      Accept: 'application/json',
      'Content-Type': 'application/json',
    },
    credentials: 'include',
    body: obj
  })
    .then(res => {
      console.log('THEN');
    })
    .catch(error => {
      console.log('CATCH');
    });
}

在API上我通过获取正文中传递的令牌并检查它是否已过期来处理此问题：

export function verifyResetPasswordToken(req, res, next) {
  const token = jwt.decode(req.body.token);
  if (token.exp > Date.now() / 1000) {
    res.status(200).json();
  } else {
    res.status(401).json();
  }
}

注意我知道这不是检查令牌有效性的安全方法。我只需要弄清楚它是否已经过期。

这就是混乱所在。当401状态返回时，我的承诺被拒绝。我的理解是fetch不会以这种方式处理错误。唯一fetch捕获的是network connectivity，即使400＆amp; 500 http状态错误。知道为什么我的承诺被then()状态拒绝了吗？为什么我要登陆401区块？我该如何避免这种情况发生？如何处理我想在服务器上响应的不同状态？

我的第二个问题围绕着这一切。使用catch并且可能具体fetch React时，处理服务器错误的最佳做法是什么？这是我第一次使用Redux，并且可以理解我应该如何处理服务器端错误的任何亮点都将非常感激。

fetch

Answer 1

As per MDN，正如您已经注意到的，fetch() API仅在遇到“网络错误时拒绝承诺，尽管这通常意味着权限问题或类似问题。”

但是fetch提供了一个ok标志，指示HTTP响应的状态代码是否在成功范围内。

static verifyResetPasswordToken(token) {
  const obj = JSON.stringify(token);
  return fetch('/api/auth/verifyResetPasswordToken', {
    method: 'POST',
    headers: {
      Accept: 'application/json',
      'Content-Type': 'application/json',
    },
    credentials: 'include',
    body: obj
  }).then(res => {
     if (!res.ok) {
       throw Error(res.statusText);
     }
     return res;
  })
    .then(res => {
      console.log('THEN');
    })
    .catch(error => {
      console.log('CATCH');
    });
}

通过获取承诺处理响应错误/ http状态

1 个答案: