fix failed to call api after refresh page

pkg/api/tokens.go

@@ -146,14 +146,21 @@ func (a *TokensApi) TokenRefreshHandler(c *core.Context) (interface{}, *errs.Err
 	}
 
 	oldTokenClaims := c.GetTokenClaims()
-	err = a.tokens.DeleteTokenByClaims(oldTokenClaims)
-
-	if err != nil {
-		log.WarnfWithRequestId(c, "[token.TokenRefreshHandler] failed to revoke token \"id:%s\" for user \"uid:%d\", because %s", oldTokenClaims.UserTokenId, user.Uid, err.Error())
+	oldUserTokenId, _ := utils.StringToInt64(oldTokenClaims.UserTokenId)
+	oldTokenRecord := &models.TokenRecord{
+		Uid: uid,
+		UserTokenId: oldUserTokenId,
+		CreatedUnixTime: oldTokenClaims.IssuedAt,
 	}
 
 	c.SetTokenClaims(claims)
 
 	log.InfofWithRequestId(c, "[token.TokenRefreshHandler] user \"uid:%d\" token refreshed, new token will be expired at %d", user.Uid, claims.ExpiresAt)
-	return token, nil
+
+	refreshResp := &models.TokenRefreshResponse{
+		NewToken: token,
+		OldTokenId: a.tokens.GenerateTokenId(oldTokenRecord),
+	}
+
+	return refreshResp, nil
 }

pkg/models/token_record.go

@@ -18,6 +18,11 @@ type TokenRevokeRequest struct {
 	TokenId string `json:"tokenId" binding:"required,notBlank"`
 }
 
+type TokenRefreshResponse struct {
+	NewToken   string `json:"newToken"`
+	OldTokenId string `json:"oldTokenId"`
+}
+
 type TokenInfoResponse struct {
 	TokenId   string         `json:"tokenId"`
 	TokenType core.TokenType `json:"tokenType"`

src/lib/services.js

@@ -1,6 +1,9 @@
 import axios from 'axios';
 import userState from "./userstate.js";
 
+let needBlockRequest = false;
+let blockedRequests = [];
+
 axios.defaults.baseURL = '/api';
 axios.interceptors.request.use(config => {
     const token = userState.getToken();
@@ -9,6 +12,18 @@ axios.interceptors.request.use(config => {
         config.headers.Authorization = `Bearer ${token}`;
     }
 
+    if (needBlockRequest && !config.ignoreBlocked) {
+        return new Promise(resolve => {
+            blockedRequests.push(newToken => {
+                if (newToken) {
+                    config.headers.Authorization = `Bearer ${newToken}`;
+                }
+
+                resolve(config);
+            });
+        });
+    }
+
     return config;
 }, error => {
     return Promise.reject(error);
@@ -70,7 +85,29 @@ export default {
         return axios.get('logout.json');
     },
     refreshToken: () => {
-        return axios.post('v1/tokens/refresh.json');
+        needBlockRequest = true;
+
+        return axios.post('v1/tokens/refresh.json', {} , {
+            ignoreBlocked: true
+        }).then(response => {
+            const data = response.data;
+
+            if (data && data.success && data.result && data.result.newToken) {
+                userState.updateToken(data.result.newToken);
+
+                if (data.result.oldTokenId) {
+                    axios.post('v1/tokens/revoke.json', {
+                        tokenId: data.result.oldTokenId
+                    });
+                }
+            }
+
+            needBlockRequest = false;
+            return data.result.newToken;
+        }).then(newToken => {
+            blockedRequests.forEach(func => func(newToken));
+            blockedRequests.length = 0;
+        });
     },
     getProfile: () => {
         return axios.get('v1/users/profile/get.json');

src/mobile-main.js

@@ -95,13 +95,7 @@ Vue.prototype.$setLanguage(settings.getLanguage() || getDefaultLanguage());
 
 // refresh token if user is logined
 if (userstate.isUserLogined()) {
-    services.refreshToken().then(response => {
-        const data = response.data;
-
-        if (data && data.success && data.result) {
-            userstate.updateToken(data.result);
-        }
-    });
+    services.refreshToken();
 }
 
 new Vue({