承诺不等待解决或拒绝 - javascript - ReactJs

Question

I use to token authentication for my react spa app. Before I CRUD process, I check refresh token expiration time. If refresh token is valid, No problem but If is'nt valid it, I send old refresh token and receive new refresh and access token from server before crud. No problem until this point.

Problem is the refresh mechanism completes without waiting for the response from the server.

currentUser store the token value. I check null control for token and then if expiration time not valid, I send old refresh token.

At this point the function returns without waiting for the response of the authenticationService.createAccessTokenByRefreshToken function. Function must be wait this function because If access token is not valid, I need new one.

Why does the function end without waiting?

export function authHeader() {
    var authorization = {
        Authorization: ''
    };

    var currentUser = authenticationService.currentUserValue;

    if (currentUser && currentUser.token) {
        const refreshToken = currentUser.refreshToken;
        const expiration = currentUser.expiration;
        var moment = require('moment');
        var now = moment();

        if (moment(now).isAfter(expiration)) {
            authenticationService.createAccessTokenByRefreshToken(refreshToken).then((res) => {
                authorization.Authorization = `Bearer ${res.data.token}`;
                return Promise.resolve(authorization);
            });
        }
        else {
            authorization.Authorization = `Bearer ${currentUser.token}`;
            return Promise.resolve(authorization);
        }

        //return { Authorization: `Bearer ${currentUser.token}` };
    } else {
        return Promise.reject(authorization);
    }
}

Answer 1

if (moment(now).isAfter(expiration)) {
  authenticationService.createAccessTokenByRefreshToken(refreshToken).then((res) => {
    authorization.Authorization = `Bearer ${res.data.token}`;
    return Promise.resolve(authorization);
  });
}

This block of code needs a return statement. At the moment it's implicitly returning undefined. Also, a small thing: if you're in a .then you don't need to do Promise.resolve(authorization), you can just return authorization . The .then creates a new promise for you.

if (moment(now).isAfter(expiration)) {
  return authenticationService.createAccessTokenByRefreshToken(refreshToken)
    .then((res) => {
      authorization.Authorization = `Bearer ${res.data.token}`;
      return authorization;
    });
}

Answer 2

please start using async await . It makes your life easier and much readable code with fewer bugs. Let me know if the following works fine for you:)

const moment = require("moment");

const authHeader = async () => {
  try {
    const authorization = {
      Authorization: ""
    };

    const currentUser = authenticationService.currentUserValue;

    if (currentUser && currentUser.token) {
      const refreshToken = currentUser.refreshToken;
      const expiration = currentUser.expiration;
      const now = moment();

      if (moment(now).isAfter(expiration)) {
        const authResponse = await authenticationService.createAccessTokenByRefreshToken(
          refreshToken
        );
        authorization.Authorization = `Bearer ${authResponse.data.token}`;
      } else {
        authorization.Authorization = `Bearer ${currentUser.token}`;
      }
    }

    return authorization;
  } catch (err) {
    return err;
  }
};

export default authHeader;