1

目前为我的反应应用程序使用 AWS Cognito 开发工具包。目前,在调用 API 时,我使用 ComponentWillMount 运行会话检查

componentWillMount() {
  if (!this.props.authenticated) {
    this.props.history.push('/auth/login');
  } else {
    getUserFromLocalStorage()
      .then(data => {
        console.log('getUserFromLocalStorage');
        this.props.setUserToReduxState(data);

        console.log(
          'user sucess retrieved from local storage and usersettoreduxstate: ',
          data
        )
        .then(console.log('after local test'))
      })

      .catch(() => {
        logoutUserFromReduxState();
      });
  }
}

在 componentDidMount 中,我使用本地存储中的 JWT 令牌调用 API

componentDidMount() {
// calls API with localStage.jwtToken
this.loadData();
}

这在大多数情况下都有效,但是当令牌过期时,JWT 会被刷新,这一切都会得到处理,但是当最初调用 API 时,它会被旧的 JWT 调用。我可以看到新的 JWT 在 redux 中被刷新,但它在调用 API 之前被刷新。

是否有任何建议可以确保在进行每个 API 调用之前,在 API 调用中使用之前在 redux 中刷新和更新令牌?

4

1 回答 1

1

这可能是由于 javascript 的异步特性造成的。只要确保this.lodaData()等待刷新令牌即可。

例如,componentWillMount运行身份验证部分并且在调用componentDidMount之前不等待身份验证函数完成运行API

现在这不能通过分离身份验证部分和API我现在的头顶来完成,但是您可以将它们全部放在同一个事件中,componentWillMount或者componentDidMount确保在所有身份验证之后调用 API 调用。像下面的东西

refreshToken() {
    return new Promise((resolve, reject) => {
        //refresh token
        resolve()
    })
}

componentDidMount(){
    this.refreshToken().then(() => {
        //API call
    })
}
于 2018-04-04T00:45:01.093 回答