使用Axios和React Native刷新访问令牌

时间:2020-08-26 13:14:32

标签: reactjs react-native axios

在我的应用中,如果任何请求均出现401错误,我想刷新访问令牌。但是,当我查看日志时,会看到一些奇怪的行为。令牌刷新后,原始请求将自动再次发送,但失败并出现401错误。如果我尝试手动发送请求,则该请求会通过,并且我会收到200状态代码。我的问题是,即使令牌已成功刷新,为什么还会失败?

这是拦截器代码:

axios.interceptors.response.use((response) => {
  return response
}, async function (error) {
  
  const orignalRequest = error.config;
  console.log("interceptors response returned with error for URL " + orignalRequest.url)

  if(error.response.status === 401 && orignalRequest.url === ISSUE_TOKEN_URL) {
    console.log("interceptors response returned with error code 401 and url is: " + ISSUE_TOKEN_URL)
    return Promise.reject(error)
  }
  if(error.response.status === 401 && !orignalRequest._retry) {
    
    console.log("interceptors response returned with error code 401 and originalRequst._retry is: " + orignalRequest._retry)
  
    orignalRequest._retry = true;
    const state = store().getState();
    const oldRefresToken = state.isTokenValid.token.refresh_token;
    let config = {headers: { 'content-type': 'application/x-www-form-urlencoded' } }
    console.log("old refresh token is: " + oldRefresToken + " trying to refresh token")

    return axios.post(ISSUE_TOKEN_URL, qs.stringify({
      grant_type: "refresh_token",
      client_id: "paylo",
      client_secret: "secret",
      refresh_token: oldRefresToken

    }), config).then(res => {
      console.log("axios returned with success after refresh attempt")
      let jsonResponse = res.data;
      let expirationDate = new Date().getTime() + jsonResponse["expires_in"] * 1000;
      jsonResponse = {...jsonResponse, expirationDate};
      console.log("new token data is: " + JSON.stringify(jsonResponse))
      storeData('tokenData',JSON.stringify(jsonResponse));
      axios.defaults.headers.common['Authorization'] = 'Bearer ' + jsonResponse["access_token"];
      return axios(orignalRequest)
    }).catch( err => {
      console.log("axios returned with error after refresh attempt. error is: " + err)
    });
  }
  return Promise.reject(error);
});

这是我在日志中看到的:

NetworkService.ts:49 interceptors response returned with error for URL initial_request_url 
NetworkService.ts:57 interceptors response returned with error code 401 and originalRequst._retry is: undefined
NetworkService.ts:63 old refresh token is: "token_value" trying to refresh token
NetworkService.ts:72 axios returned with success after refresh attemp
NetworkService.ts:76 new token data is: {"id_token": "some data here"}
NetworkService.ts:49 interceptors response returned with error for URL initial_request_url
NetworkService.ts:82 axios returned with error after refresh attemp. error is: Error: Request failed with status code 401

我不知道日志的最后两行来自哪里,如果刷新成功,什么原因会导致失败?

0 个答案:

没有答案